feat(reducers): cache reducer for increased performance - @puppybits

[puppybits]

This fixes massive performance issues we had using both Firestore & redux-firestore in production. Running a transaction update must round-trip to the server before being reflected in Redux. The mutate + cache reducer allows changes to be reflected in redux synchronously with no additional work.

There are no breaking changes. But it does adds id & path properties to all results. Mostly it add the new cache reducer for synchronous optimistic updates. And it adds a new mutate function which the cache reducer uses to reflect changes synchronously.

• New unit tests for cache reducer & mutate all pass.
• Numerous performance tuning done on the cache reducer for large, complex datasets.
• Handles firestore rejects & offline saving (via onSnapshot.includesMetadataChanges)

Description

• Cache Reducer. UI feels instantaneous to users.
  • Enables synchronous optimistic updates for new, deleted & updated data.
  • All data changes synchronously reflected in the cache reducer queries.
  • Once Firestore approves/rejects a change it also removes the optimistic commit.

// selector for cache reducer
(state) => state.firebase.firestore.cache[myStoreAs].docs;

// access a read-only fragment of Firestore based on all active queries
const document = state.firebase.firestore.cache.database[full_path_to_collection][document_id];

• Mutate. Simplifies saving, batching and transactions.
  • Easily switch between single saves and atomic transactions.
  • Simplifies complex saves that have to coordinate through multiple redux actions.
  • Synchronously updates queries in the cache reducer for the UI to feel immediately responsive to all changes.

// single save
getFirestore().mutate({collection: 'tasks', doc: 'task-1', data: {status: 2}});
// batch
getFirestore().mutate([
  {collection: 'tasks', doc: 'task-1', data: {status: 2}},
  {collection: 'tasks', doc: 'task-2', data: {status: 2}},
]);
// transaction, read results use dependency injection for write functions.
getFirestore().mutate({
  reads: { task1: {collection: 'tasks', doc: 'task-1'} },
  writes: [ ({task1}) => ({collection: 'tasks', doc: task1.id, data: { status: task1.status +1 })) ]
});

Check List

If not relevant to pull request, check off as complete

• All tests passing
• Docs updated with any changes or examples if applicable
• Added tests to ensure new feature(s) work properly

Relevant Issues

• Immediate mode: instant, synchronous document updates #323

[prescottprue]

Thanks so much for these amazing changes, the tests, and keep an eye on keeping changes backwards compatible - apologies it took so long to get these in. Cycles should be shorter moving forward

[prescottprue]

I've noticed a few things which I addressed including eslint warnings/errors.

Working on cleaning up in the v0.16.0 PR before releasing which includes

• adding back removed reducers - these can be deprecated if we really think they should be removed
• removing the performance util - want to make sure we can have this in without impacting bundle size as much for production build
• removing debug - adding a debug/log util was planned to happen all at once after a bit of research. Debug dependency adds size - we can do this separately (your changes which log whats happening clearly will be revived once this is done)

One of the new tests is failing though, so I'll need to debug a bit more: https://github.com/prescottprue/redux-firestore/runs/4296991419?check_suite_focus=true#step:6:423