From 7c5cc9bc41a530d0d9fac1924e012ddf16760c07 Mon Sep 17 00:00:00 2001 From: Tobias Bosch Date: Wed, 2 Nov 2016 08:11:10 -0700 Subject: [PATCH] refactor(compiler): initialize `RenderComponentType` eagerly This moves the usage of `APP_ID` into the `DomRenderer`. --- modules/@angular/compiler/src/identifiers.ts | 5 ++ .../@angular/compiler/src/offline_compiler.ts | 3 +- .../@angular/compiler/src/runtime_compiler.ts | 7 +-- .../src/view_compiler/view_builder.ts | 62 +++++++------------ .../@angular/core/src/linker/view_utils.ts | 27 +++----- .../platform-browser/src/dom/dom_renderer.ts | 22 ++++--- .../src/tree/ng2_ftl/app.ngfactory.ts | 5 +- .../src/tree/ng2_ftl/tree_host.ngfactory.ts | 2 +- .../src/tree/ng2_static_ftl/app.ngfactory.ts | 5 +- .../ng2_static_ftl/tree_root.ngfactory.ts | 4 +- 10 files changed, 63 insertions(+), 79 deletions(-) diff --git a/modules/@angular/compiler/src/identifiers.ts b/modules/@angular/compiler/src/identifiers.ts index 3246840570..8254caea99 100644 --- a/modules/@angular/compiler/src/identifiers.ts +++ b/modules/@angular/compiler/src/identifiers.ts @@ -323,6 +323,11 @@ export class Identifiers { moduleUrl: VIEW_UTILS_MODULE_URL, runtime: view_utils.subscribeToRenderElement }; + static createRenderComponentType: IdentifierSpec = { + name: 'createRenderComponentType', + moduleUrl: VIEW_UTILS_MODULE_URL, + runtime: view_utils.createRenderComponentType + }; static noop: IdentifierSpec = {name: 'noop', moduleUrl: VIEW_UTILS_MODULE_URL, runtime: view_utils.noop}; } diff --git a/modules/@angular/compiler/src/offline_compiler.ts b/modules/@angular/compiler/src/offline_compiler.ts index 1dec0f2a7f..0f9461326b 100644 --- a/modules/@angular/compiler/src/offline_compiler.ts +++ b/modules/@angular/compiler/src/offline_compiler.ts @@ -276,8 +276,7 @@ export class OfflineCompiler { if (componentStyles) { targetStatements.push(..._resolveStyleStatements(componentStyles, fileSuffix)); } - compiledAnimations.forEach( - entry => { entry.statements.forEach(statement => { targetStatements.push(statement); }); }); + compiledAnimations.forEach(entry => targetStatements.push(...entry.statements)); targetStatements.push(..._resolveViewStatements(viewResult)); return viewResult.viewFactoryVar; } diff --git a/modules/@angular/compiler/src/runtime_compiler.ts b/modules/@angular/compiler/src/runtime_compiler.ts index 388bc1725a..25013afa4d 100644 --- a/modules/@angular/compiler/src/runtime_compiler.ts +++ b/modules/@angular/compiler/src/runtime_compiler.ts @@ -320,10 +320,9 @@ export class RuntimeCompiler implements Compiler { dwd.placeholder.reference = this._assertDirectiveWrapper(dwd.dir.reference); } }); - const statements = - stylesCompileResult.componentStylesheet.statements.concat(compileResult.statements); - compiledAnimations.forEach( - entry => { entry.statements.forEach(statement => { statements.push(statement); }); }); + const statements = stylesCompileResult.componentStylesheet.statements + .concat(...compiledAnimations.map(ca => ca.statements)) + .concat(compileResult.statements); let factory: any; if (!this._compilerConfig.useJit) { factory = interpretStatements(statements, compileResult.viewFactoryVar); diff --git a/modules/@angular/compiler/src/view_compiler/view_builder.ts b/modules/@angular/compiler/src/view_compiler/view_builder.ts index 772d0dce7d..532af2b985 100644 --- a/modules/@angular/compiler/src/view_compiler/view_builder.ts +++ b/modules/@angular/compiler/src/view_compiler/view_builder.ts @@ -394,14 +394,29 @@ function createViewTopLevelStmts(view: CompileView, targetStatements: o.Statemen var renderCompTypeVar: o.ReadVarExpr = o.variable(`renderType_${view.component.type.name}`); // fix highlighting: ` if (view.viewIndex === 0) { + let templateUrlInfo: string; + if (view.component.template.templateUrl == view.component.type.moduleUrl) { + templateUrlInfo = + `${view.component.type.moduleUrl} class ${view.component.type.name} - inline template`; + } else { + templateUrlInfo = view.component.template.templateUrl; + } targetStatements.push( - renderCompTypeVar.set(o.NULL_EXPR) + renderCompTypeVar + .set(o.importExpr(resolveIdentifier(Identifiers.createRenderComponentType)).callFn([ + view.genConfig.genDebugInfo ? o.literal(templateUrlInfo) : o.literal(''), + o.literal(view.component.template.ngContentSelectors.length), + ViewEncapsulationEnum.fromValue(view.component.template.encapsulation), + view.styles, + o.literalMap(view.animations.map( + (entry): [string, o.Expression] => [entry.name, entry.fnExp])), + ])) .toDeclStmt(o.importType(resolveIdentifier(Identifiers.RenderComponentType)))); } var viewClass = createViewClass(view, renderCompTypeVar, nodeDebugInfosVar); targetStatements.push(viewClass); - targetStatements.push(createViewFactory(view, viewClass, renderCompTypeVar)); + targetStatements.push(createViewFactory(view, viewClass)); } function createStaticNodeDebugInfo(node: CompileNode): o.Expression { @@ -499,8 +514,7 @@ function generateDestroyMethod(view: CompileView): o.Statement[] { return stmts; } -function createViewFactory( - view: CompileView, viewClass: o.ClassStmt, renderCompTypeVar: o.ReadVarExpr): o.Statement { +function createViewFactory(view: CompileView, viewClass: o.ClassStmt): o.Statement { var viewFactoryArgs = [ new o.FnParam( ViewConstructorVars.viewUtils.name, o.importType(resolveIdentifier(Identifiers.ViewUtils))), @@ -510,41 +524,13 @@ function createViewFactory( new o.FnParam(ViewConstructorVars.parentIndex.name, o.NUMBER_TYPE), new o.FnParam(ViewConstructorVars.parentElement.name, o.DYNAMIC_TYPE) ]; - var initRenderCompTypeStmts: any[] = []; - var templateUrlInfo: string; - if (view.component.template.templateUrl == view.component.type.moduleUrl) { - templateUrlInfo = - `${view.component.type.moduleUrl} class ${view.component.type.name} - inline template`; - } else { - templateUrlInfo = view.component.template.templateUrl; - } - if (view.viewIndex === 0) { - var animationsExpr = o.literalMap( - view.animations.map((entry): [string, o.Expression] => [entry.name, entry.fnExp])); - initRenderCompTypeStmts = [ - new o.IfStmt( - renderCompTypeVar.identical(o.NULL_EXPR), - [ - renderCompTypeVar - .set(ViewConstructorVars.viewUtils.callMethod( - 'createRenderComponentType', - [ - view.genConfig.genDebugInfo ? o.literal(templateUrlInfo) : o.literal(''), - o.literal(view.component.template.ngContentSelectors.length), - ViewEncapsulationEnum.fromValue(view.component.template.encapsulation), - view.styles, - animationsExpr, - ])) - .toStmt(), - ]), - ]; - } return o - .fn(viewFactoryArgs, initRenderCompTypeStmts.concat([ - new o.ReturnStatement(o.variable(viewClass.name) - .instantiate(viewClass.constructorMethod.params.map( - (param) => o.variable(param.name)))), - ]), + .fn(viewFactoryArgs, + [ + new o.ReturnStatement(o.variable(viewClass.name) + .instantiate(viewClass.constructorMethod.params.map( + (param) => o.variable(param.name)))), + ], o.importType(resolveIdentifier(Identifiers.AppView), [getContextType(view)])) .toDeclStmt(view.viewFactory.name, [o.StmtModifier.Final]); } diff --git a/modules/@angular/core/src/linker/view_utils.ts b/modules/@angular/core/src/linker/view_utils.ts index 81086e0117..1782916386 100644 --- a/modules/@angular/core/src/linker/view_utils.ts +++ b/modules/@angular/core/src/linker/view_utils.ts @@ -24,23 +24,7 @@ export class ViewUtils { sanitizer: Sanitizer; private _nextCompTypeId: number = 0; - constructor( - private _renderer: RootRenderer, @Inject(APP_ID) private _appId: string, - sanitizer: Sanitizer) { - this.sanitizer = sanitizer; - } - - /** - * Used by the generated code - */ - // TODO (matsko): add typing for the animation function - createRenderComponentType( - templateUrl: string, slotCount: number, encapsulation: ViewEncapsulation, - styles: Array, animations: {[key: string]: Function}): RenderComponentType { - return new RenderComponentType( - `${this._appId}-${this._nextCompTypeId++}`, templateUrl, slotCount, encapsulation, styles, - animations); - } + constructor(private _renderer: RootRenderer, sanitizer: Sanitizer) { this.sanitizer = sanitizer; } /** @internal */ renderComponent(renderComponentType: RenderComponentType): Renderer { @@ -48,6 +32,15 @@ export class ViewUtils { } } +let nextRenderComponentTypeId = 0; + +export function createRenderComponentType( + templateUrl: string, slotCount: number, encapsulation: ViewEncapsulation, + styles: Array, animations: {[key: string]: Function}): RenderComponentType { + return new RenderComponentType( + `${nextRenderComponentTypeId++}`, templateUrl, slotCount, encapsulation, styles, animations); +} + export function addToArray(e: any, array: any[]) { array.push(e); } diff --git a/modules/@angular/platform-browser/src/dom/dom_renderer.ts b/modules/@angular/platform-browser/src/dom/dom_renderer.ts index 06596d2217..7397be4f2f 100644 --- a/modules/@angular/platform-browser/src/dom/dom_renderer.ts +++ b/modules/@angular/platform-browser/src/dom/dom_renderer.ts @@ -6,7 +6,8 @@ * found in the LICENSE file at https://angular.io/license */ -import {Inject, Injectable, RenderComponentType, Renderer, RootRenderer, ViewEncapsulation} from '@angular/core'; +import {APP_ID, Inject, Injectable, RenderComponentType, Renderer, RootRenderer, ViewEncapsulation} from '@angular/core'; + import {isBlank, isPresent, stringify} from '../facade/lang'; import {AnimationKeyframe, AnimationPlayer, AnimationStyles, RenderDebugInfo} from '../private_import_core'; @@ -30,12 +31,14 @@ export abstract class DomRootRenderer implements RootRenderer { constructor( public document: any, public eventManager: EventManager, - public sharedStylesHost: DomSharedStylesHost, public animationDriver: AnimationDriver) {} + public sharedStylesHost: DomSharedStylesHost, public animationDriver: AnimationDriver, + public appId: string) {} renderComponent(componentProto: RenderComponentType): Renderer { var renderer = this.registeredComponents.get(componentProto.id); if (!renderer) { - renderer = new DomRenderer(this, componentProto, this.animationDriver); + renderer = new DomRenderer( + this, componentProto, this.animationDriver, `${this.appId}-${componentProto.id}`); this.registeredComponents.set(componentProto.id, renderer); } return renderer; @@ -46,8 +49,9 @@ export abstract class DomRootRenderer implements RootRenderer { export class DomRootRenderer_ extends DomRootRenderer { constructor( @Inject(DOCUMENT) _document: any, _eventManager: EventManager, - sharedStylesHost: DomSharedStylesHost, animationDriver: AnimationDriver) { - super(_document, _eventManager, sharedStylesHost, animationDriver); + sharedStylesHost: DomSharedStylesHost, animationDriver: AnimationDriver, + @Inject(APP_ID) appId: string) { + super(_document, _eventManager, sharedStylesHost, animationDriver, appId); } } @@ -58,14 +62,14 @@ export class DomRenderer implements Renderer { constructor( private _rootRenderer: DomRootRenderer, private componentProto: RenderComponentType, - private _animationDriver: AnimationDriver) { - this._styles = _flattenStyles(componentProto.id, componentProto.styles, []); + private _animationDriver: AnimationDriver, styleShimId: string) { + this._styles = _flattenStyles(styleShimId, componentProto.styles, []); if (componentProto.encapsulation !== ViewEncapsulation.Native) { this._rootRenderer.sharedStylesHost.addStyles(this._styles); } if (this.componentProto.encapsulation === ViewEncapsulation.Emulated) { - this._contentAttr = _shimContentAttribute(componentProto.id); - this._hostAttr = _shimHostAttribute(componentProto.id); + this._contentAttr = _shimContentAttribute(styleShimId); + this._hostAttr = _shimHostAttribute(styleShimId); } else { this._contentAttr = null; this._hostAttr = null; diff --git a/modules/benchmarks/src/tree/ng2_ftl/app.ngfactory.ts b/modules/benchmarks/src/tree/ng2_ftl/app.ngfactory.ts index 3e6af90477..7c21df80cd 100644 --- a/modules/benchmarks/src/tree/ng2_ftl/app.ngfactory.ts +++ b/modules/benchmarks/src/tree/ng2_ftl/app.ngfactory.ts @@ -147,7 +147,7 @@ class AppModuleInjector extends import0.NgModuleInjector { if ((this.__DomRootRenderer_19 == (null as any))) { (this.__DomRootRenderer_19 = new import13.DomRootRenderer_( this._DOCUMENT_13, this._EventManager_16, this._DomSharedStylesHost_17, - this._AnimationDriver_18)); + this._AnimationDriver_18, this._APP_ID_12)); } return this.__DomRootRenderer_19; } @@ -172,8 +172,7 @@ class AppModuleInjector extends import0.NgModuleInjector { } get _ViewUtils_23(): import15.ViewUtils { if ((this.__ViewUtils_23 == (null as any))) { - (this.__ViewUtils_23 = - new import15.ViewUtils(this._RootRenderer_20, this._APP_ID_12, this._Sanitizer_22)); + (this.__ViewUtils_23 = new import15.ViewUtils(this._RootRenderer_20, this._Sanitizer_22)); } return this.__ViewUtils_23; } diff --git a/modules/benchmarks/src/tree/ng2_ftl/tree_host.ngfactory.ts b/modules/benchmarks/src/tree/ng2_ftl/tree_host.ngfactory.ts index bce4e1cecb..f0c710f9f3 100644 --- a/modules/benchmarks/src/tree/ng2_ftl/tree_host.ngfactory.ts +++ b/modules/benchmarks/src/tree/ng2_ftl/tree_host.ngfactory.ts @@ -56,7 +56,7 @@ function viewFactory_TreeComponent_Host0( parentElement: any): import1.AppView { if ((renderType_TreeComponent_Host === (null as any))) { (renderType_TreeComponent_Host = - viewUtils.createRenderComponentType('', 0, import8.ViewEncapsulation.None, [], {})); + import4.createRenderComponentType('', 0, import8.ViewEncapsulation.None, [], {})); } return new _View_TreeComponent_Host0(viewUtils, parentView, parentIndex, parentElement); } diff --git a/modules/benchmarks/src/tree/ng2_static_ftl/app.ngfactory.ts b/modules/benchmarks/src/tree/ng2_static_ftl/app.ngfactory.ts index c4214df11c..a1ce0e2e12 100644 --- a/modules/benchmarks/src/tree/ng2_static_ftl/app.ngfactory.ts +++ b/modules/benchmarks/src/tree/ng2_static_ftl/app.ngfactory.ts @@ -147,7 +147,7 @@ class AppModuleInjector extends import0.NgModuleInjector { if ((this.__DomRootRenderer_19 == (null as any))) { (this.__DomRootRenderer_19 = new import13.DomRootRenderer_( this._DOCUMENT_13, this._EventManager_16, this._DomSharedStylesHost_17, - this._AnimationDriver_18)); + this._AnimationDriver_18, this._APP_ID_12)); } return this.__DomRootRenderer_19; } @@ -172,8 +172,7 @@ class AppModuleInjector extends import0.NgModuleInjector { } get _ViewUtils_23(): import15.ViewUtils { if ((this.__ViewUtils_23 == (null as any))) { - (this.__ViewUtils_23 = - new import15.ViewUtils(this._RootRenderer_20, this._APP_ID_12, this._Sanitizer_22)); + (this.__ViewUtils_23 = new import15.ViewUtils(this._RootRenderer_20, this._Sanitizer_22)); } return this.__ViewUtils_23; } diff --git a/modules/benchmarks/src/tree/ng2_static_ftl/tree_root.ngfactory.ts b/modules/benchmarks/src/tree/ng2_static_ftl/tree_root.ngfactory.ts index ea2009206a..a0f7acd1ed 100644 --- a/modules/benchmarks/src/tree/ng2_static_ftl/tree_root.ngfactory.ts +++ b/modules/benchmarks/src/tree/ng2_static_ftl/tree_root.ngfactory.ts @@ -63,7 +63,7 @@ function viewFactory_TreeRootComponent_Host0( parentElement: any): import1.AppView { if ((renderType_TreeRootComponent_Host === (null as any))) { (renderType_TreeRootComponent_Host = - viewUtils.createRenderComponentType('', 0, import8.ViewEncapsulation.None, [], {})); + import4.createRenderComponentType('', 0, import8.ViewEncapsulation.None, [], {})); } return new _View_TreeRootComponent_Host0(viewUtils, parentView, parentIndex, parentElement); } @@ -125,7 +125,7 @@ export function viewFactory_TreeRootComponent0( viewUtils: import4.ViewUtils, parentView: import1.AppView, parentIndex: number, parentElement: any): import1.AppView { if ((renderType_TreeRootComponent === (null as any))) { - (renderType_TreeRootComponent = viewUtils.createRenderComponentType( + (renderType_TreeRootComponent = import4.createRenderComponentType( '/Users/tbosch/projects/conf-demos/ngc-demo/src/ng2_static/root_tree.ts class TreeRootComponent - inline template', 0, import8.ViewEncapsulation.None, styles_TreeRootComponent, {})); }