Project Fundementals

When using serverless applications, it’s ideal to minimize the amount of data that is queried and sent to the client. s5pack is built on the concept of query only what is needed and then store it in cache. If updates occur, graphql Subscriptions are used to update the clients’ caches.

Apollo Client Caching

Apollo Client is a powerful library for managing data in client-side applications. It provides a caching mechanism that helps reduce the amount of data sent to the client and ensures that data is consistent across the application.

By default, Apollo Client uses a normalized cache to store and manage data. This means that when a query is executed, the result is stored in the cache in a normalized format. If the same query is executed again, the cached result is returned instead of making a new network request.

This caching strategy helps reduce the amount of data sent to the client and ensures that data is consistent across the application.

The screenshot below shows the cache structure of the client application when quering the plan and tenant information. The ROOT_QUERY is the entry point for the query and the data is stored in the cache as a normalized format. This screeshot displays the Apolo Client Devtools browser extension.

The tenant and plan data is stored in the ROOT_QUERY.tenant and ROOT_QUERY.plan. When clicking the Plan:dev_businwss_plan yop can see trhe plan data from the database below:

If mutations occur, the cache will be updated by default as long as the keys match.

GraphQL Subscriptions

s5pack uses graphQL subscriptions to update the clients when data changes in the database. Deciding on how and when to use subscriptions is key to a performant application. If data is frequently updated, subscriptions may not be beneficial. However, if data is infrequently updated, subscriptions can be a great way to keep the client in sync with the server.

s5pack also targets pages that the client visits and uses a Subscription Bus to subscribe to graphql updates. For example if a client visits the users page, the client will subscribe to updates to that data. Then even if the client navigates to a different page, they will still receive updates via the graphQL subscription if data has changed in the database. This is a powerful feature that allows for real-time updates to the client without having to manually refresh the page and query all the data again AS WELL AS managing the use of graphql subscriptions only when necessary, further minimising the amount of data sent to the client.