This is a quick screen recording riff on Apollo best practices / gotchas for folks.
It’s not very clear from the docs but there are a few great posts worth reading that consolidated leveraging Apollo for us at Leftlane:
- Apollo is not just a client for making GraphQL queries; it also functions as a data store. It organizes the entire front end and interacts with React. It utilizes a cache that can be viewed and accessed using the Apollo extension in the development tools.
- It is crucial to ensure that all queries for a specific type return an ID. This allows the data to be normalized and stored in the cache effectively. If the ID is not returned, the cache won’t be properly updated, and components relying on that data may not re-render correctly.
- When dealing with nested relations or lists in queries, Apollo may face challenges in updating the cache. In such cases, manual intervention is required to update the cache for those specific relations. It may involve refetching or writing custom queries to handle insertions or deletions to the related data.
- Demystifying Cache Normalization - Apollo GraphQL Blog
- Apollo Client & Client-side Architecture Basics - Apollo GraphQL Blog
Might be other FE areas of interest such as testing strategies, code organization and so on if folks are interested.