Skip to content
Permalink
Browse files

perf(ivy): fix creation time micro-benchmarks (#34031)

Micro-benchmarks were broken after we've introduced concept of
DECLARATION_COMPONENT_VIEW on LView (after this change embedded
views must have a pointer to a parent LView).

PR Close #34031
  • Loading branch information
pkozlowski-opensource authored and matsko committed Nov 25, 2019
1 parent 688b188 commit 457ac3ac46cfb7309bcbe98ebd3b8103da58e265
@@ -5,9 +5,10 @@
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {TViewType} from '@angular/core/src/render3/interfaces/view';
import {LViewFlags, TViewType} from '@angular/core/src/render3/interfaces/view';

import {ɵɵdefineDirective, ɵɵelementEnd, ɵɵelementStart, ɵɵtext} from '../../../../src/render3/index';
import {createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {createLView, createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {RenderFlags} from '../../../../src/render3/interfaces/definition';
import {TNodeType, TViewNode} from '../../../../src/render3/interfaces/node';
import {createBenchmark} from '../micro_bench';
@@ -73,21 +74,25 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
}

const rootLView = createLView(
null, createTView(TViewType.Root, -1, null, 0, 0, null, null, null, null, null), {},
LViewFlags.IsRoot, null, null);

const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(
TViewType.Embedded, -1, testTemplate, 21, 10, [Tooltipdir], null, null, null,
[['position', 'top', 3, 'tooltip']]);

// create view once so we don't profile first template pass
createAndRenderLView(null, embeddedTView, viewTNode);
// create view once so we don't profile the first create pass
createAndRenderLView(rootLView, embeddedTView, viewTNode);

// scenario to benchmark
const directiveInstantiate = createBenchmark('directive instantiate');
const createTime = directiveInstantiate('create');

console.profile('directive_instantiate');
while (createTime()) {
createAndRenderLView(null, embeddedTView, viewTNode);
createAndRenderLView(rootLView, embeddedTView, viewTNode);
}
console.profileEnd();

@@ -5,28 +5,27 @@
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {TViewType} from '@angular/core/src/render3/interfaces/view';
import {ɵɵelementEnd, ɵɵelementStart} from '../../../../src/render3/instructions/element';
import {createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {createLView, createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {ɵɵtext} from '../../../../src/render3/instructions/text';
import {RenderFlags} from '../../../../src/render3/interfaces/definition';
import {TNodeType, TViewNode} from '../../../../src/render3/interfaces/node';
import {LViewFlags, TViewType} from '../../../../src/render3/interfaces/view';
import {createBenchmark} from '../micro_bench';
import {createAndRenderLView} from '../setup';

`<div>
<button>0</button>
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
<button>6</button>
<button>7</button>
<button>8</button>
<button>9</button>
</div>
</ng-template>`;
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5">0</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>1</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>2</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>3</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>4</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>5</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>6</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>7</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>8</button>
<button name1="value1" name2="value2" name3="value3" name4="value4" name5="value5>9</button>
</div>`;
function testTemplate(rf: RenderFlags, ctx: any) {
if (rf & 1) {
ɵɵelementStart(0, 'div');
@@ -64,22 +63,26 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
}

const rootLView = createLView(
null, createTView(TViewType.Root, -1, null, 0, 0, null, null, null, null, null), {},
LViewFlags.IsRoot, null, null);

const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(
TViewType.Embedded, -1, testTemplate, 21, 0, null, null, null, null, [[
'name1', 'value1', 'name2', 'value2', 'name3', 'value3', 'name4', 'value4', 'name5', 'value5'
]]);

// create view once so we don't profile first template pass
createAndRenderLView(null, embeddedTView, viewTNode);
// create view once so we don't profile the first create pass
createAndRenderLView(rootLView, embeddedTView, viewTNode);

// scenario to benchmark
const elementTextCreate = createBenchmark('element and text create');
const createTime = elementTextCreate('create');

console.profile('element_text_create');
while (createTime()) {
createAndRenderLView(null, embeddedTView, viewTNode);
createAndRenderLView(rootLView, embeddedTView, viewTNode);
}
console.profileEnd();

@@ -5,12 +5,12 @@
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {TViewType} from '@angular/core/src/render3/interfaces/view';
import {ɵɵelementEnd, ɵɵelementStart} from '../../../../src/render3/instructions/element';
import {ɵɵlistener} from '../../../../src/render3/instructions/listener';
import {createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {createLView, createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {RenderFlags} from '../../../../src/render3/interfaces/definition';
import {TNodeType, TViewNode} from '../../../../src/render3/interfaces/node';
import {LViewFlags, TViewType} from '../../../../src/render3/interfaces/view';
import {createBenchmark} from '../micro_bench';
import {createAndRenderLView} from '../setup';

@@ -75,20 +75,24 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
}

const rootLView = createLView(
null, createTView(TViewType.Root, -1, null, 0, 0, null, null, null, null, null), {},
LViewFlags.IsRoot, null, null);

const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(
TViewType.Embedded, -1, testTemplate, 11, 0, null, null, null, null, [[3, 'click', 'input']]);

// create view once so we don't profile first template pass
createAndRenderLView(null, embeddedTView, viewTNode);
// create view once so we don't profile the first create pass
createAndRenderLView(rootLView, embeddedTView, viewTNode);

const listenersCreate = createBenchmark('listeners create');
const createTime = listenersCreate('create');

// profile create views (run templates in creation mode)
console.profile('create listeners');
while (createTime()) {
createAndRenderLView(null, embeddedTView, viewTNode);
createAndRenderLView(rootLView, embeddedTView, viewTNode);
}
console.profileEnd();

@@ -5,12 +5,12 @@
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {TViewType} from '@angular/core/src/render3/interfaces/view';
import {ElementRef, TemplateRef, ViewContainerRef} from '../../../../src/linker';
import {ɵɵdefineDirective, ɵɵdirectiveInject, ɵɵtemplate} from '../../../../src/render3/index';
import {createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {createLView, createTNode, createTView} from '../../../../src/render3/instructions/shared';
import {RenderFlags} from '../../../../src/render3/interfaces/definition';
import {TNodeType, TViewNode} from '../../../../src/render3/interfaces/node';
import {LViewFlags, TViewType} from '../../../../src/render3/interfaces/view';
import {injectTemplateRef, injectViewContainerRef} from '../../../../src/render3/view_engine_compatibility';
import {createBenchmark} from '../micro_bench';
import {createAndRenderLView} from '../setup';
@@ -58,21 +58,25 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
}

const rootLView = createLView(
null, createTView(TViewType.Root, -1, null, 0, 0, null, null, null, null, null), {},
LViewFlags.IsRoot, null, null);

const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(
TViewType.Root, -1, testTemplate, 2, 0, [NgIfLikedir], null, null, null,
[['viewManipulation', '']]);

// create view once so we don't profile first template pass
createAndRenderLView(null, embeddedTView, viewTNode);
createAndRenderLView(rootLView, embeddedTView, viewTNode);

// scenario to benchmark
const elementTextCreate = createBenchmark('ng_template');
const createTime = elementTextCreate('create');

console.profile('ng_template_create');
while (createTime()) {
createAndRenderLView(null, embeddedTView, viewTNode);
createAndRenderLView(rootLView, embeddedTView, viewTNode);
}
console.profileEnd();

@@ -19,8 +19,7 @@ const rendererFactory: RendererFactory3 =
isBrowser ? domRendererFactory3 : new MicroBenchmarkRendererFactory;
const renderer = rendererFactory.createRenderer(null, null);

export function createAndRenderLView(
parentLView: LView | null, tView: TView, hostTNode: TViewNode) {
export function createAndRenderLView(parentLView: LView, tView: TView, hostTNode: TViewNode) {
const embeddedLView = createLView(
parentLView, tView, {}, LViewFlags.CheckAlways, null, hostTNode, rendererFactory, renderer);
renderView(embeddedLView, tView, null);

0 comments on commit 457ac3a

Please sign in to comment.
You can’t perform that action at this time.