From e2fa06778d71e35c2a4920ab4fc5447291b61278 Mon Sep 17 00:00:00 2001
From: Andrew Kushnir <akushnir@google.com>
Date: Fri, 13 Dec 2024 13:26:15 -0800
Subject: [PATCH] refactor(core): do not serialize parent block id for top
 level blocks

This commit updates incremental hydration-related annotation logic to avoid serializing parent block id when it's `null` (for top-level blocks).
---
 packages/core/src/hydration/annotate.ts                |  6 +++++-
 packages/core/src/hydration/interfaces.ts              |  2 +-
 packages/core/src/hydration/utils.ts                   |  2 +-
 .../platform-server/test/incremental_hydration_spec.ts | 10 +++++-----
 4 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/packages/core/src/hydration/annotate.ts b/packages/core/src/hydration/annotate.ts
index bcb042d1ad74d3..a55f15c9eadce6 100644
--- a/packages/core/src/hydration/annotate.ts
+++ b/packages/core/src/hydration/annotate.ts
@@ -405,7 +405,6 @@ function serializeLContainer(
 
           // Add defer block into info context.deferBlocks
           const deferBlockInfo: SerializedDeferBlock = {
-            [DEFER_PARENT_BLOCK_ID]: parentDeferBlockId,
             [NUM_ROOT_NODES]: rootNodes.length,
             [DEFER_BLOCK_STATE]: lDetails[CURRENT_DEFER_BLOCK_STATE],
           };
@@ -415,6 +414,11 @@ function serializeLContainer(
             deferBlockInfo[DEFER_HYDRATE_TRIGGERS] = serializedTriggers;
           }
 
+          if (parentDeferBlockId !== null) {
+            // Serialize parent id only when it's present.
+            deferBlockInfo[DEFER_PARENT_BLOCK_ID] = parentDeferBlockId;
+          }
+
           context.deferBlocks.set(deferBlockId, deferBlockInfo);
 
           const node = unwrapRNode(lContainer);
diff --git a/packages/core/src/hydration/interfaces.ts b/packages/core/src/hydration/interfaces.ts
index 5808b1795710c1..c66ee9dd3e5fd3 100644
--- a/packages/core/src/hydration/interfaces.ts
+++ b/packages/core/src/hydration/interfaces.ts
@@ -158,7 +158,7 @@ export interface SerializedDeferBlock {
   /**
    * This contains the unique id of this defer block's parent, if it exists.
    */
-  [DEFER_PARENT_BLOCK_ID]: string | null;
+  [DEFER_PARENT_BLOCK_ID]?: string;
 
   /**
    * This field represents a status, based on the `DeferBlockState` enum.
diff --git a/packages/core/src/hydration/utils.ts b/packages/core/src/hydration/utils.ts
index eb9b549d3598b1..49ee3b126e46fb 100644
--- a/packages/core/src/hydration/utils.ts
+++ b/packages/core/src/hydration/utils.ts
@@ -571,7 +571,7 @@ export function getParentBlockHydrationQueue(
   const deferBlockParents = transferState.get(NGH_DEFER_BLOCKS_KEY, {});
 
   let isTopMostDeferBlock = false;
-  let currentBlockId: string | null = deferBlockId;
+  let currentBlockId: string | undefined = deferBlockId;
   let parentBlockPromise: Promise<void> | null = null;
   const hydrationQueue: string[] = [];
 
diff --git a/packages/platform-server/test/incremental_hydration_spec.ts b/packages/platform-server/test/incremental_hydration_spec.ts
index 44e0c8b4665b17..9b93b92b1c019b 100644
--- a/packages/platform-server/test/incremental_hydration_spec.ts
+++ b/packages/platform-server/test/incremental_hydration_spec.ts
@@ -222,7 +222,7 @@ describe('platform-server partial hydration integration', () => {
         const ssrContents = getAppContents(html);
 
         expect(ssrContents).toContain(
-          '"__nghDeferData__":{"d0":{"p":null,"r":1,"s":2},"d1":{"p":"d0","r":2,"s":2}}',
+          '"__nghDeferData__":{"d0":{"r":1,"s":2},"d1":{"r":2,"s":2,"p":"d0"}}',
         );
       });
 
@@ -285,7 +285,7 @@ describe('platform-server partial hydration integration', () => {
         const ssrContents = getAppContents(html);
 
         expect(ssrContents).toContain(
-          '"__nghDeferData__":{"d0":{"p":null,"r":1,"s":2},"d1":{"p":"d0","r":2,"s":2,"t":[2]}}',
+          '"__nghDeferData__":{"d0":{"r":1,"s":2},"d1":{"r":2,"s":2,"t":[2],"p":"d0"}}',
         );
       });
     });
@@ -347,7 +347,7 @@ describe('platform-server partial hydration integration', () => {
         expect(ssrContents).toContain('<p jsaction="click:;keydown:;" ngb="d1');
         // There is an extra annotation in the TransferState data.
         expect(ssrContents).toContain(
-          '"__nghDeferData__":{"d0":{"p":null,"r":1,"s":2},"d1":{"p":"d0","r":1,"s":2}}',
+          '"__nghDeferData__":{"d0":{"r":1,"s":2},"d1":{"r":1,"s":2,"p":"d0"}}',
         );
         // Outer defer block is rendered.
         expect(ssrContents).toContain('Main defer block rendered');
@@ -460,7 +460,7 @@ describe('platform-server partial hydration integration', () => {
         expect(ssrContents).toContain('<p jsaction="click:;keydown:;" ngb="d1');
         // There is an extra annotation in the TransferState data.
         expect(ssrContents).toContain(
-          '"__nghDeferData__":{"d0":{"p":null,"r":1,"s":2},"d1":{"p":"d0","r":1,"s":2}}',
+          '"__nghDeferData__":{"d0":{"r":1,"s":2},"d1":{"r":1,"s":2,"p":"d0"}}',
         );
         // Outer defer block is rendered.
         expect(ssrContents).toContain('Main defer block rendered');
@@ -569,7 +569,7 @@ describe('platform-server partial hydration integration', () => {
         // <p> is inside a nested defer block -> different namespace.
         // expect(ssrContents).toContain('<p jsaction="click:;" ngb="d1');
         // There is an extra annotation in the TransferState data.
-        expect(ssrContents).toContain('"__nghDeferData__":{"d0":{"p":null,"r":1,"s":2}}');
+        expect(ssrContents).toContain('"__nghDeferData__":{"d0":{"r":1,"s":2}}');
         // Outer defer block is rendered.
         expect(ssrContents).toContain('Main defer block rendered');
         // Inner defer block should only display placeholder.