Router: caching (#247)

* frint-router: caching.

* frint-router: coverage.

* frint-router: caching docs.

* examples: require packages from local node_modules.

Author: fahad19

examples/router/vendors/index.js

@@ -4,6 +4,5 @@ window.Rx = require('rxjs');
 window.Frint = require('frint');
 window.FrintStore = require('frint-store');
 window.FrintReact = require('frint-react');
-
-window.FrintRouter = require('../../../packages/frint-router');
-window.FrintRouterReact = require('../../../packages/frint-router-react');
+window.FrintRouter = require('frint-router');
+window.FrintRouterReact = require('frint-router-react');

packages/frint-router/README.md

@@ -108,6 +108,14 @@ All of them implement the same set of methods.
 
 ## BrowserRouterService
 
+### constructor
+
+#### Arguments
+
+1. `options` (`Object`)
+  * `options.enableCache` (`Boolean`): Enables caching, set to `true` by default.
+  * `options.cacheLimit` (`Number`): Maximum limit of entries to cache, set to `10000` by default.
+
 ### getHistory$
 
 > getHistory$()
@@ -139,7 +147,6 @@ Keeps matching pattern against history as it keeps changing over time.
 1. `pattern` (`String`): Pattern to match against
 1. `options` (`Object`)
   * `options.exact` (`Boolean`): Matches pattern exactly, defaults to `false`.
-  * `options.cache` (`Boolean`): Cache matches (TODO)
 
 #### Returns
 

packages/frint-router/src/makeRouterService.js

@@ -5,7 +5,14 @@ import matchFromHistory from './matchFromHistory';
 export default function makeRouterService(createHistory) {
   class RouterService {
     constructor(options = {}) {
-      this.options = options;
+      const defaultOptions = {
+        enableCache: true,
+        cacheLimit: 10000,
+      };
+      this.options = {
+        ...defaultOptions,
+        ...options,
+      };
       this._history = createHistory(options);
 
       this._history$ = new BehaviorSubject({
@@ -21,6 +28,9 @@ export default function makeRouterService(createHistory) {
           action,
         });
       });
+
+      this._cache = {};
+      this._cacheCount = 0;
     }
 
     getHistory$() {
@@ -50,12 +60,27 @@ export default function makeRouterService(createHistory) {
     getMatch(pattern, history, opts = {}) { // eslint-disable-line
       const options = {
         exact: false,
-        cache: true, // @TODO: implement later
         ...opts,
       };
+      const cacheKey = `${pattern}|${history.location.pathname}|${options.exact}`;
+
+      if (
+        this.options.enableCache &&
+        this._cache[cacheKey]
+      ) {
+        return this._cache[cacheKey];
+      }
 
       const matched = matchFromHistory(pattern, history, options);
 
+      if (
+        this.options.enableCache &&
+        this._cacheCount < this.options.cacheLimit
+      ) {
+        this._cache[cacheKey] = matched;
+        this._cacheCount += 1;
+      }
+
       return matched;
     }
 

packages/frint-router/src/makeRouterService.spec.js

@@ -14,7 +14,7 @@ describe('frint-router › makeRouterService', function () {
     const MemoryRouterService = makeRouterService(createMemoryHistory);
 
     const router = new MemoryRouterService({ foo: 'foo' });
-    expect(router.options).to.deep.equal({ foo: 'foo' });
+    expect(router.options).to.contain({ foo: 'foo' });
   });
 
   describe('MemoryRouter', function () {
@@ -93,7 +93,7 @@ describe('frint-router › makeRouterService', function () {
       const router = new MemoryRouterService();
 
       router.getMatch$('/about')
-        .take(3)
+        .take(4)
         .scan(
           (matches, currentMatch) => matches.concat([currentMatch]),
           []
@@ -113,13 +113,21 @@ describe('frint-router › makeRouterService', function () {
 
             // second push
             null,
+
+            // third push
+            {
+              url: '/about',
+              isExact: true,
+              params: {},
+            },
           ]);
 
           done();
         });
 
       router.push('/about');
       router.push('/');
+      router.push('/about');
     });
 
     it('destroys listener', function (done) {