refactor: remove $indexOffset

Author: edison1105

packages/runtime-vapor/src/dom/hydration.ts

@@ -50,7 +50,6 @@ function performHydration<T>(
     ;(Node.prototype as any).$prevDynamicCount = undefined
     ;(Node.prototype as any).$anchorCount = undefined
     ;(Node.prototype as any).$appendIndex = undefined
-    ;(Node.prototype as any).$indexOffset = undefined
 
     isOptimized = true
   }
@@ -155,13 +154,12 @@ function locateHydrationNodeImpl(): void {
     const {
       $prevDynamicCount: prevDynamicCount = 0,
       $appendIndex: appendIndex,
-      $indexOffset: indexOffset = 0,
       $anchorCount: anchorCount = 0,
     } = insertionParent!
     // prepend
     if (insertionAnchor === 0) {
       // use prevDynamicCount as logical index to locate the hydration node
-      const realIndex = idxMap![prevDynamicCount] + indexOffset
+      const realIndex = idxMap![prevDynamicCount]
       node = insertionParent!.childNodes[realIndex]
     }
     // insert
@@ -173,7 +171,7 @@ function locateHydrationNodeImpl(): void {
       // consecutive insert operations locate the correct hydration node.
       let { $idx, $uc: usedCount } = insertionAnchor as ChildItem
       if (usedCount !== undefined) {
-        const realIndex = idxMap![$idx + usedCount + 1] + indexOffset
+        const realIndex = idxMap![$idx + usedCount + 1]
         node = insertionParent!.childNodes[realIndex]
         usedCount++
       } else {
@@ -189,19 +187,19 @@ function locateHydrationNodeImpl(): void {
     else {
       let realIndex: number
       if (appendIndex !== null && appendIndex !== undefined) {
-        realIndex = idxMap![appendIndex + 1] + indexOffset
+        realIndex = idxMap![appendIndex + 1]
         node = insertionParent!.childNodes[realIndex]
       } else {
         if (insertionAnchor === null) {
           // insertionAnchor is null, indicates no previous static nodes
           // use the first child as hydration node
-          realIndex = idxMap![0] + indexOffset
+          realIndex = idxMap![0]
           node = insertionParent!.childNodes[realIndex]
         } else {
           // insertionAnchor is a number > 0
           // indicates how many static nodes precede the node to append
           // use it as index to locate the hydration node
-          realIndex = idxMap![prevDynamicCount + insertionAnchor] + indexOffset
+          realIndex = idxMap![prevDynamicCount + insertionAnchor]
           node = insertionParent!.childNodes[realIndex]
         }
       }

packages/runtime-vapor/src/dom/node.ts

@@ -76,7 +76,6 @@ export function __nthChild(node: Node, i: number): Node {
       $prevDynamicCount: prevDynamicCount = 0,
       $anchorCount: anchorCount = 0,
       $idxMap: idxMap,
-      $indexOffset: indexOffset = 0,
     } = parent
     // prevDynamicCount tracks how many dynamic nodes have been processed
     // so far (prepend/insert/append).
@@ -87,9 +86,9 @@ export function __nthChild(node: Node, i: number): Node {
     // anchorCount equals the number of unique anchors seen, so we
     // subtract it to neutralize those "first-use doesn't consume" cases:
     //   base = prevDynamicCount - anchorCount
-    // Then index from this base: idxMap[base + i] + indexOffset.
+    // Then index from this base: idxMap[base + i]
     const logicalIndex = prevDynamicCount - anchorCount + i
-    const realIndex = idxMap[logicalIndex] + indexOffset
+    const realIndex = idxMap[logicalIndex]
     return node.childNodes[realIndex]
   }
   return node.childNodes[i]
@@ -108,10 +107,10 @@ export function _next(node: Node): Node {
 export function __next(node: Node): Node {
   const parent = node.parentNode! as InsertionParent
   if (parent.$idxMap) {
-    const { $idxMap: idxMap, $indexOffset: indexOffset = 0 } = parent
+    const { $idxMap: idxMap } = parent
     const { $idx, $uc: usedCount = 0 } = node as ChildItem
     const logicalIndex = $idx + usedCount + 1
-    const realIndex = idxMap[logicalIndex] + indexOffset
+    const realIndex = idxMap[logicalIndex]
     return node.parentNode!.childNodes[realIndex]
   }
   return node.nextSibling!

packages/runtime-vapor/src/fragment.ts

@@ -9,9 +9,8 @@ import {
   isValidBlock,
   remove,
 } from './block'
-import type { TransitionHooks } from '@vue/runtime-dom'
+import { type TransitionHooks, queuePostFlushCb } from '@vue/runtime-dom'
 import {
-  advanceHydrationNode,
   currentHydrationNode,
   isComment,
   isHydrating,
@@ -24,7 +23,6 @@ import {
 } from './components/Transition'
 import { type VaporComponentInstance, isVaporComponent } from './component'
 import { isArray } from '@vue/shared'
-import { incrementIndexOffset } from './insertionState'
 
 export class VaporFragment<T extends Block = Block>
   implements TransitionOptions
@@ -181,13 +179,14 @@ export class DynamicFragment extends VaporFragment {
 
     // create an anchor
     const { parentNode, nextSibling } = findLastChild(this)!
-    parentNode!.insertBefore(
-      (this.anchor = createComment(this.anchorLabel!)),
-      nextSibling,
-    )
-    // increment index offset since we dynamically inserted a comment node
-    incrementIndexOffset(parentNode!)
-    advanceHydrationNode(this.anchor)
+    queuePostFlushCb(() => {
+      parentNode!.insertBefore(
+        (this.anchor = __DEV__
+          ? createComment(this.anchorLabel!)
+          : createTextNode()),
+        nextSibling,
+      )
+    })
   }
 }
 

packages/runtime-vapor/src/insertionState.ts

@@ -19,8 +19,6 @@ export type InsertionParent = ParentNode & {
   $anchorCount?: number
   // last append index
   $appendIndex?: number | null
-  // number of dynamically inserted nodes (e.g., comment anchors)
-  $indexOffset?: number
 }
 export let insertionParent: InsertionParent | undefined
 export let insertionAnchor: Node | 0 | undefined | null
@@ -88,7 +86,6 @@ function initializeHydrationState(parent: InsertionParent) {
     parent.$prevDynamicCount = 0
     parent.$anchorCount = 0
     parent.$appendIndex = null
-    parent.$indexOffset = 0
   }
 }
 
@@ -149,12 +146,3 @@ function cacheTemplateChildren(parent: InsertionParent) {
 export function resetInsertionState(): void {
   insertionParent = insertionAnchor = undefined
 }
-
-export function incrementIndexOffset(
-  parent: InsertionParent,
-  offset: number = 1,
-): void {
-  if (parent.$indexOffset !== undefined) {
-    parent.$indexOffset += offset
-  }
-}