feature(optimization): add pure annotation to transpiled classes for the sake of dead code removal

Author: danbucholtz

src/optimization.ts

@@ -9,7 +9,7 @@ import { BuildError } from './util/errors';
 import { getBooleanPropertyValue, getStringPropertyValue, webpackStatsToDependencyMap, printDependencyMap } from './util/helpers';
 import { BuildContext, TaskInfo } from './util/interfaces';
 import { runWebpackFullBuild, WebpackConfig } from './webpack';
-import { purgeStaticFieldDecorators, purgeTranspiledDecorators } from './optimization/decorators';
+import { addPureAnnotation, purgeStaticFieldDecorators, purgeTranspiledDecorators } from './optimization/decorators';
 import { getAppModuleNgFactoryPath, calculateUnusedComponents, purgeUnusedImportsAndExportsFromIndex, purgeComponentNgFactoryImportAndUsage, purgeProviderControllerImportAndUsage, purgeProviderClassNameFromIonicModuleForRoot } from './optimization/treeshake';
 
 export function optimization(context: BuildContext, configFile: string) {
@@ -84,6 +84,7 @@ function removeDecorators(context: BuildContext) {
     let magicString = new MagicString(jsFile.content);
     magicString = purgeStaticFieldDecorators(jsFile.path, jsFile.content, getStringPropertyValue(Constants.ENV_VAR_IONIC_ANGULAR_DIR), getStringPropertyValue(Constants.ENV_VAR_AT_ANGULAR_DIR), context.srcDir, magicString);
     magicString = purgeTranspiledDecorators(jsFile.path, jsFile.content, getStringPropertyValue(Constants.ENV_VAR_IONIC_ANGULAR_DIR), getStringPropertyValue(Constants.ENV_VAR_AT_ANGULAR_DIR), context.srcDir, magicString);
+    magicString = addPureAnnotation(jsFile.path, jsFile.content, getStringPropertyValue(Constants.ENV_VAR_IONIC_ANGULAR_DIR), getStringPropertyValue(Constants.ENV_VAR_AT_ANGULAR_DIR), context.srcDir, magicString);
     jsFile.content = magicString.toString();
     const sourceMap = magicString.generateMap({
       source: basename(jsFile.path),

src/optimization/decorators.spec.ts

@@ -1280,4 +1280,188 @@ var _a, _b;
       expect(result.indexOf(injectableDecorator)).toBeGreaterThan(1);
     });
   });
+
+  describe('addPureAnnotation', () => {
+    it('should add the pure annotation to a transpiled class', () => {
+        const knownContent = `
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { Component, ElementRef, EventEmitter, HostBinding, HostListener, Input, Output, ViewChild, ViewChildren } from '@angular/core';
+import { IonicPage, NavController, PopoverController } from 'ionic-angular';
+var AboutPage = (function () {
+    function AboutPage(navCtrl, popoverCtrl) {
+        this.navCtrl = navCtrl;
+        this.popoverCtrl = popoverCtrl;
+        this.conferenceDate = '2047-05-18';
+        this.someVariable = '';
+        this.emitter = new EventEmitter();
+    }
+    AboutPage.prototype.presentPopover = function (event) {
+        var popover = this.popoverCtrl.create('PopoverPage');
+        popover.present({ ev: event });
+    };
+    AboutPage.prototype.someFunction = function (event) {
+    };
+    return AboutPage;
+}());
+export { AboutPage };
+var _a, _b, _c;
+//# sourceMappingURL=about.js.map
+        `;
+
+      const expectedContent = `
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { Component, ElementRef, EventEmitter, HostBinding, HostListener, Input, Output, ViewChild, ViewChildren } from '@angular/core';
+import { IonicPage, NavController, PopoverController } from 'ionic-angular';
+var AboutPage = /*#__PURE__*/ (function () {
+    function AboutPage(navCtrl, popoverCtrl) {
+        this.navCtrl = navCtrl;
+        this.popoverCtrl = popoverCtrl;
+        this.conferenceDate = '2047-05-18';
+        this.someVariable = '';
+        this.emitter = new EventEmitter();
+    }
+    AboutPage.prototype.presentPopover = function (event) {
+        var popover = this.popoverCtrl.create('PopoverPage');
+        popover.present({ ev: event });
+    };
+    AboutPage.prototype.someFunction = function (event) {
+    };
+    return AboutPage;
+}());
+export { AboutPage };
+var _a, _b, _c;
+//# sourceMappingURL=about.js.map
+        `;
+
+      let magicString = new MagicString(knownContent);
+      const filePath = join(ionicAngular, 'components', 'action-sheet', 'action-sheet-component.js');
+      magicString = decorators.addPureAnnotation(filePath, knownContent, ionicAngular, angularDir, srcDir, magicString);
+      const result: string = magicString.toString();
+      expect(result).toEqual(expectedContent);
+    });
+
+    it('should work with a class that extends another class', () => {
+      const knownContent = `
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import { Directive, ElementRef, Renderer } from '@angular/core';
+import { Config } from '../../config/config';
+import { Ion } from '../ion';
+/**
+ * @hidden
+ */
+var CardContent = (function (_super) {
+    __extends(CardContent, _super);
+    /**
+     * @param {?} config
+     * @param {?} elementRef
+     * @param {?} renderer
+     */
+    function CardContent(config, elementRef, renderer) {
+        return _super.call(this, config, elementRef, renderer, 'card-content') || this;
+    }
+    return CardContent;
+}(Ion));
+export { CardContent };
+/**
+ * @nocollapse
+ */
+CardContent.ctorParameters = function () { return [
+    { type: Config, },
+    { type: ElementRef, },
+    { type: Renderer, },
+]; };
+function CardContent_tsickle_Closure_declarations() {
+    /** @type {?} */
+    CardContent.decorators;
+    /**
+     * @nocollapse
+     * @type {?}
+     */
+    CardContent.ctorParameters;
+}
+//# sourceMappingURL=card-content.js.map
+`;
+
+const expectedContent = `
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import { Directive, ElementRef, Renderer } from '@angular/core';
+import { Config } from '../../config/config';
+import { Ion } from '../ion';
+/**
+ * @hidden
+ */
+var CardContent = /*#__PURE__*/ (function (_super) {
+    __extends(CardContent, _super);
+    /**
+     * @param {?} config
+     * @param {?} elementRef
+     * @param {?} renderer
+     */
+    function CardContent(config, elementRef, renderer) {
+        return _super.call(this, config, elementRef, renderer, 'card-content') || this;
+    }
+    return CardContent;
+}(Ion));
+export { CardContent };
+/**
+ * @nocollapse
+ */
+CardContent.ctorParameters = function () { return [
+    { type: Config, },
+    { type: ElementRef, },
+    { type: Renderer, },
+]; };
+function CardContent_tsickle_Closure_declarations() {
+    /** @type {?} */
+    CardContent.decorators;
+    /**
+     * @nocollapse
+     * @type {?}
+     */
+    CardContent.ctorParameters;
+}
+//# sourceMappingURL=card-content.js.map
+`;
+
+      let magicString = new MagicString(knownContent);
+      const filePath = join(ionicAngular, 'components', 'action-sheet', 'action-sheet-component.js');
+      magicString = decorators.addPureAnnotation(filePath, knownContent, ionicAngular, angularDir, srcDir, magicString);
+      const result: string = magicString.toString();
+      expect(result).toEqual(expectedContent);
+    });
+  });
 });

src/optimization/decorators.ts

@@ -3,16 +3,49 @@ import {
   BinaryExpression,
   CallExpression,
   ExpressionStatement,
+  FunctionExpression,
   Identifier,
   ObjectLiteralExpression,
+  ParenthesizedExpression,
   PropertyAccessExpression,
   PropertyAssignment,
   SourceFile,
   SyntaxKind } from 'typescript';
 
 import { Logger } from '../logger/logger';
 import { MagicString } from '../util/interfaces';
-import { getNodeStringContent, findNodes, getTypescriptSourceFile } from '../util/typescript-utils';
+import { findNodes, getTypescriptSourceFile } from '../util/typescript-utils';
+
+export function addPureAnnotation(filePath: string, originalFileContent: string, ionicAngularDir: string, angularDir: string, srcDir: string, magicString: MagicString) {
+  Logger.debug(`[decorators] addPureAnnotation: processing ${filePath} ...`);
+  const typescriptFile = getTypescriptSourceFile(filePath, originalFileContent);
+  const parenthesizedExpressions = findNodes(typescriptFile, typescriptFile, SyntaxKind.ParenthesizedExpression, false) as ParenthesizedExpression[];
+  parenthesizedExpressions.forEach(parenthesizedExpression => {
+
+    if (parenthesizedExpression.expression && parenthesizedExpression.expression.kind === SyntaxKind.CallExpression
+        && (parenthesizedExpression.expression as CallExpression).expression
+        && (parenthesizedExpression.expression as CallExpression).expression.kind === SyntaxKind.FunctionExpression
+        && !((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).name
+        && ((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).parameters) {
+
+      // it's an iffe
+      if (((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).parameters.length === 0) {
+
+        magicString.prependLeft(parenthesizedExpression.pos, PURE_ANNOTATION);
+
+      } else if (((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).parameters[0]
+                && ((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).parameters[0].name
+                && (((parenthesizedExpression.expression as CallExpression).expression as FunctionExpression).parameters[0].name as Identifier).text === '_super') {
+
+
+        magicString.prependLeft(parenthesizedExpression.pos, PURE_ANNOTATION);
+
+      }
+
+    }
+  });
+  return magicString;
+}
 
 export function purgeTranspiledDecorators(filePath: string, originalFileContent: string, ionicAngularDir: string, angularDir: string, srcDir: string, magicString: MagicString) {
   if (filePath.indexOf(angularDir) >= 0 || filePath.indexOf(ionicAngularDir) >= 0 || filePath.indexOf(srcDir) >= 0) {
@@ -177,3 +210,5 @@ export const OUTPUT_DECORATOR = 'Output';
 export const PIPE_DECORATOR = 'Pipe';
 export const VIEW_CHILD_DECORATOR = 'ViewChild';
 export const VIEW_CHILDREN_DECORATOR = 'ViewChildren';
+
+export const PURE_ANNOTATION = ' /*#__PURE__*/';

src/util/interfaces.ts

@@ -205,4 +205,5 @@ export interface WebpackDependency {
 export interface MagicString {
   overwrite(startIndex: number, endIndex: number, newContent: string): void;
   toString(): string;
+  prependLeft(index: number, contentToPrepend: string): string;
 }