skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf(core): chain template instructions (#51546)

Browse Source 
With the new control flow and defer blocks it'll be common for several template instructions to be declare one after another. These changes add support for chaining to the `template` instruction which will allow us to save some bytes.

PR Close #51546
This commit is contained in:
Kristiyan Kostadinov
2023-08-29 09:31:29 +02:00
committed by Jessica Janiuk
parent 4dabcad557
commit 685d01e106
26 changed files with 34 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/components_and_directives/content_projection/nested_template.js
+1 -3
View File
@@ -22,9 +22,7 @@ consts: [["id", "second", __AttributeMarker.Template__, "ngIf"], ["id", "third",
template: function Cmp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵprojectionDef($_c4$);
$r3$.ɵɵtemplate(0, Cmp_div_0_Template, 2, 0, "div", 0);
$r3$.ɵɵtemplate(1, Cmp_div_1_Template, 2, 0, "div", 1);
$r3$.ɵɵtemplate(2, Cmp_ng_template_2_Template, 2, 0, "ng-template");
$r3$.ɵɵtemplate(0, Cmp_div_0_Template, 2, 0, "div", 0)(1, Cmp_div_1_Template, 2, 0, "div", 1)(2, Cmp_ng_template_2_Template, 2, 0, "ng-template");
}
if (rf & 2) {
$r3$.ɵɵproperty("ngIf", ctx.visible);
packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/components_and_directives/content_projection/root_and_nested.js
+1 -2
View File
@@ -22,8 +22,7 @@ template: function Cmp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵprojectionDef($_c0$);
$r3$.ɵɵprojection(0);
$r3$.ɵɵtemplate(1, Cmp_ng_template_1_Template, 2, 0, "ng-template");
$r3$.ɵɵtemplate(2, Cmp_ng_template_2_Template, 2, 0, "ng-template");
$r3$.ɵɵtemplate(1, Cmp_ng_template_1_Template, 2, 0, "ng-template")(2, Cmp_ng_template_2_Template, 2, 0, "ng-template");
$r3$.ɵɵprojection(3, 1);
}
}
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/basic_if_else_if_template.js
+1 -4
View File
@@ -26,10 +26,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Conditional_3_Template, 1, 0);
$r3$.ɵɵtemplate(4, MyApp_Conditional_4_Template, 1, 0);
$r3$.ɵɵtemplate(5, MyApp_Conditional_5_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0)(3, MyApp_Conditional_3_Template, 1, 0)(4, MyApp_Conditional_4_Template, 1, 0)(5, MyApp_Conditional_5_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/basic_if_else_template.js
+1 -2
View File
@@ -14,8 +14,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Conditional_3_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0)(3, MyApp_Conditional_3_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/basic_switch_template.js
+1 -4
View File
@@ -26,10 +26,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Case_3_Template, 1, 0);
$r3$.ɵɵtemplate(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵtemplate(5, MyApp_Case_5_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0)(3, MyApp_Case_3_Template, 1, 0)(4, MyApp_Case_4_Template, 1, 0)(5, MyApp_Case_5_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/if_with_pipe_template.js
+1 -2
View File
@@ -23,8 +23,7 @@ function MyApp_Template(rf, ctx) {
$r3$.ɵɵpipe(2, "test");
$r3$.ɵɵtemplate(3, MyApp_Conditional_3_Template, 1, 0);
$r3$.ɵɵpipe(4, "test");
$r3$.ɵɵtemplate(5, MyApp_Conditional_5_Template, 1, 0);
$r3$.ɵɵtemplate(6, MyApp_Conditional_6_Template, 1, 0);
$r3$.ɵɵtemplate(5, MyApp_Conditional_5_Template, 1, 0)(6, MyApp_Conditional_6_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/nested_if_template.js
+2 -8
View File
@@ -36,10 +36,7 @@ function MyApp_Conditional_4_Conditional_3_Template(rf, ctx) {
function MyApp_Conditional_4_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyApp_Conditional_4_Conditional_0_Template, 1, 0);
$r3$.ɵɵtemplate(1, MyApp_Conditional_4_Conditional_1_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Conditional_4_Conditional_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Conditional_4_Conditional_3_Template, 1, 0);
$r3$.ɵɵtemplate(0, MyApp_Conditional_4_Conditional_0_Template, 1, 0)(1, MyApp_Conditional_4_Conditional_1_Template, 1, 0)(2, MyApp_Conditional_4_Conditional_2_Template, 1, 0)(3, MyApp_Conditional_4_Conditional_3_Template, 1, 0);
}
if (rf & 2) {
const ctx_r2 = $r3$.ɵɵnextContext();
@@ -57,10 +54,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Conditional_3_Template, 1, 0);
$r3$.ɵɵtemplate(4, MyApp_Conditional_4_Template, 4, 3);
$r3$.ɵɵtemplate(5, MyApp_Conditional_5_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Conditional_2_Template, 1, 0)(3, MyApp_Conditional_3_Template, 1, 0)(4, MyApp_Conditional_4_Template, 4, 3)(5, MyApp_Conditional_5_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/nested_switch_template.js
+2 -6
View File
@@ -24,9 +24,7 @@ function MyApp_Case_3_Case_2_Template(rf, ctx) {
function MyApp_Case_3_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyApp_Case_3_Case_0_Template, 1, 0);
$r3$.ɵɵtemplate(1, MyApp_Case_3_Case_1_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Case_3_Case_2_Template, 1, 0);
$r3$.ɵɵtemplate(0, MyApp_Case_3_Case_0_Template, 1, 0)(1, MyApp_Case_3_Case_1_Template, 1, 0)(2, MyApp_Case_3_Case_2_Template, 1, 0);
}
if (rf & 2) {
const ctx_r1 = $r3$.ɵɵnextContext();
@@ -45,9 +43,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Case_3_Template, 3, 4);
$r3$.ɵɵtemplate(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0)(3, MyApp_Case_3_Template, 3, 4)(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/switch_with_pipe_template.js
+1 -3
View File
@@ -3,9 +3,7 @@ function MyApp_Template(rf, ctx) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵpipe(2, "test");
$r3$.ɵɵtemplate(3, MyApp_Case_3_Template, 1, 0);
$r3$.ɵɵtemplate(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵtemplate(5, MyApp_Case_5_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Case_3_Template, 1, 0)(4, MyApp_Case_4_Template, 1, 0)(5, MyApp_Case_5_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_control_flow/switch_without_default_template.js
+1 -3
View File
@@ -20,9 +20,7 @@ function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_Case_3_Template, 1, 0);
$r3$.ɵɵtemplate(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Case_2_Template, 1, 0)(3, MyApp_Case_3_Template, 1, 0)(4, MyApp_Case_4_Template, 1, 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_secondary_blocks_template.js
+1 -4
View File
@@ -38,10 +38,7 @@ MyApp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_DeferLoading_3_Template, 1, 1);
$r3$.ɵɵtemplate(4, MyApp_DeferPlaceholder_4_Template, 1, 0);
$r3$.ɵɵtemplate(5, MyApp_DeferError_5_Template, 3, 0);
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0)(3, MyApp_DeferLoading_3_Template, 1, 1)(4, MyApp_DeferPlaceholder_4_Template, 1, 0)(5, MyApp_DeferError_5_Template, 3, 0);
$r3$.ɵɵdefer(6, 2, null, 3, 4, 5);
$r3$.ɵɵdeferOnIdle();
$r3$.ɵɵelementEnd();
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_external_deps_template.js
+1 -2
View File
@@ -26,8 +26,7 @@ MyApp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵelement(1, "eager-dep");
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_DeferLoading_3_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0)(3, MyApp_DeferLoading_3_Template, 1, 0);
$r3$.ɵɵdefer(4, 2, MyApp_Defer_4_DepsFn, 3);
$r3$.ɵɵdeferOnIdle();
$r3$.ɵɵelementEnd();
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_loading_params_template.js
+1 -2
View File
@@ -15,8 +15,7 @@ MyApp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({
consts: [[2000, 500], ["src", "loading.gif"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyApp_Defer_0_Template, 1, 0);
$r3$.ɵɵtemplate(1, MyApp_DeferLoading_1_Template, 1, 0);
$r3$.ɵɵtemplate(0, MyApp_Defer_0_Template, 1, 0)(1, MyApp_DeferLoading_1_Template, 1, 0);
$r3$.ɵɵdefer(2, 0, null, 1, null, null, 0);
$r3$.ɵɵdeferOnIdle();
}
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_local_deps_template.js
+1 -2
View File
@@ -8,8 +8,7 @@ MyApp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵelement(1, "eager-dep");
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0);
$r3$.ɵɵtemplate(3, MyApp_DeferLoading_3_Template, 1, 0);
$r3$.ɵɵtemplate(2, MyApp_Defer_2_Template, 1, 0)(3, MyApp_DeferLoading_3_Template, 1, 0);
$r3$.ɵɵdefer(4, 2, MyApp_Defer_4_DepsFn, 3);
$r3$.ɵɵdeferOnIdle();
$r3$.ɵɵelementEnd();
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_placeholder_params_template.js
+1 -2
View File
@@ -15,8 +15,7 @@ MyApp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({
consts: [[2000], ["src", "placeholder.gif"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyApp_Defer_0_Template, 1, 0);
$r3$.ɵɵtemplate(1, MyApp_DeferPlaceholder_1_Template, 1, 0);
$r3$.ɵɵtemplate(0, MyApp_Defer_0_Template, 1, 0)(1, MyApp_DeferPlaceholder_1_Template, 1, 0);
$r3$.ɵɵdefer(2, 0, null, null, 1, null, null, 0);
$r3$.ɵɵdeferOnIdle();
}
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_prefetch_triggers_template.js
+1 -2
View File
@@ -1,8 +1,7 @@
function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtext(0);
$r3$.ɵɵtemplate(1, MyApp_Defer_1_Template, 1, 1);
$r3$.ɵɵtemplate(2, MyApp_DeferPlaceholder_2_Template, 3, 0);
$r3$.ɵɵtemplate(1, MyApp_Defer_1_Template, 1, 1)(2, MyApp_DeferPlaceholder_2_Template, 3, 0);
$r3$.ɵɵdefer(3, 1, null, null, 2);
$r3$.ɵɵdeferOnIdle();
$r3$.ɵɵdeferPrefetchOnIdle();
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_with_triggers_template.js
+1 -2
View File
@@ -1,8 +1,7 @@
function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtext(0);
$r3$.ɵɵtemplate(1, MyApp_Defer_1_Template, 1, 1);
$r3$.ɵɵtemplate(2, MyApp_DeferPlaceholder_2_Template, 3, 0);
$r3$.ɵɵtemplate(1, MyApp_Defer_1_Template, 1, 1)(2, MyApp_DeferPlaceholder_2_Template, 3, 0);
$r3$.ɵɵdefer(3, 1, null, null, 2);
$r3$.ɵɵdeferOnIdle();
$r3$.ɵɵdeferOnImmediate();
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_i18n/icu_logic/bare_icu.js
+1 -2
View File
@@ -50,8 +50,7 @@ template: function MyComponent_Template(rf, ctx) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18n(1, 0);
$r3$.ɵɵelementEnd();
$r3$.ɵɵtemplate(2, $MyComponent_div_2_Template$, 4, 1, "div", 1);
$r3$.ɵɵtemplate(3, $MyComponent_div_3_Template$, 4, 2, "div", 2);
$r3$.ɵɵtemplate(2, $MyComponent_div_2_Template$, 4, 1, "div", 1)(3, $MyComponent_div_3_Template$, 4, 2, "div", 2);
}
if (rf & 2) {
$r3$.ɵɵadvance(1);
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_i18n/nested_nodes/nested_templates_context.js
+1 -2
View File
@@ -61,8 +61,7 @@ template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, 0);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 5, "div", 1);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 4, 4, "div", 1);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 5, "div", 1)(3, MyComponent_div_3_Template, 4, 4, "div", 1);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementEnd();
}
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_i18n/nested_nodes/self_closing.js
+1 -2
View File
@@ -33,8 +33,7 @@ consts: function() {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "img", 0);
$r3$.ɵɵtemplate(1, MyComponent_img_1_Template, 1, 0, "img", 1);
$r3$.ɵɵtemplate(2, MyComponent_img_2_Template, 2, 1, "img", 2);
$r3$.ɵɵtemplate(1, MyComponent_img_1_Template, 1, 0, "img", 1)(2, MyComponent_img_2_Template, 2, 1, "img", 2);
}
if (rf & 2) {
$r3$.ɵɵadvance(1);
packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_i18n/ng-container_ng-template/structural_directives.js
+1 -2
View File
@@ -31,8 +31,7 @@ consts: function() {
},
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_0_Template, 1, 0, null, 0);
$r3$.ɵɵtemplate(1, MyComponent_ng_container_1_Template, 2, 0, "ng-container", 0);
$r3$.ɵɵtemplate(0, MyComponent_0_Template, 1, 0, null, 0)(1, MyComponent_ng_container_1_Template, 2, 0, "ng-container", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngIf", ctx.someFlag);
packages/compiler/src/render3/view/util.ts
+1
View File
@@ -113,6 +113,7 @@ const CHAINABLE_INSTRUCTIONS = new Set([
R3.textInterpolate7,
R3.textInterpolate8,
R3.textInterpolateV,
R3.templateCreate,
]);
/**
packages/compiler/src/template/pipeline/src/phases/chaining.ts
+1
View File
@@ -36,6 +36,7 @@ const CHAINABLE = new Set([
R3.elementContainer,
R3.listener,
R3.syntheticHostListener,
R3.templateCreate,
]);
/**
packages/core/src/render3/instructions/template.ts
+3 -1
View File
@@ -74,7 +74,7 @@ function templateFirstCreatePass(
export function ɵɵtemplate(
index: number, templateFn: ComponentTemplate<any>|null, decls: number, vars: number,
tagName?: string|null, attrsIndex?: number|null, localRefsIndex?: number|null,
localRefExtractor?: LocalRefExtractor) {
localRefExtractor?: LocalRefExtractor): typeof ɵɵtemplate {
const lView = getLView();
const tView = getTView();
const adjustedIndex = index + HEADER_OFFSET;
@@ -101,6 +101,8 @@ export function ɵɵtemplate(
if (localRefsIndex != null) {
saveResolvedLocalsInData(lView, tNode, localRefExtractor);
}
return ɵɵtemplate;
}
let _locateOrCreateContainerAnchor = createContainerAnchorImpl;
packages/core/test/bundling/forms_reactive/bundle.golden_symbols.json
+3
View File
@@ -1775,6 +1775,9 @@
{
"name": "ɵɵproperty"
},
{
"name": "ɵɵtemplate"
},
{
"name": "ɵɵtext"
}
packages/core/test/bundling/forms_template_driven/bundle.golden_symbols.json
+3
View File
@@ -1760,6 +1760,9 @@
{
"name": "ɵɵproperty"
},
{
"name": "ɵɵtemplate"
},
{
"name": "ɵɵtext"
}