removeJSXChildren() — react Function Reference

Architecture documentation for the removeJSXChildren() function in minimize.ts from the react codebase.

Function typescript BabelCompiler Optimization calls 1

Entity Profile

BabelCompiler→ Optimization→ removeJSXChildren() — react Function Reference

Dependency Diagram

graph TD
  8be81965_d63c_6313_3746_0ad599f78d8c["removeJSXChildren()"]
  9c061da8_dbf8_4168_823d_991654a3c55d["minimize.ts"]
  8be81965_d63c_6313_3746_0ad599f78d8c -->|defined in| 9c061da8_dbf8_4168_823d_991654a3c55d
  7a9af496_ef6a_d9e8_8eaf_1f386f49e4b3["cloneAst()"]
  8be81965_d63c_6313_3746_0ad599f78d8c -->|calls| 7a9af496_ef6a_d9e8_8eaf_1f386f49e4b3
  style 8be81965_d63c_6313_3746_0ad599f78d8c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/snap/src/minimize.ts lines 1395–1429

function* removeJSXChildren(ast: t.File): Generator<t.File> {
  // Collect all JSX elements with children
  const jsxSites: Array<{jsxIndex: number; childCount: number}> = [];
  let jsxIndex = 0;
  t.traverseFast(ast, node => {
    if (t.isJSXElement(node) && node.children.length > 0) {
      jsxSites.push({jsxIndex, childCount: node.children.length});
      jsxIndex++;
    }
  });

  // For each JSX element, try removing each child one at a time (from end to start)
  for (const {jsxIndex: targetJsxIdx, childCount} of jsxSites) {
    for (let childIdx = childCount - 1; childIdx >= 0; childIdx--) {
      const cloned = cloneAst(ast);
      let idx = 0;
      let modified = false;

      t.traverseFast(cloned, node => {
        if (modified) return;
        if (t.isJSXElement(node) && node.children.length > 0) {
          if (idx === targetJsxIdx && childIdx < node.children.length) {
            node.children.splice(childIdx, 1);
            modified = true;
          }
          idx++;
        }
      });

      if (modified) {
        yield cloned;
      }
    }
  }
}