perf(webpack): speed up webpack build by not using file-system and wa…

…tches

speed up webpack build by not using file-system and watches

Uses eval for sourcemaps

config/webpack.config.js

@@ -1,11 +1,14 @@
 var path = require('path');
 var webpack = require('webpack');
 
+var ionicWebpackFactoryPath = path.join(process.env.IONIC_APP_SCRIPTS_DIR, 'dist', 'webpack', 'ionic-webpack-factory.js');
+var ionicWebpackFactory = require(ionicWebpackFactoryPath);
+
 function getEntryPoint() {
   if (process.env.IONIC_ENV === 'prod') {
     return '{{TMP}}/app/main.prod.js';
   }
-  return '{{TMP}}/app/main.dev.js';
+  return '{{SRC}}/app/main.dev.ts';
 }
 
 function getPlugins() {
@@ -19,7 +22,11 @@ function getPlugins() {
       //new DedupePlugin()
     ];
   }
-  return [];
+
+  // for dev builds, use our custom environment
+  return [
+    ionicWebpackFactory.getIonicEnvironmentPlugin()
+  ];
 }
 
 function getSourcemapLoader() {
@@ -30,8 +37,8 @@ function getSourcemapLoader() {
 
   return [
     {
-      test: /\.js$/,
-      loader: path.join(process.env.IONIC_APP_SCRIPTS_DIR, 'dist', 'loaders', 'typescript-sourcemap-loader-memory.js')
+      test: /\.ts$/,
+      loader: path.join(process.env.IONIC_APP_SCRIPTS_DIR, 'dist', 'webpack', 'typescript-sourcemap-loader-memory.js')
     }
   ];
 }
@@ -42,10 +49,10 @@ module.exports = {
     path: '{{BUILD}}',
     filename: 'main.js'
   },
-  devtool: 'source-map',
+  devtool: 'eval',
 
   resolve: {
-    extensions: ['.js', '.json']
+    extensions: ['.js', '.ts', '.json']
   },
 
   module: {

src/spec/ion-compiler.spec.ts

@@ -1,4 +1,5 @@
-import { BuildContext, File } from '../util/interfaces';
+import { FileCache } from '../util/file-cache';
+import { BuildContext } from '../util/interfaces';
 import { dirname, join, resolve } from 'path';
 import { resolveId } from '../plugins/ion-compiler';
 
@@ -33,8 +34,8 @@ describe('ion-compiler', () => {
     it('should return null when importer is not found in list of files', () => {
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, null);
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, null);
 
       // act
       const result = resolveId('importee', importer, context);
@@ -46,8 +47,8 @@ describe('ion-compiler', () => {
     it('should return null when importer content lacks output property', () => {
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, null);
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, null);
 
       // act
       const result = resolveId('importee', importer, context);
@@ -59,8 +60,8 @@ describe('ion-compiler', () => {
     it('should return path to file when file is found with ref to forward dir', () => {
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, {
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, {
         path: importer,
         content: 'fake irrelevant data'
       });
@@ -69,7 +70,7 @@ describe('ion-compiler', () => {
       const importerBasename = dirname(importer);
       const importeeFullPath = resolve(join(importerBasename, importee)) + '.ts';
 
-       context.fileCache.set(importeeFullPath, {
+       context.fileCache.put(importeeFullPath, {
          path: importeeFullPath,
          content: 'someContent'
        });
@@ -85,8 +86,8 @@ describe('ion-compiler', () => {
 
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, {
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, {
         path: importer,
         content: 'fake irrelevant data'
       });
@@ -95,7 +96,7 @@ describe('ion-compiler', () => {
       const importerBasename = dirname(importer);
       const importeeFullPath = resolve(join(importerBasename, importee)) + '.ts';
 
-      context.fileCache.set(importeeFullPath, { path: importeeFullPath, content: null});
+      context.fileCache.put(importeeFullPath, { path: importeeFullPath, content: null});
 
       // act
       const result = resolveId(importee, importer, context);
@@ -108,8 +109,8 @@ describe('ion-compiler', () => {
 
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, {
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, {
         path: importer,
         content: 'fake irrelevant data'
       });
@@ -118,7 +119,7 @@ describe('ion-compiler', () => {
       const importerBasename = dirname(importer);
       const importeeFullPath = join(resolve(join(importerBasename, importee)), 'index.ts');
 
-      context.fileCache.set(importeeFullPath, { path: importeeFullPath, content: null });
+      context.fileCache.put(importeeFullPath, { path: importeeFullPath, content: null });
 
       // act
       const result = resolveId(importee, importer, context);
@@ -131,8 +132,8 @@ describe('ion-compiler', () => {
 
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, {
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, {
         path: importer,
         content: 'fake irrelevant data'
       });
@@ -141,7 +142,7 @@ describe('ion-compiler', () => {
       const importerBasename = dirname(importer);
       const importeeFullPath = join(resolve(join(importerBasename, importee)), 'index.ts');
 
-      context.fileCache.set(importeeFullPath, { path: importeeFullPath, content: null});
+      context.fileCache.put(importeeFullPath, { path: importeeFullPath, content: null});
 
       // act
       const result = resolveId(importee, importer, context);
@@ -153,8 +154,8 @@ describe('ion-compiler', () => {
     it('should return null when importee isn\'t found in memory', () => {
       // arrange
       let context: BuildContext = {};
-      context.fileCache = new Map<string, File>();
-      context.fileCache.set(importer, {
+      context.fileCache = new FileCache();
+      context.fileCache.put(importer, {
         path: importer,
         content: 'fake irrelevant data'
       });

src/transpile.ts

@@ -1,3 +1,4 @@
+import { FileCache } from './util/file-cache';
 import { BuildContext, File } from './util/interfaces';
 import { BuildError, Logger } from './util/logger';
 import { buildJsSourceMaps } from './bundle';
@@ -36,11 +37,8 @@ export function transpile(context?: BuildContext) {
 
 
 export function transpileUpdate(event: string, filePath: string, context: BuildContext) {
-  if (!filePath.endsWith('.ts') && cachedTsFiles) {
-    // however this ran, the changed file wasn't a .ts file
-    // so if we already have tsFiles then make sure the context
-    // has them and carry on
-    context.fileCache = cachedTsFiles;
+  if (!filePath.endsWith('.ts') ) {
+    // however this ran, the changed file wasn't a .ts file so carry on
     return Promise.resolve();
   }
 
@@ -68,10 +66,6 @@ export function transpileUpdate(event: string, filePath: string, context: BuildC
  * The full TS build for all app files.
  */
 export function transpileWorker(context: BuildContext, workerConfig: TranspileWorkerConfig) {
-  // forget any tsFiles we've already cached
-  if (workerConfig.writeInMemory) {
-    context.fileCache = null;
-  }
 
   // let's do this
   return new Promise((resolve, reject) => {
@@ -99,13 +93,11 @@ export function transpileWorker(context: BuildContext, workerConfig: TranspileWo
     // let's start a new tsFiles object to cache all the transpiled files in
     const host = ts.createCompilerHost(tsConfig.options);
 
-    const cache = new Map<string, File>();
-
     const program = ts.createProgram(tsFileNames, tsConfig.options, host, cachedProgram);
     program.emit(undefined, (path: string, data: string, writeByteOrderMark: boolean, onError: Function, sourceFiles: ts.SourceFile[]) => {
       if (workerConfig.writeInMemory) {
-        writeSourceFiles(cache, sourceFiles);
-        writeTranspiledFilesCallback(cache, path, data, workerConfig.inlineTemplate);
+        writeSourceFiles(context.fileCache, sourceFiles);
+        writeTranspiledFilesCallback(context.fileCache, path, data, workerConfig.inlineTemplate);
       }
     });
 
@@ -117,7 +109,7 @@ export function transpileWorker(context: BuildContext, workerConfig: TranspileWo
 
     if (diagnostics.length) {
       // transpile failed :(
-      cachedProgram = cachedTsFiles = null;
+      cachedProgram = null;
 
       const buildError = new BuildError();
       buildError.updatedDiagnostics = true;
@@ -128,14 +120,6 @@ export function transpileWorker(context: BuildContext, workerConfig: TranspileWo
       // cache the typescript program for later use
       cachedProgram = program;
 
-      if (workerConfig.writeInMemory) {
-        context.fileCache = cache;
-      }
-
-      if (workerConfig.cache) {
-        cachedTsFiles = cache;
-      }
-
       resolve();
     }
   });
@@ -209,9 +193,9 @@ function transpileUpdateWorker(event: string, filePath: string, context: BuildCo
         const jsFile = { path: newPath, content: jsContent };
         const tsFile = { path: filePath, content: sourceText};
 
-        context.fileCache.set(sourceMapFile.path, sourceMapFile);
-        context.fileCache.set(jsFile.path, jsFile);
-        context.fileCache.set(tsFile.path, tsFile);
+        context.fileCache.put(sourceMapFile.path, sourceMapFile);
+        context.fileCache.put(jsFile.path, jsFile);
+        context.fileCache.put(tsFile.path, tsFile);
 
         // cool, the lil transpiling went through, but
         // let's still do the big transpiling (on another processor core)
@@ -251,13 +235,13 @@ function cleanFileNames(context: BuildContext, fileNames: string[]) {
   return fileNames.filter(f => (f.indexOf(removeFileName) === -1));
 }
 
-function writeSourceFiles(fileCache: Map<String, File>, sourceFiles: ts.SourceFile[]) {
+function writeSourceFiles(fileCache: FileCache, sourceFiles: ts.SourceFile[]) {
   for (const sourceFile of sourceFiles) {
-    fileCache.set(sourceFile.fileName, { path: sourceFile.fileName, content: sourceFile.text });
+    fileCache.put(sourceFile.fileName, { path: sourceFile.fileName, content: sourceFile.text });
   }
 }
 
-function writeTranspiledFilesCallback(fileCache: Map<String, File>, sourcePath: string, data: string, shouldInlineTemplate: boolean) {
+function writeTranspiledFilesCallback(fileCache: FileCache, sourcePath: string, data: string, shouldInlineTemplate: boolean) {
   sourcePath = normalize(sourcePath);
 
   if (endsWith(sourcePath, '.js')) {
@@ -274,7 +258,7 @@ function writeTranspiledFilesCallback(fileCache: Map<String, File>, sourcePath:
       file.content = data;
     }
 
-    fileCache.set(sourcePath, file);
+    fileCache.put(sourcePath, file);
 
   } else if (endsWith(sourcePath, '.js.map')) {
 
@@ -285,7 +269,7 @@ function writeTranspiledFilesCallback(fileCache: Map<String, File>, sourcePath:
     }
     file.content = data;
 
-    fileCache.set(sourcePath, file);
+    fileCache.put(sourcePath, file);
   }
 }
 
@@ -332,7 +316,6 @@ export function getTsConfig(context: BuildContext, tsConfigPath?: string): TsCon
 
 
 let cachedProgram: ts.Program = null;
-let cachedTsFiles: Map<string, File> = null;
 
 export function getTsConfigPath(context: BuildContext) {
   return join(context.rootDir, 'tsconfig.json');

src/util/config.ts

@@ -2,6 +2,7 @@ import { accessSync, readJSONSync, statSync } from 'fs-extra';
 import { BuildContext, TaskInfo } from './interfaces';
 import { join, resolve } from 'path';
 import { objectAssign } from './helpers';
+import { FileCache } from './file-cache';
 
 
 /**
@@ -21,6 +22,7 @@ import { objectAssign } from './helpers';
 export function generateContext(context?: BuildContext): BuildContext {
   if (!context) {
     context = {};
+    context.fileCache = new FileCache();
   }
 
   context.rootDir = resolve(context.rootDir || getConfigValue(context, '--rootDir', null, ENV_VAR_ROOT_DIR, ENV_VAR_ROOT_DIR.toLowerCase(), processCwd));

src/util/events.ts

@@ -26,5 +26,8 @@ export const EventType = {
   DirectoryAdd: 'DirectoryAdd',
   DirectoryDelete: 'DirectoryDelete',
   TaskEvent: 'TaskEvent',
-  UpdatedDiagnostics: 'UpdatedDiagnostics'
+  UpdatedDiagnostics: 'UpdatedDiagnostics',
+
+  WebpackFilesChanged: 'DanFileChanged',
+  DanFileDeleted: 'DanFileDeleted'
 };