perf/fix(v2): more efficient hot reload & consistent filegen (#1950)

* perf(v2): efficient hot reload, consistent generated file

* changelog

* more

CHANGELOG-2.x.md

@@ -1,6 +1,8 @@
 # Docusaurus 2 Changelog
 
 ## Unreleased
+- More efficient hot reload & consistent generated file. 
+- Set babel `compact` options to `true` which removes "superfluous whitespace characters and line terminators.
 
 ## 2.0.0-alpha.33
 

packages/docusaurus-plugin-content-docs/src/__tests__/index.test.ts

@@ -18,9 +18,6 @@ import {posixPath} from '@docusaurus/utils';
 const createFakeActions = (routeConfigs: RouteConfig[], contentDir) => {
   return {
     addRoute: (config: RouteConfig) => {
-      config.routes.sort((a, b) =>
-        a.path > b.path ? 1 : b.path > a.path ? -1 : 0,
-      );
       routeConfigs.push(config);
     },
     createData: async (name, _content) => {

packages/docusaurus-plugin-content-docs/src/index.ts

@@ -8,7 +8,12 @@
 import globby from 'globby';
 import fs from 'fs-extra';
 import path from 'path';
-import {idx, normalizeUrl, docuHash} from '@docusaurus/utils';
+import {
+  idx,
+  normalizeUrl,
+  docuHash,
+  objectWithKeySorted,
+} from '@docusaurus/utils';
 import {LoadContext, Plugin} from '@docusaurus/types';
 
 import createOrder from './order';
@@ -202,7 +207,7 @@ export default function pluginContentDocs(
         docsDir,
         docsSidebars,
         sourceToPermalink,
-        permalinkToSidebar,
+        permalinkToSidebar: objectWithKeySorted(permalinkToSidebar),
       };
     },
 
@@ -252,7 +257,9 @@ export default function pluginContentDocs(
       addRoute({
         path: docsBaseRoute,
         component: docLayoutComponent,
-        routes,
+        routes: routes.sort((a, b) =>
+          a.path > b.path ? 1 : b.path > a.path ? -1 : 0,
+        ),
         modules: {
           docsMetadata: aliasedSource(docsBaseMetadataPath),
         },

packages/docusaurus-utils/src/__tests__/index.test.ts

@@ -15,6 +15,7 @@ import {
   getSubFolder,
   normalizeUrl,
   posixPath,
+  objectWithKeySorted,
 } from '../index';
 
 describe('load utils', () => {
@@ -82,6 +83,41 @@ describe('load utils', () => {
     });
   });
 
+  test('objectWithKeySorted', () => {
+    const obj = {
+      '/docs/adding-blog': '4',
+      '/docs/versioning': '5',
+      '/': '1',
+      '/blog/2018': '3',
+      '/youtube': '7',
+      '/users/en/': '6',
+      '/blog': '2',
+    };
+    expect(objectWithKeySorted(obj)).toMatchInlineSnapshot(`
+      Object {
+        "/": "1",
+        "/blog": "2",
+        "/blog/2018": "3",
+        "/docs/adding-blog": "4",
+        "/docs/versioning": "5",
+        "/users/en/": "6",
+        "/youtube": "7",
+      }
+    `);
+    const obj2 = {
+      b: 'foo',
+      c: 'bar',
+      a: 'baz',
+    };
+    expect(objectWithKeySorted(obj2)).toMatchInlineSnapshot(`
+      Object {
+        "a": "baz",
+        "b": "foo",
+        "c": "bar",
+      }
+    `);
+  });
+
   test('genChunkName', () => {
     const firstAssert = {
       '/docs/adding-blog': 'docs-adding-blog-062',

packages/docusaurus-utils/src/index.ts

@@ -31,6 +31,15 @@ export async function generate(
   }
 }
 
+export function objectWithKeySorted(obj: Object) {
+  // https://github.com/lodash/lodash/issues/1459#issuecomment-253969771
+  return _(obj)
+    .toPairs()
+    .sortBy(0)
+    .fromPairs()
+    .value();
+}
+
 const indexRE = /(^|.*\/)index\.(md|js)$/i;
 const extRE = /\.(md|js)$/;
 

packages/docusaurus/src/server/index.ts

@@ -116,6 +116,7 @@ export async function load(siteDir: string): Promise<Props> {
     'registry.js',
     `export default {
 ${Object.keys(registry)
+  .sort()
   .map(
     key =>
       `  '${key}': [${registry[key].loader}, ${JSON.stringify(

packages/docusaurus/src/webpack/utils.ts

@@ -89,6 +89,8 @@ export function getBabelLoader(isServer: boolean, babelOptions?: {}): Loader {
       {
         babelrc: false,
         configFile: false,
+        // All optional newlines and whitespace will be omitted when generating code in compact mode
+        compact: true,
         presets: [
           isServer
             ? [