From 2090f640e1b00d799cb390dd60caedd3a05fa35b Mon Sep 17 00:00:00 2001
From: Charles Lyding <charles@thunderpos.com>
Date: Thu, 11 May 2017 14:07:15 -0400
Subject: [PATCH] feat(@angular/cli): improve common bundling performance

---
 .../cli/models/webpack-configs/browser.ts     |  5 ++
 tests/e2e/tests/misc/common-async.ts          | 60 +++++++++++++++++++
 2 files changed, 65 insertions(+)
 create mode 100644 tests/e2e/tests/misc/common-async.ts

diff --git a/packages/@angular/cli/models/webpack-configs/browser.ts b/packages/@angular/cli/models/webpack-configs/browser.ts
index 06cd02503829..782daaf5f232 100644
--- a/packages/@angular/cli/models/webpack-configs/browser.ts
+++ b/packages/@angular/cli/models/webpack-configs/browser.ts
@@ -59,6 +59,11 @@ export function getBrowserConfig(wco: WebpackConfigOptions) {
       new BaseHrefWebpackPlugin({
         baseHref: buildOptions.baseHref
       }),
+      new webpack.optimize.CommonsChunkPlugin({
+        async: 'common',
+        children: true,
+        minChunks: 2
+      }),
       new webpack.optimize.CommonsChunkPlugin({
         minChunks: Infinity,
         name: 'inline'
diff --git a/tests/e2e/tests/misc/common-async.ts b/tests/e2e/tests/misc/common-async.ts
new file mode 100644
index 000000000000..b2b2ba8dd017
--- /dev/null
+++ b/tests/e2e/tests/misc/common-async.ts
@@ -0,0 +1,60 @@
+import {readdirSync} from 'fs';
+import {oneLine} from 'common-tags';
+
+import {ng, npm} from '../../utils/process';
+import {addImportToModule} from '../../utils/ast';
+import {appendToFile} from '../../utils/fs';
+
+
+export default function() {
+  let oldNumberOfFiles = 0;
+  return Promise.resolve()
+    .then(() => ng('build'))
+    .then(() => oldNumberOfFiles = readdirSync('dist').length)
+    .then(() => ng('generate', 'module', 'lazyA', '--routing'))
+    .then(() => ng('generate', 'module', 'lazyB', '--routing'))
+    .then(() => addImportToModule('src/app/app.module.ts', oneLine`
+      RouterModule.forRoot([{ path: "lazyA", loadChildren: "./lazy-a/lazy-a.module#LazyAModule" }]),
+      RouterModule.forRoot([{ path: "lazyB", loadChildren: "./lazy-b/lazy-b.module#LazyBModule" }])
+      `, '@angular/router'))
+    .then(() => ng('build'))
+    .then(() => readdirSync('dist').length)
+    .then(currentNumberOfDistFiles => {
+      if (oldNumberOfFiles >= currentNumberOfDistFiles) {
+        throw new Error('A bundle for the lazy module was not created.');
+      }
+      oldNumberOfFiles = currentNumberOfDistFiles;
+    })
+    .then(() => npm('install', 'moment'))
+    .then(() => appendToFile('src/app/lazy-a/lazy-a.module.ts', `
+      import * as moment from 'moment';
+      console.log(moment);
+    `))
+    .then(() => ng('build'))
+    .then(() => readdirSync('dist').length)
+    .then(currentNumberOfDistFiles => {
+      if (oldNumberOfFiles != currentNumberOfDistFiles) {
+        throw new Error('The build contains a different number of files.');
+      }
+    })
+    .then(() => appendToFile('src/app/lazy-b/lazy-b.module.ts', `
+      import * as moment from 'moment';
+      console.log(moment);
+    `))
+    .then(() => ng('build'))
+    .then(() => readdirSync('dist').length)
+    .then(currentNumberOfDistFiles => {
+      if (oldNumberOfFiles >= currentNumberOfDistFiles) {
+        throw new Error('A bundle for the common async module was not created.');
+      }
+      oldNumberOfFiles = currentNumberOfDistFiles;
+    })
+    // Check for AoT and lazy routes.
+    .then(() => ng('build', '--aot'))
+    .then(() => readdirSync('dist').length)
+    .then(currentNumberOfDistFiles => {
+      if (oldNumberOfFiles != currentNumberOfDistFiles) {
+        throw new Error('AoT build contains a different number of files.');
+      }
+    });
+}