Home / Class/ StableSidemap Class — react Architecture

StableSidemap Class — react Architecture

Architecture documentation for the StableSidemap class in InferReactivePlaces.ts from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  24d977c1_0b75_d998_4952_173d24efaaea["StableSidemap"]
  725143dd_a713_5e8e_fdf0_9c99de3b528f["InferReactivePlaces.ts"]
  24d977c1_0b75_d998_4952_173d24efaaea -->|defined in| 725143dd_a713_5e8e_fdf0_9c99de3b528f
  7e8b7a19_7f97_35ef_befd_1b4af3a5f6eb["constructor()"]
  24d977c1_0b75_d998_4952_173d24efaaea -->|method| 7e8b7a19_7f97_35ef_befd_1b4af3a5f6eb
  0f37c797_b04e_2552_16c2_13b03579eacc["handleInstruction()"]
  24d977c1_0b75_d998_4952_173d24efaaea -->|method| 0f37c797_b04e_2552_16c2_13b03579eacc
  8c11f7cf_78dd_776d_68b9_80dedace987b["isStable()"]
  24d977c1_0b75_d998_4952_173d24efaaea -->|method| 8c11f7cf_78dd_776d_68b9_80dedace987b

Relationship Graph

Source Code

compiler/packages/babel-plugin-react-compiler/src/Inference/InferReactivePlaces.ts lines 43–126

class StableSidemap {
  map: Map<IdentifierId, {isStable: boolean}> = new Map();
  env: Environment;

  constructor(env: Environment) {
    this.env = env;
  }

  handleInstruction(instr: Instruction): void {
    const {value, lvalue} = instr;

    switch (value.kind) {
      case 'CallExpression':
      case 'MethodCall': {
        /**
         * Sources of stability are known hook calls
         */
        if (evaluatesToStableTypeOrContainer(this.env, instr)) {
          if (isStableType(lvalue.identifier)) {
            this.map.set(lvalue.identifier.id, {
              isStable: true,
            });
          } else {
            this.map.set(lvalue.identifier.id, {
              isStable: false,
            });
          }
        }
        break;
      }

      case 'Destructure':
      case 'PropertyLoad': {
        /**
         * PropertyLoads may from stable containers may also produce stable
         * values. ComputedLoads are technically safe for now (as all stable
         * containers have differently-typed elements), but are not handled as
         * they should be rare anyways.
         */
        const source =
          value.kind === 'Destructure'
            ? value.value.identifier.id
            : value.object.identifier.id;
        const entry = this.map.get(source);
        if (entry) {
          for (const lvalue of eachInstructionLValue(instr)) {
            if (isStableTypeContainer(lvalue.identifier)) {
              this.map.set(lvalue.identifier.id, {
                isStable: false,
              });
            } else if (isStableType(lvalue.identifier)) {
              this.map.set(lvalue.identifier.id, {
                isStable: true,
              });
            }
          }
        }
        break;
      }

      case 'StoreLocal': {
        const entry = this.map.get(value.value.identifier.id);
        if (entry) {
          this.map.set(lvalue.identifier.id, entry);
          this.map.set(value.lvalue.place.identifier.id, entry);
        }
        break;
      }

      case 'LoadLocal': {
        const entry = this.map.get(value.place.identifier.id);
        if (entry) {
          this.map.set(lvalue.identifier.id, entry);
        }
        break;
      }
    }
  }

  isStable(id: IdentifierId): boolean {
    const entry = this.map.get(id);

Domain

Frequently Asked Questions

What is the StableSidemap class?
StableSidemap is a class in the react codebase, defined in compiler/packages/babel-plugin-react-compiler/src/Inference/InferReactivePlaces.ts.
Where is StableSidemap defined?
StableSidemap is defined in compiler/packages/babel-plugin-react-compiler/src/Inference/InferReactivePlaces.ts at line 43.

Analyze Your Own Codebase

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

Try Supermodel Free