Merge pull request #76 from kidroca/kidroca/onyx-cache

Feature: Onyx Cache

Author: marcaaron

lib/Onyx.js

@@ -3,6 +3,7 @@ import AsyncStorage from '@react-native-community/async-storage';
 import Str from 'expensify-common/lib/str';
 import lodashMerge from 'lodash/merge';
 import {registerLogger, logInfo, logAlert} from './Logger';
+import cache from './OnyxCache';
 
 // Keeps track of the last connectionID that was used so we can keep incrementing it
 let lastConnectionID = 0;
@@ -34,17 +35,56 @@ let defaultKeyStates = {};
  * @returns {Promise<*>}
  */
 function get(key) {
-    return AsyncStorage.getItem(key)
-        .then(val => JSON.parse(val))
+    // When we already have the value in cache - resolve right away
+    if (cache.hasCacheForKey(key)) {
+        return Promise.resolve(cache.getValue(key));
+    }
+
+    const taskName = `get:${key}`;
+
+    // When a value retrieving task for this key is still running hook to it
+    if (cache.hasPendingTask(taskName)) {
+        return cache.getTaskPromise(taskName);
+    }
+
+    // Otherwise retrieve the value from storage and capture a promise to aid concurrent usages
+    const promise = AsyncStorage.getItem(key)
+        .then((val) => {
+            const parsed = val && JSON.parse(val);
+            cache.set(key, parsed);
+            return parsed;
+        })
         .catch(err => logInfo(`Unable to get item from persistent storage. Key: ${key} Error: ${err}`));
+
+    return cache.captureTask(taskName, promise);
 }
 
 /**
  * Returns current key names stored in persisted storage
  * @returns {Promise<string[]>}
  */
 function getAllKeys() {
-    return AsyncStorage.getAllKeys();
+    // When we've already read stored keys, resolve right away
+    const storedKeys = cache.getAllKeys();
+    if (storedKeys.length > 0) {
+        return Promise.resolve(storedKeys);
+    }
+
+    const taskName = 'getAllKeys';
+
+    // When a value retrieving task for all keys is still running hook to it
+    if (cache.hasPendingTask(taskName)) {
+        return cache.getTaskPromise(taskName);
+    }
+
+    // Otherwise retrieve the keys from storage and capture a promise to aid concurrent usages
+    const promise = AsyncStorage.getAllKeys()
+        .then((keys) => {
+            _.each(keys, key => cache.addKey(key));
+            return keys;
+        });
+
+    return cache.captureTask(taskName, promise);
 }
 
 /**
@@ -58,6 +98,19 @@ function isCollectionKey(key) {
     return _.contains(_.values(onyxKeys.COLLECTION), key);
 }
 
+/**
+ * Find the collection a collection item belongs to
+ * or return null if them item is not a part of a collection
+ * @param {string} key
+ * @returns {string|null}
+ */
+function getCollectionKeyForItem(key) {
+    return _.chain(onyxKeys.COLLECTION)
+        .values()
+        .find(name => key.startsWith(name))
+        .value();
+}
+
 /**
  * Checks to see if a given key matches with the
  * configured key of our connected subscriber
@@ -350,6 +403,43 @@ function connect(mapping) {
     return connectionID;
 }
 
+/**
+ * Remove cache items that are no longer connected through Onyx
+ * @param {string} key
+ */
+function cleanCache(key) {
+    const hasRemainingConnections = _.some(callbackToStateMapping, {key});
+
+    // When the key is still used in other places don't remove it from cache
+    if (hasRemainingConnections) {
+        return;
+    }
+
+    // When this is a collection - also recursively remove any unused individual items
+    if (isCollectionKey(key)) {
+        cache.remove(key);
+
+        getAllKeys().then(cachedKeys => _.chain(cachedKeys)
+            .filter(name => name.startsWith(key))
+            .forEach(cleanCache));
+
+        return;
+    }
+
+    // When this is a collection item - check if the collection is still used
+    const collectionKey = getCollectionKeyForItem(key);
+    if (collectionKey) {
+        // When there's an active subscription for a collection don't remove the item
+        const hasRemainingConnectionsForCollection = _.some(callbackToStateMapping, {key: collectionKey});
+        if (hasRemainingConnectionsForCollection) {
+            return;
+        }
+    }
+
+    // Otherwise remove the item from cache
+    cache.remove(key);
+}
+
 /**
  * Remove the listener for a react component
  *
@@ -367,7 +457,11 @@ function disconnect(connectionID, keyToRemoveFromEvictionBlocklist) {
         removeFromEvictionBlockList(keyToRemoveFromEvictionBlocklist, connectionID);
     }
 
+    const key = callbackToStateMapping[connectionID].key;
     delete callbackToStateMapping[connectionID];
+
+    // When the last subscriber disconnects, drop cache as well
+    cleanCache(key);
 }
 
 /**
@@ -377,8 +471,13 @@ function disconnect(connectionID, keyToRemoveFromEvictionBlocklist) {
  * @return {Promise}
  */
 function remove(key) {
-    return AsyncStorage.removeItem(key)
-        .then(() => keyChanged(key, null));
+    // Remove from cache
+    cache.remove(key);
+
+    // Optimistically inform subscribers
+    keyChanged(key, null);
+
+    return AsyncStorage.removeItem(key);
 }
 
 /**
@@ -414,12 +513,28 @@ function evictStorageAndRetry(error, ionMethod, ...args) {
  * @returns {Promise}
  */
 function set(key, val) {
+    // Adds the key to cache when it's not available
+    cache.set(key, val);
+
+    // Optimistically inform subscribers
+    keyChanged(key, val);
+
     // Write the thing to persistent storage, which will trigger a storage event for any other tabs open on this domain
     return AsyncStorage.setItem(key, JSON.stringify(val))
-        .then(() => keyChanged(key, val))
         .catch(error => evictStorageAndRetry(error, set, key, val));
 }
 
+/**
+ * AsyncStorage expects array like: [["@MyApp_user", "value_1"], ["@MyApp_key", "value_2"]]
+ * This method transforms an object like {'@MyApp_user': 'myUserValue', '@MyApp_key': 'myKeyValue'}
+ * to an array of key-value pairs in the above format
+ * @param {Record<string, *>} data
+ * @return {Array<[string, string]>} an array of stringified key - value pairs
+ */
+function prepareKeyValuePairsForStorage(data) {
+    return _.keys(data).map(key => [key, JSON.stringify(data[key])]);
+}
+
 /**
  * Sets multiple keys and values. Example
  * Onyx.multiSet({'key1': 'a', 'key2': 'b'});
@@ -428,17 +543,15 @@ function set(key, val) {
  * @returns {Promise}
  */
 function multiSet(data) {
-    // AsyncStorage expenses the data in an array like:
-    // [["@MyApp_user", "value_1"], ["@MyApp_key", "value_2"]]
-    // This method will transform the params from a better JSON format like:
-    // {'@MyApp_user': 'myUserValue', '@MyApp_key': 'myKeyValue'}
-    const keyValuePairs = _.reduce(data, (finalArray, val, key) => ([
-        ...finalArray,
-        [key, JSON.stringify(val)],
-    ]), []);
+    const keyValuePairs = prepareKeyValuePairsForStorage(data);
+
+    _.each(data, (val, key) => {
+        // Update cache and optimistically inform subscribers
+        cache.set(key, val);
+        keyChanged(key, val);
+    });
 
     return AsyncStorage.multiSet(keyValuePairs)
-        .then(() => _.each(data, (val, key) => keyChanged(key, val)))
         .catch(error => evictStorageAndRetry(error, multiSet, data));
 }
 
@@ -522,17 +635,15 @@ function initializeWithDefaultKeyStates() {
  * @returns {Promise<void>}
  */
 function clear() {
-    let allKeys;
     return getAllKeys()
-        .then(keys => allKeys = keys)
-        .then(() => AsyncStorage.clear())
-        .then(() => {
-            _.each(allKeys, (key) => {
+        .then((keys) => {
+            _.each(keys, (key) => {
                 keyChanged(key, null);
+                cache.remove(key);
             });
-
-            initializeWithDefaultKeyStates();
-        });
+        })
+        .then(AsyncStorage.clear)
+        .then(initializeWithDefaultKeyStates);
 }
 
 /**
@@ -551,34 +662,31 @@ function mergeCollection(collectionKey, collection) {
         }
     });
 
-    const existingKeyCollection = {};
-    const newCollection = {};
     return getAllKeys()
-        .then((keys) => {
-            _.each(collection, (data, dataKey) => {
-                if (keys.includes(dataKey)) {
-                    existingKeyCollection[dataKey] = data;
-                } else {
-                    newCollection[dataKey] = data;
-                }
-            });
-
-            const keyValuePairsForExistingCollection = _.reduce(existingKeyCollection, (finalArray, val, key) => ([
-                ...finalArray,
-                [key, JSON.stringify(val)],
-            ]), []);
-            const keyValuePairsForNewCollection = _.reduce(newCollection, (finalArray, val, key) => ([
-                ...finalArray,
-                [key, JSON.stringify(val)],
-            ]), []);
+        .then((persistedKeys) => {
+            // Split to keys that exist in storage and keys that don't
+            const [existingKeys, newKeys] = _.chain(collection)
+                .keys()
+                .partition(key => persistedKeys.includes(key))
+                .value();
+
+            const existingKeyCollection = _.pick(collection, existingKeys);
+            const newCollection = _.pick(collection, newKeys);
+            const keyValuePairsForExistingCollection = prepareKeyValuePairsForStorage(existingKeyCollection);
+            const keyValuePairsForNewCollection = prepareKeyValuePairsForStorage(newCollection);
 
             // New keys will be added via multiSet while existing keys will be updated using multiMerge
             // This is because setting a key that doesn't exist yet with multiMerge will throw errors
             const existingCollectionPromise = AsyncStorage.multiMerge(keyValuePairsForExistingCollection);
             const newCollectionPromise = AsyncStorage.multiSet(keyValuePairsForNewCollection);
 
+            // Merge original data to cache
+            cache.merge(collection);
+
+            // Optimistically inform collection subscribers
+            keysChanged(collectionKey, collection);
+
             return Promise.all([existingCollectionPromise, newCollectionPromise])
-                .then(() => keysChanged(collectionKey, collection))
                 .catch(error => evictStorageAndRetry(error, mergeCollection, collection));
         });
 }