Replace path-to-regexp with wayfarer

Trie-based, more sensible to read, smaller footprint, more concise implementation

Author: aduth

package-lock.json

@@ -38,6 +38,7 @@
     "babel-plugin-transform-react-display-name": "6.25.0",
     "babel-plugin-transform-react-jsx": "6.24.1",
     "babel-plugin-transform-runtime": "6.23.0",
+    "babel-plugin-unassert": "2.1.2",
     "babel-preset-env": "1.6.0",
     "babel-preset-stage-2": "6.24.1",
     "babel-register": "6.26.0",
@@ -73,14 +74,14 @@
     "flatpickr": "3.0.7",
     "lodash": "4.17.4",
     "memize": "1.0.4",
-    "path-to-regexp": "2.0.0",
     "preact": "8.2.5",
     "preact-redux": "2.0.3",
     "querystringify": "1.0.0",
     "redux": "3.7.2",
     "redux-multi": "0.1.12",
     "refx": "2.1.0",
     "rememo": "2.3.3",
-    "textarea-caret": "3.0.2"
+    "textarea-caret": "3.0.2",
+    "wayfarer": "6.6.2"
   }
 }

package.json

@@ -1,8 +1,7 @@
 /**
  * External dependencies
  */
-import pathToRegexp from 'path-to-regexp';
-import { map } from 'lodash';
+import wayfarer from 'wayfarer';
 import { parse } from 'querystringify';
 import memoize from 'memize';
 
@@ -15,45 +14,23 @@ import TagsRoute from './tags';
 import TagRoute from './tag';
 import NotFoundRoute from './not-found';
 
-export const routes = map( [
-	[ '/', HomeRoute ],
-	[ '/date/:date/', DateRoute ],
-	[ '/tags/:tag/page/:page', TagRoute ],
-	[ '/tags/:tag', TagRoute ],
-	[ '/tags/', TagsRoute ],
-	[ '*', NotFoundRoute ],
-], ( [ path, Route ] ) => {
-	const keys = [];
+const withParams = ( Route ) => ( params ) => [ params, Route ];
 
-	return {
-		path,
-		keys,
-		Route,
-		regexp: pathToRegexp( path, keys ),
-	};
-} );
+const router = wayfarer();
+router.on( '/', withParams( HomeRoute ) );
+router.on( '/date/:date', withParams( DateRoute ) );
+router.on( '/tags/:tag/page/:page', withParams( TagRoute ) );
+router.on( '/tags/:tag', withParams( TagRoute ) );
+router.on( '/tags', withParams( TagsRoute ) );
+router.on( '*', withParams( NotFoundRoute ) );
 
 export const getRouteByPath = memoize( ( path ) => {
 	const [ pathname, search = '' ] = path.split( '?' );
+	const [ params, Route ] = router( pathname.replace( /\/$/, '' ) );
 
-	for ( let r = 0, rl = routes.length; r < rl; r++ ) {
-		const { regexp, keys, Route } = routes[ r ];
-		const match = pathname.match( regexp );
-		if ( ! match ) {
-			continue;
-		}
-
-		const params = {};
-		for ( let m = 1, ml = match.length; m < ml; m++ ) {
-			params[ keys[ m - 1 ].name ] = decodeURIComponent( match[ m ] );
-		}
-
-		return {
-			params,
-			Route,
-			query: parse( search ),
-		};
-	}
-
-	return {};
+	return {
+		params,
+		Route,
+		query: parse( search ),
+	};
 } );

src/routes/index.js

@@ -19,11 +19,11 @@ const config = module.exports = {
 			'fast-stable-stringify',
 			'flatpickr',
 			'memize',
-			'path-to-regexp',
 			'preact',
 			'preact-redux',
 			'refx',
 			'textarea-caret',
+			'wayfarer',
 		],
 	},
 	output: {
@@ -72,6 +72,19 @@ if ( 'production' === NODE_ENV ) {
 		include: __dirname + '/src/state',
 	} );
 
+	// The Wayfarer module uses `assert` to validate incoming arguments. This
+	// is a non-trivial dependency, and not desirable for production.
+	config.module.rules.unshift( {
+		test: /\.js$/,
+		use: {
+			loader: 'babel-loader',
+			options: {
+				plugins: [ 'unassert' ],
+			},
+		},
+		include: __dirname + '/node_modules/wayfarer',
+	} );
+
 	config.module.rules.push( {
 		test: /\.s?css$/,
 		use: ExtractTextPlugin.extract( {