react Architecture Docs
Home / Function/ validateStaticComponents() — react Function Reference

validateStaticComponents() — react Function Reference

Architecture documentation for the validateStaticComponents() function in ValidateStaticComponents.ts from the react codebase.

Function typescript BabelCompiler Validation calls 4 called by 1

Entity Profile

Dependency Diagram

graph TD
  4a1dd21c_7b83_07db_da03_ae42569a7940["validateStaticComponents()"]
  65f4975b_1de3_0e31_4cd0_c510c19d5da5["ValidateStaticComponents.ts"]
  4a1dd21c_7b83_07db_da03_ae42569a7940 -->|defined in| 65f4975b_1de3_0e31_4cd0_c510c19d5da5
  c3bc3875_256f_8f5e_7800_2f9c5bae65eb["runWithEnvironment()"]
  c3bc3875_256f_8f5e_7800_2f9c5bae65eb -->|calls| 4a1dd21c_7b83_07db_da03_ae42569a7940
  02303def_636f_c5b3_a751_1cf138fcea69["pushDiagnostic()"]
  4a1dd21c_7b83_07db_da03_ae42569a7940 -->|calls| 02303def_636f_c5b3_a751_1cf138fcea69
  ac13f5c1_be17_dd7a_6bd3_66d91c46aadf["create()"]
  4a1dd21c_7b83_07db_da03_ae42569a7940 -->|calls| ac13f5c1_be17_dd7a_6bd3_66d91c46aadf
  1a2b7047_24c8_62d6_b328_5f07307d27ab["withDetails()"]
  4a1dd21c_7b83_07db_da03_ae42569a7940 -->|calls| 1a2b7047_24c8_62d6_b328_5f07307d27ab
  531eb985_e192_f9a2_2d7b_5deeb85ba95c["asResult()"]
  4a1dd21c_7b83_07db_da03_ae42569a7940 -->|calls| 531eb985_e192_f9a2_2d7b_5deeb85ba95c
  style 4a1dd21c_7b83_07db_da03_ae42569a7940 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateStaticComponents.ts lines 20–90

export function validateStaticComponents(
  fn: HIRFunction,
): Result<void, CompilerError> {
  const error = new CompilerError();
  const knownDynamicComponents = new Map<IdentifierId, SourceLocation>();
  for (const block of fn.body.blocks.values()) {
    phis: for (const phi of block.phis) {
      for (const operand of phi.operands.values()) {
        const loc = knownDynamicComponents.get(operand.identifier.id);
        if (loc != null) {
          knownDynamicComponents.set(phi.place.identifier.id, loc);
          continue phis;
        }
      }
    }
    for (const instr of block.instructions) {
      const {lvalue, value} = instr;
      switch (value.kind) {
        case 'FunctionExpression':
        case 'NewExpression':
        case 'MethodCall':
        case 'CallExpression': {
          knownDynamicComponents.set(lvalue.identifier.id, value.loc);
          break;
        }
        case 'LoadLocal': {
          const loc = knownDynamicComponents.get(value.place.identifier.id);
          if (loc != null) {
            knownDynamicComponents.set(lvalue.identifier.id, loc);
          }
          break;
        }
        case 'StoreLocal': {
          const loc = knownDynamicComponents.get(value.value.identifier.id);
          if (loc != null) {
            knownDynamicComponents.set(lvalue.identifier.id, loc);
            knownDynamicComponents.set(value.lvalue.place.identifier.id, loc);
          }
          break;
        }
        case 'JsxExpression': {
          if (value.tag.kind === 'Identifier') {
            const location = knownDynamicComponents.get(
              value.tag.identifier.id,
            );
            if (location != null) {
              error.pushDiagnostic(
                CompilerDiagnostic.create({
                  category: ErrorCategory.StaticComponents,
                  reason: 'Cannot create components during render',
                  description: `Components created during render will reset their state each time they are created. Declare components outside of render`,
                })
                  .withDetails({
                    kind: 'error',
                    loc: value.tag.loc,
                    message: 'This component is created during render',
                  })
                  .withDetails({
                    kind: 'error',
                    loc: location,
                    message: 'The component is created during render here',
                  }),
              );
            }
          }
        }
      }
    }
  }
  return error.asResult();
}

Domain

Subdomains

Defined In

Calls

Called By

Source

Frequently Asked Questions

What does validateStaticComponents() do?
validateStaticComponents() is a function in the react codebase, defined in compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateStaticComponents.ts.
Where is validateStaticComponents() defined?
validateStaticComponents() is defined in compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateStaticComponents.ts at line 20.
What does validateStaticComponents() call?
validateStaticComponents() calls 4 function(s): asResult, create, pushDiagnostic, withDetails.
What calls validateStaticComponents()?
validateStaticComponents() is called by 1 function(s): runWithEnvironment.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free