From d6da6313c116c086827adac5a62303b75a6c7b47 Mon Sep 17 00:00:00 2001 From: Jessica Janiuk Date: Tue, 26 Nov 2024 11:52:34 -0500 Subject: [PATCH] refactor(compiler): Adds ingest and flags for defer details (#58833) This adds TDeferDetailsFlags to indicate the presence of hydration triggers, and any future flags we add to defer. PR Close #58833 --- .../defer_hydrate_order_template.js | 2 +- .../defer_with_hydrate_triggers_template.js | 2 +- .../src/template/pipeline/ir/src/enums.ts | 9 ++++++++ .../template/pipeline/ir/src/ops/create.ts | 4 ++++ .../src/template/pipeline/src/ingest.ts | 21 +++++++++++++++++++ .../src/template/pipeline/src/instruction.ts | 2 ++ .../src/template/pipeline/src/phases/reify.ts | 1 + packages/core/src/defer/instructions.ts | 6 ++++++ packages/core/src/defer/interfaces.ts | 14 +++++++++++++ 9 files changed, 59 insertions(+), 2 deletions(-) diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_hydrate_order_template.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_hydrate_order_template.js index f61bad7d9ebb2..30cd0ab34f5a3 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_hydrate_order_template.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_hydrate_order_template.js @@ -1,7 +1,7 @@ function MyApp_Template(rf, ctx) { if (rf & 1) { $r3$.ɵɵtemplate(0, MyApp_Defer_0_Template, 1, 0)(1, MyApp_DeferPlaceholder_1_Template, 2, 0); - $r3$.ɵɵdefer(2, 0, null, null, 1); + $r3$.ɵɵdefer(2, 0, null, null, 1, null, null, null, null, 1); $r3$.ɵɵdeferHydrateOnTimer(1337); $r3$.ɵɵdeferPrefetchOnViewport(0, -1); } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_with_hydrate_triggers_template.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_with_hydrate_triggers_template.js index 7d3b689c1b4a9..6f9fab5c8d1f9 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_with_hydrate_triggers_template.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/defer_with_hydrate_triggers_template.js @@ -2,7 +2,7 @@ function MyApp_Template(rf, ctx) { if (rf & 1) { $r3$.ɵɵtext(0); $r3$.ɵɵtemplate(1, MyApp_Defer_1_Template, 1, 1); - $r3$.ɵɵdefer(2, 1); + $r3$.ɵɵdefer(2, 1, null, null, null, null, null, null, null, 1); $r3$.ɵɵdeferHydrateOnIdle(); $r3$.ɵɵdeferHydrateOnImmediate(); $r3$.ɵɵdeferHydrateOnTimer(1337); diff --git a/packages/compiler/src/template/pipeline/ir/src/enums.ts b/packages/compiler/src/template/pipeline/ir/src/enums.ts index 014f8c3908f56..3750ab5a01a39 100644 --- a/packages/compiler/src/template/pipeline/ir/src/enums.ts +++ b/packages/compiler/src/template/pipeline/ir/src/enums.ts @@ -601,3 +601,12 @@ export const enum DeferOpModifierKind { PREFETCH = 'prefetch', HYDRATE = 'hydrate', } + +export const enum TDeferDetailsFlags { + Default = 0, + + /** + * Whether or not the defer block has hydrate triggers. + */ + HasHydrateTriggers = 1 << 0, +} diff --git a/packages/compiler/src/template/pipeline/ir/src/ops/create.ts b/packages/compiler/src/template/pipeline/ir/src/ops/create.ts index 41cdb3d9d5509..dbf9b679e8961 100644 --- a/packages/compiler/src/template/pipeline/ir/src/ops/create.ts +++ b/packages/compiler/src/template/pipeline/ir/src/ops/create.ts @@ -18,6 +18,7 @@ import { I18nParamValueFlags, Namespace, OpKind, + TDeferDetailsFlags, TemplateKind, } from '../enums'; import {SlotHandle} from '../handle'; @@ -941,6 +942,8 @@ export interface DeferOp extends Op, ConsumesSlotOpTrait { */ resolverFn: o.Expression | null; + flags: TDeferDetailsFlags | null; + sourceSpan: ParseSourceSpan; } @@ -971,6 +974,7 @@ export function createDeferOp( errorSlot: null, ownResolverFn, resolverFn, + flags: null, sourceSpan, ...NEW_OP, ...TRAIT_CONSUMES_SLOT, diff --git a/packages/compiler/src/template/pipeline/src/ingest.ts b/packages/compiler/src/template/pipeline/src/ingest.ts index 402573a7ccdc2..c3bfd3fb0ad0b 100644 --- a/packages/compiler/src/template/pipeline/src/ingest.ts +++ b/packages/compiler/src/template/pipeline/src/ingest.ts @@ -665,6 +665,7 @@ function ingestDeferBlock(unit: ViewCompilationUnit, deferBlock: t.DeferredBlock deferOp.placeholderMinimumTime = deferBlock.placeholder?.minimumTime ?? null; deferOp.loadingMinimumTime = deferBlock.loading?.minimumTime ?? null; deferOp.loadingAfterTime = deferBlock.loading?.afterTime ?? null; + deferOp.flags = hasHydrateTriggers(deferBlock.hydrateTriggers); unit.create.push(deferOp); // Configure all defer `on` conditions. @@ -721,6 +722,26 @@ function ingestDeferBlock(unit: ViewCompilationUnit, deferBlock: t.DeferredBlock unit.update.push(deferWhenOps); } +function hasHydrateTriggers( + triggers: Readonly, +): ir.TDeferDetailsFlags | null { + if ( + !!( + triggers.hover || + triggers.idle || + triggers.immediate || + triggers.interaction || + triggers.never || + triggers.timer || + triggers.viewport || + triggers.when + ) + ) { + return ir.TDeferDetailsFlags.HasHydrateTriggers; + } + return null; +} + function ingestDeferTriggers( modifier: ir.DeferOpModifierKind, triggers: Readonly, diff --git a/packages/compiler/src/template/pipeline/src/instruction.ts b/packages/compiler/src/template/pipeline/src/instruction.ts index 67db9e8ce2d1c..2d736390b6238 100644 --- a/packages/compiler/src/template/pipeline/src/instruction.ts +++ b/packages/compiler/src/template/pipeline/src/instruction.ts @@ -243,6 +243,7 @@ export function defer( placeholderConfig: o.Expression | null, enableTimerScheduling: boolean, sourceSpan: ParseSourceSpan | null, + flags: ir.TDeferDetailsFlags | null, ): ir.CreateOp { const args: Array = [ o.literal(selfSlot), @@ -254,6 +255,7 @@ export function defer( loadingConfig ?? o.literal(null), placeholderConfig ?? o.literal(null), enableTimerScheduling ? o.importExpr(Identifiers.deferEnableTimerScheduling) : o.literal(null), + o.literal(flags), ]; let expr: o.Expression; diff --git a/packages/compiler/src/template/pipeline/src/phases/reify.ts b/packages/compiler/src/template/pipeline/src/phases/reify.ts index e6babe7e82c45..16f78439a8172 100644 --- a/packages/compiler/src/template/pipeline/src/phases/reify.ts +++ b/packages/compiler/src/template/pipeline/src/phases/reify.ts @@ -263,6 +263,7 @@ function reifyCreateOperations(unit: CompilationUnit, ops: ir.OpList | null; + + /** + * Flags + */ + flags: TDeferDetailsFlags; +} + +export const enum TDeferDetailsFlags { + Default = 0, + + /** + * Whether or not the defer block has hydrate triggers. + */ + HasHydrateTriggers = 1 << 0, } /**