ReactDOMComponentTree.js — react Source File

Architecture documentation for ReactDOMComponentTree.js, a javascript file in the react codebase. 6 imports, 14 dependents.

File javascript BabelCompiler Validation 6 imports 14 dependents 5 functions

Entity Profile

BabelCompiler→ Validation→ ReactDOMComponentTree.js — react Source File

Dependency Diagram

graph LR
  799a7834_f34c_8596_4026_015681eee732["ReactDOMComponentTree.js"]
  d908643f_a970_7fa5_64a4_010ab47f44ac["ReactDOMEventHandleTypes.js"]
  799a7834_f34c_8596_4026_015681eee732 --> d908643f_a970_7fa5_64a4_010ab47f44ac
  9c694103_7f39_88d0_6b4d_f9b2ffed5731["ReactFiberConfigDOM.js"]
  799a7834_f34c_8596_4026_015681eee732 --> 9c694103_7f39_88d0_6b4d_f9b2ffed5731
  42892443_e223_3da0_aeb9_e1b32a408fb0["ReactInternalTypes"]
  799a7834_f34c_8596_4026_015681eee732 --> 42892443_e223_3da0_aeb9_e1b32a408fb0
  d8f20c67_f5fa_0f0a_c967_c41fd9ffce07["ReactTypes"]
  799a7834_f34c_8596_4026_015681eee732 --> d8f20c67_f5fa_0f0a_c967_c41fd9ffce07
  f8f61929_42ba_4030_bc4f_a1c5484f5f32["ReactWorkTags"]
  799a7834_f34c_8596_4026_015681eee732 --> f8f61929_42ba_4030_bc4f_a1c5484f5f32
  8344de1b_978c_be0f_eebd_38ccc4962a93["ReactFeatureFlags"]
  799a7834_f34c_8596_4026_015681eee732 --> 8344de1b_978c_be0f_eebd_38ccc4962a93
  390123a6_56c3_29ed_a331_44deb86078d6["DOMPropertyOperations.js"]
  390123a6_56c3_29ed_a331_44deb86078d6 --> 799a7834_f34c_8596_4026_015681eee732
  cfeccfd9_d509_de2e_b7f5_99190c395b57["ReactDOMEventHandle.js"]
  cfeccfd9_d509_de2e_b7f5_99190c395b57 --> 799a7834_f34c_8596_4026_015681eee732
  ebd36fdb_cc70_52b6_9971_bcace1958602["ReactDOMInput.js"]
  ebd36fdb_cc70_52b6_9971_bcace1958602 --> 799a7834_f34c_8596_4026_015681eee732
  9c694103_7f39_88d0_6b4d_f9b2ffed5731["ReactFiberConfigDOM.js"]
  9c694103_7f39_88d0_6b4d_f9b2ffed5731 --> 799a7834_f34c_8596_4026_015681eee732
  816b54e5_c63c_f8b2_68e8_0c637e281f03["DOMPluginEventSystem.js"]
  816b54e5_c63c_f8b2_68e8_0c637e281f03 --> 799a7834_f34c_8596_4026_015681eee732
  74eeea73_e707_14a2_2e53_d0f6ccb65091["ReactDOMControlledComponent.js"]
  74eeea73_e707_14a2_2e53_d0f6ccb65091 --> 799a7834_f34c_8596_4026_015681eee732
  59469541_eb24_2e4d_9b1d_8719abe8ae49["ReactDOMEventListener.js"]
  59469541_eb24_2e4d_9b1d_8719abe8ae49 --> 799a7834_f34c_8596_4026_015681eee732
  2d4946a3_3487_598a_390d_fcf4897abb9b["ReactDOMEventReplaying.js"]
  2d4946a3_3487_598a_390d_fcf4897abb9b --> 799a7834_f34c_8596_4026_015681eee732
  090215d4_d041_d740_3c6a_2b92c717e601["getListener.js"]
  090215d4_d041_d740_3c6a_2b92c717e601 --> 799a7834_f34c_8596_4026_015681eee732
  style 799a7834_f34c_8596_4026_015681eee732 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
import type {ReactScopeInstance} from 'shared/ReactTypes';
import type {
  ReactDOMEventHandle,
  ReactDOMEventHandleListener,
} from './ReactDOMEventHandleTypes';
import type {
  Container,
  TextInstance,
  Instance,
  ActivityInstance,
  SuspenseInstance,
  Props,
  HoistableRoot,
  RootResources,
} from './ReactFiberConfigDOM';

import {
  HostComponent,
  HostHoistable,
  HostSingleton,
  HostText,
  HostRoot,
  SuspenseComponent,
  ActivityComponent,
} from 'react-reconciler/src/ReactWorkTags';

import {getParentHydrationBoundary} from './ReactFiberConfigDOM';

import {enableScopeAPI} from 'shared/ReactFeatureFlags';

import {enableInternalInstanceMap} from 'shared/ReactFeatureFlags';

const randomKey = Math.random().toString(36).slice(2);
const internalInstanceKey = '__reactFiber$' + randomKey;
const internalPropsKey = '__reactProps$' + randomKey;
const internalContainerInstanceKey = '__reactContainer$' + randomKey;
const internalEventHandlersKey = '__reactEvents$' + randomKey;
const internalEventHandlerListenersKey = '__reactListeners$' + randomKey;
const internalEventHandlesSetKey = '__reactHandles$' + randomKey;
const internalRootNodeResourcesKey = '__reactResources$' + randomKey;
const internalHoistableMarker = '__reactMarker$' + randomKey;
const internalScrollTimer = '__reactScroll$' + randomKey;

type InstanceUnion =
  | Instance
  | TextInstance
  | SuspenseInstance
  | ActivityInstance
  | ReactScopeInstance
  | Container;
// ... (340 more lines)

Domain

BabelCompiler

Subdomains

Validation

Functions

Dependencies

ReactDOMEventHandleTypes.js
ReactFeatureFlags
ReactFiberConfigDOM.js
ReactInternalTypes
ReactTypes
ReactWorkTags

Imported By

Source

View on GitHub

Frequently Asked Questions

What does ReactDOMComponentTree.js do?

ReactDOMComponentTree.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain, Validation subdomain.

What functions are defined in ReactDOMComponentTree.js?

ReactDOMComponentTree.js defines 5 function(s): detachDeletedInstance, isContainerMarkedAsRoot, markContainerAsRoot, precacheFiberNode, unmarkContainerAsRoot.

What does ReactDOMComponentTree.js depend on?

ReactDOMComponentTree.js imports 6 module(s): ReactDOMEventHandleTypes.js, ReactFeatureFlags, ReactFiberConfigDOM.js, ReactInternalTypes, ReactTypes, ReactWorkTags.

What files import ReactDOMComponentTree.js?

ReactDOMComponentTree.js is imported by 14 file(s): ChangeEventPlugin.js, DOMPluginEventSystem.js, DOMPropertyOperations.js, EnterLeaveEventPlugin.js, FormActionEventPlugin.js, ReactDOMControlledComponent.js, ReactDOMEventHandle.js, ReactDOMEventListener.js, and 6 more.

Where is ReactDOMComponentTree.js in the architecture?

ReactDOMComponentTree.js is located at packages/react-dom-bindings/src/client/ReactDOMComponentTree.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-dom-bindings/src/client).

Analyze Your Own Codebase

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

Try Supermodel Free