chore: rename

packages/compiler-ssr/src/ssrCodegenTransform.ts

@@ -22,8 +22,8 @@ import {
   processExpression,
 } from '@vue/compiler-dom'
 import {
-  DYNAMIC_END_ANCHOR_LABEL,
-  DYNAMIC_START_ANCHOR_LABEL,
+  BLOCK_END_ANCHOR_LABEL,
+  BLOCK_START_ANCHOR_LABEL,
   escapeHtml,
   isString,
 } from '@vue/shared'
@@ -163,10 +163,10 @@ export function processChildren(
   asFragment = false,
   disableNestedFragments = false,
   disableComment = false,
-  asDynamic = false,
+  asBlock = false,
 ): void {
-  if (asDynamic) {
-    context.pushStringPart(`<!--${DYNAMIC_START_ANCHOR_LABEL}-->`)
+  if (asBlock) {
+    context.pushStringPart(`<!--${BLOCK_START_ANCHOR_LABEL}-->`)
   }
   if (asFragment) {
     context.pushStringPart(`<!--[-->`)
@@ -175,11 +175,11 @@ export function processChildren(
   const { children, type, tagType } = parent as PlainElementNode
   const inElement =
     type === NodeTypes.ELEMENT && tagType === ElementTypes.ELEMENT
-  if (inElement) processChildrenDynamicInfo(children)
+  if (inElement) processChildrenBlockInfo(children)
 
   for (let i = 0; i < children.length; i++) {
     const child = children[i]
-    if (inElement && shouldProcessChildAsDynamic(parent, child)) {
+    if (inElement && shouldProcessChildAsBlock(parent, child)) {
       processChildren(
         { children: [child] },
         context,
@@ -198,10 +198,10 @@ export function processChildren(
             break
           case ElementTypes.COMPONENT:
             if (inElement)
-              context.pushStringPart(`<!--${DYNAMIC_START_ANCHOR_LABEL}-->`)
+              context.pushStringPart(`<!--${BLOCK_START_ANCHOR_LABEL}-->`)
             ssrProcessComponent(child, context, parent)
             if (inElement)
-              context.pushStringPart(`<!--${DYNAMIC_END_ANCHOR_LABEL}-->`)
+              context.pushStringPart(`<!--${BLOCK_END_ANCHOR_LABEL}-->`)
             break
           case ElementTypes.SLOT:
             ssrProcessSlotOutlet(child, context)
@@ -267,8 +267,8 @@ export function processChildren(
   if (asFragment) {
     context.pushStringPart(`<!--]-->`)
   }
-  if (asDynamic) {
-    context.pushStringPart(`<!--${DYNAMIC_END_ANCHOR_LABEL}-->`)
+  if (asBlock) {
+    context.pushStringPart(`<!--${BLOCK_END_ANCHOR_LABEL}-->`)
   }
 }
 
@@ -288,15 +288,15 @@ const isStaticChildNode = (c: TemplateChildNode): boolean =>
   c.type === NodeTypes.TEXT ||
   c.type === NodeTypes.COMMENT
 
-interface DynamicInfo {
+interface BlockInfo {
   hasStaticPrevious: boolean
   hasStaticNext: boolean
-  prevDynamicCount: number
-  nextDynamicCount: number
+  prevBlockCount: number
+  nextBlockCount: number
 }
 
-function processChildrenDynamicInfo(
-  children: (TemplateChildNode & { _ssrDynamicInfo?: DynamicInfo })[],
+function processChildrenBlockInfo(
+  children: (TemplateChildNode & { _ssrBlockInfo?: BlockInfo })[],
 ): void {
   const filteredChildren = children.filter(
     child => !(child.type === NodeTypes.TEXT && !child.content.trim()),
@@ -311,112 +311,83 @@ function processChildrenDynamicInfo(
     ) {
       continue
     }
-    child._ssrDynamicInfo = {
+    child._ssrBlockInfo = {
       hasStaticPrevious: false,
       hasStaticNext: false,
-      prevDynamicCount: 0,
-      nextDynamicCount: 0,
+      prevBlockCount: 0,
+      nextBlockCount: 0,
     }
 
-    const info = child._ssrDynamicInfo
+    const info = child._ssrBlockInfo
 
-    // Calculate the previous static and dynamic node counts
+    // Calculate the previous static and block node counts
     let foundStaticPrev = false
-    let dynamicCountPrev = 0
+    let blockCountPrev = 0
     for (let j = i - 1; j >= 0; j--) {
       const prevChild = filteredChildren[j]
       if (isStaticChildNode(prevChild)) {
         foundStaticPrev = true
         break
       }
-      // if the previous child has dynamic info, use it
-      else if (prevChild._ssrDynamicInfo) {
-        foundStaticPrev = prevChild._ssrDynamicInfo.hasStaticPrevious
-        dynamicCountPrev = prevChild._ssrDynamicInfo.prevDynamicCount + 1
+      // if the previous child has block info, use it
+      else if (prevChild._ssrBlockInfo) {
+        foundStaticPrev = prevChild._ssrBlockInfo.hasStaticPrevious
+        blockCountPrev = prevChild._ssrBlockInfo.prevBlockCount + 1
         break
       }
-      dynamicCountPrev++
+      blockCountPrev++
     }
     info.hasStaticPrevious = foundStaticPrev
-    info.prevDynamicCount = dynamicCountPrev
+    info.prevBlockCount = blockCountPrev
 
-    // Calculate the number of static and dynamic nodes afterwards
+    // Calculate the number of static and block nodes afterwards
     let foundStaticNext = false
-    let dynamicCountNext = 0
+    let blockCountNext = 0
     for (let j = i + 1; j < filteredChildren.length; j++) {
       const nextChild = filteredChildren[j]
       if (isStaticChildNode(nextChild)) {
         foundStaticNext = true
         break
       }
-      // if the next child has dynamic info, use it
-      else if (nextChild._ssrDynamicInfo) {
-        foundStaticNext = nextChild._ssrDynamicInfo.hasStaticNext
-        dynamicCountNext = nextChild._ssrDynamicInfo.nextDynamicCount + 1
+      // if the next child has block info, use it
+      else if (nextChild._ssrBlockInfo) {
+        foundStaticNext = nextChild._ssrBlockInfo.hasStaticNext
+        blockCountNext = nextChild._ssrBlockInfo.nextBlockCount + 1
         break
       }
-      dynamicCountNext++
+      blockCountNext++
     }
     info.hasStaticNext = foundStaticNext
-    info.nextDynamicCount = dynamicCountNext
+    info.nextBlockCount = blockCountNext
   }
 }
 
-/**
- * Check if a node should be processed as dynamic child.
- * This is primarily used in Vapor mode hydration to wrap dynamic parts
- * with markers (`<!--[[-->` and `<!--]]-->`).
- * The purpose is to distinguish the boundaries of nodes during vapor hydration
- *
- * 1. two consecutive dynamic nodes should only wrap the second one
- * <element>
- *   <element/>  // Static node
- *   <Comp/>     // Dynamic node -> should NOT be wrapped
- *   <Comp/>     // Dynamic node -> should be wrapped
- *   <element/>  // Static node
- * </element>
- *
- * 2. three or more consecutive dynamic nodes should only wrap the
- *    middle nodes, leaving the first and last static.
- * <element>
- *  <element/>  // Static node
- *  <Comp/>     // Dynamic node -> should NOT be wrapped
- *  <Comp/>     // Dynamic node -> should be wrapped
- *  <Comp/>     // Dynamic node -> should be wrapped
- *  <Comp/>     // Dynamic node -> should NOT be wrapped
- *  <element/>  // Static node
- * </element>
- */
-function shouldProcessChildAsDynamic(
+function shouldProcessChildAsBlock(
   parent: { tag?: string; children: TemplateChildNode[] },
-  node: TemplateChildNode & { _ssrDynamicInfo?: DynamicInfo },
+  node: TemplateChildNode & { _ssrBlockInfo?: BlockInfo },
 ): boolean {
   // must be inside a parent element
   if (!parent.tag) return false
 
-  // must has dynamic info
-  const { _ssrDynamicInfo: info } = node
+  // must has block info
+  const { _ssrBlockInfo: info } = node
   if (!info) return false
 
-  const {
-    hasStaticPrevious,
-    hasStaticNext,
-    prevDynamicCount,
-    nextDynamicCount,
-  } = info
+  const { hasStaticPrevious, hasStaticNext, prevBlockCount, nextBlockCount } =
+    info
 
   // must have static nodes on both sides
   if (!hasStaticPrevious || !hasStaticNext) return false
 
-  const dynamicNodeCount = 1 + prevDynamicCount + nextDynamicCount
+  const blockNodeCount = 1 + prevBlockCount + nextBlockCount
 
-  // For two consecutive dynamic nodes, mark the second one as dynamic
-  if (dynamicNodeCount === 2) {
-    return prevDynamicCount > 0
+  // For two consecutive block nodes, mark the second one as block
+  if (blockNodeCount === 2) {
+    return prevBlockCount > 0
   }
-  // For three or more dynamic nodes, mark the middle nodes as dynamic
-  else if (dynamicNodeCount >= 3) {
-    return prevDynamicCount > 0 && nextDynamicCount > 0
+  // For three or more block nodes, mark the middle nodes as block
+  else if (blockNodeCount >= 3) {
+    return prevBlockCount > 0 && nextBlockCount > 0
   }
 
   return false

packages/runtime-core/src/hydration.ts

@@ -32,7 +32,7 @@ import {
   isRenderableAttrValue,
   isReservedProp,
   isString,
-  isVaporAnchors,
+  isVaporAnchor,
   normalizeClass,
   normalizeCssVarValue,
   normalizeStyle,
@@ -129,7 +129,7 @@ export function createHydrationFunctions(
   function nextSibling(node: Node) {
     let n = next(node)
     // skip vapor mode specific anchors
-    if (n && isVaporAnchors(n)) {
+    if (n && isVaporAnchor(n)) {
       n = next(n)
     }
     return n
@@ -162,7 +162,7 @@ export function createHydrationFunctions(
     optimized = false,
   ): Node | null => {
     // skip vapor mode specific anchors
-    if (isVaporAnchors(node)) {
+    if (isVaporAnchor(node)) {
       node = nextSibling(node)!
     }
     optimized = optimized || !!vnode.dynamicChildren

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

@@ -13,7 +13,7 @@ import {
   disableHydrationNodeLookup,
   enableHydrationNodeLookup,
 } from './node'
-import { DYNAMIC_END_ANCHOR_LABEL, isVaporAnchors } from '@vue/shared'
+import { BLOCK_END_ANCHOR_LABEL, isVaporAnchor } from '@vue/shared'
 
 export let isHydrating = false
 export let currentHydrationNode: Node | null = null
@@ -25,7 +25,7 @@ export function setCurrentHydrationNode(node: Node | null): void {
 function findParentSibling(n: Node): Node | null {
   if (!n.parentNode) return null
   let next = n.parentNode.nextSibling
-  while (next && isComment(next, DYNAMIC_END_ANCHOR_LABEL)) {
+  while (next && isComment(next, BLOCK_END_ANCHOR_LABEL)) {
     next = next.nextElementSibling
   }
   return next ? next : findParentSibling(n.parentNode)
@@ -33,7 +33,7 @@ function findParentSibling(n: Node): Node | null {
 
 export function advanceHydrationNode(node: Node & { $ps?: Node | null }): void {
   let next = node.nextSibling
-  while (next && isComment(next, DYNAMIC_END_ANCHOR_LABEL)) {
+  while (next && isComment(next, BLOCK_END_ANCHOR_LABEL)) {
     next = next.nextSibling
   }
 
@@ -195,7 +195,7 @@ export function isNonHydrationNode(node: Node): boolean {
     // vdom fragment end anchor (`<!--]-->`)
     isComment(node, ']') ||
     // vapor mode specific anchors
-    isVaporAnchors(node)
+    isVaporAnchor(node)
   )
 }
 

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

@@ -1,8 +1,8 @@
 import { isComment, isNonHydrationNode, locateEndAnchor } from './hydration'
 import {
-  DYNAMIC_END_ANCHOR_LABEL,
-  DYNAMIC_START_ANCHOR_LABEL,
-  isVaporAnchors,
+  BLOCK_END_ANCHOR_LABEL,
+  BLOCK_START_ANCHOR_LABEL,
+  isVaporAnchor,
 } from '@vue/shared'
 
 /*! #__NO_SIDE_EFFECTS__ */
@@ -54,7 +54,7 @@ export function _child(node: ParentNode): Node {
  *     The subsequent `_setText(n1, ...)` would fail or target the wrong node.
  *
  *   Solution (`__child`):
- *   - `__child(n2, offset)` is used during hydration. It skips the dynamic children
+ *   - `__child(n2, offset)` is used during hydration. It skips the block children
  *     to find the "Actual Text Node", correctly matching the client's expectation
  *     for `n1`.
  */
@@ -69,7 +69,7 @@ export function __child(node: ParentNode, offset?: number): Node {
   }
 
   let n = offset ? __nthChild(node, offset) : node.firstChild!
-  while (n && (isComment(n, '[') || isVaporAnchors(n))) {
+  while (n && (isComment(n, '[') || isVaporAnchor(n))) {
     if (isComment(n, '[')) {
       n = locateEndAnchor(n)!.nextSibling!
     } else {
@@ -105,13 +105,13 @@ export function _next(node: Node): Node {
 /**
  * Hydration-specific version of `next`.
  *
- * SSR comment anchors (fragments `<!--[-->...<!--]-->`, dynamic `<!--[[-->...<!--]]-->`)
+ * SSR comment anchors (fragments `<!--[-->...<!--]-->`, block `<!--[[-->...<!--]]-->`)
  * disrupt standard `node.nextSibling` traversal during hydration. `_next` might
  * return a comment node or an internal node of a fragment instead of skipping
  * the entire fragment block.
  *
  * Example:
- *   Template: `<div>Node1<!>Node2</div>` (where <!> is a dynamic component placeholder)
+ *   Template: `<div>Node1<!>Node2</div>` (where <!> is a block node placeholder)
  *
  *   Client Compiled Code (Simplified):
  *     const n2 = t0() // n2 = `<div>Node1<!---->Node2</div>`
@@ -139,17 +139,17 @@ export function _next(node: Node): Node {
  *     allowing the component to be hydrated correctly relative to `Node1` and `Node2`.
  *
  * This function ensures traversal correctly skips over non-hydration nodes and
- * treats entire fragment/dynamic blocks (when starting *from* their beginning anchor)
+ * treats entire fragment/block nodes (when starting *from* their beginning anchor)
  * as single logical units to find the next actual sibling node for hydration matching.
  */
 /*! #__NO_SIDE_EFFECTS__ */
 export function __next(node: Node): Node {
-  // process dynamic node (<!--[[-->...<!--]]-->) as a single node
-  if (isComment(node, DYNAMIC_START_ANCHOR_LABEL)) {
+  // process block node (<!--[[-->...<!--]]-->) as a single node
+  if (isComment(node, BLOCK_START_ANCHOR_LABEL)) {
     node = locateEndAnchor(
       node,
-      DYNAMIC_START_ANCHOR_LABEL,
-      DYNAMIC_END_ANCHOR_LABEL,
+      BLOCK_START_ANCHOR_LABEL,
+      BLOCK_END_ANCHOR_LABEL,
     )!
   }
 

packages/shared/src/domAnchors.ts

@@ -1,5 +1,5 @@
-export const DYNAMIC_START_ANCHOR_LABEL = '[['
-export const DYNAMIC_END_ANCHOR_LABEL = ']]'
+export const BLOCK_START_ANCHOR_LABEL = '[['
+export const BLOCK_END_ANCHOR_LABEL = ']]'
 
 export const IF_ANCHOR_LABEL: string = 'if'
 export const ELSE_IF_ANCHOR_LABEL: string = 'else-if'
@@ -7,13 +7,11 @@ export const DYNAMIC_COMPONENT_ANCHOR_LABEL: string = 'dynamic-component'
 export const FOR_ANCHOR_LABEL: string = 'for'
 export const SLOT_ANCHOR_LABEL: string = 'slot'
 
-export function isDynamicAnchor(node: Node): node is Comment {
+export function isBlockAnchor(node: Node): node is Comment {
   if (node.nodeType !== 8) return false
 
   const data = (node as Comment).data
-  return (
-    data === DYNAMIC_START_ANCHOR_LABEL || data === DYNAMIC_END_ANCHOR_LABEL
-  )
+  return data === BLOCK_START_ANCHOR_LABEL || data === BLOCK_END_ANCHOR_LABEL
 }
 
 export function isVaporFragmentAnchor(node: Node): node is Comment {
@@ -28,6 +26,6 @@ export function isVaporFragmentAnchor(node: Node): node is Comment {
   )
 }
 
-export function isVaporAnchors(node: Node): node is Comment {
-  return isDynamicAnchor(node) || isVaporFragmentAnchor(node)
+export function isVaporAnchor(node: Node): node is Comment {
+  return isBlockAnchor(node) || isVaporFragmentAnchor(node)
 }