Home / File/ types.js — react Source File

types.js — react Source File

Architecture documentation for types.js, a javascript file in the react codebase. 2 imports, 12 dependents.

File javascript BabelCompiler 2 imports 12 dependents

Entity Profile

Dependency Diagram

graph LR
  98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf["types.js"]
  aec7978f_0a19_ba93_de9e_ac8cf5ddc74b["types"]
  98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf --> aec7978f_0a19_ba93_de9e_ac8cf5ddc74b
  68abd97e_17ac_d8a8_2d83_de72fc71c4a8["types"]
  98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf --> 68abd97e_17ac_d8a8_2d83_de72fc71c4a8
  85373914_42ee_ed07_c5b1_5dac4e356a82["ProfilerStore.js"]
  85373914_42ee_ed07_c5b1_5dac4e356a82 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  54e7a598_e83a_4b14_3104_1fa62a034c31["CommitFlamegraph.js"]
  54e7a598_e83a_4b14_3104_1fa62a034c31 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0["CommitRanked.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  9d7f3d0b_1959_a3f3_e24e_821787aa2f54["FlamegraphChartBuilder.js"]
  9d7f3d0b_1959_a3f3_e24e_821787aa2f54 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  42ca8057_28d2_de34_4629_6b91b57e8269["HookChangeSummary.js"]
  42ca8057_28d2_de34_4629_6b91b57e8269 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  6c4f87a5_052e_5ad2_3388_1e4392b92a53["ProfilerContext.js"]
  6c4f87a5_052e_5ad2_3388_1e4392b92a53 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1["ProfilingImportExportButtons.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  2c3a67b8_4c71_e64d_dc53_5096af434452["RankedChartBuilder.js"]
  2c3a67b8_4c71_e64d_dc53_5096af434452 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  76384bd4_08c7_de17_1f91_2937028def49["SnapshotCommitList.js"]
  76384bd4_08c7_de17_1f91_2937028def49 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  d6e62301_2363_364e_b031_c314353bac29["Updaters.js"]
  d6e62301_2363_364e_b031_c314353bac29 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  1d558132_0276_7e48_1a18_611bb9fef088["useCommitFilteringAndNavigation.js"]
  1d558132_0276_7e48_1a18_611bb9fef088 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  0f941e70_3fdb_aa42_7939_2878d5d4125b["utils.js"]
  0f941e70_3fdb_aa42_7939_2878d5d4125b --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  style 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf 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 {
  ElementType,
  SerializedElement,
} from 'react-devtools-shared/src/frontend/types';
import type {
  TimelineData,
  TimelineDataExport,
} from 'react-devtools-timeline/src/types';

export type CommitTreeNode = {
  id: number,
  children: Array<number>,
  displayName: string | null,
  hocDisplayNames: Array<string> | null,
  key: number | string | null,
  parentID: number,
  treeBaseDuration: number,
  type: ElementType,
  // If component is compiled with Forget, the backend will send its name as Forget(...)
  // Later, on the frontend side, we will strip HOC names and Forget prefix.
  compiledWithForget: boolean,
};

export type CommitTree = {
  nodes: Map<number, CommitTreeNode>,
  rootID: number,
};

export type SnapshotNode = {
  id: number,
  children: Array<number>,
  displayName: string | null,
  hocDisplayNames: Array<string> | null,
  key: number | string | null,
  type: ElementType,
  // If component is compiled with Forget, the backend will send its name as Forget(...)
  // Later, on the frontend side, we will strip HOC names and Forget prefix.
  compiledWithForget: boolean,
};

export type ChangeDescription = {
  context: Array<string> | boolean | null,
  didHooksChange: boolean,
  isFirstMount: boolean,
  props: Array<string> | null,
  state: Array<string> | null,
  hooks?: Array<number> | null,
};

export type CommitDataFrontend = {
  // Map of Fiber (ID) to a description of what changed in this commit.
// ... (105 more lines)

Domain

Dependencies

  • types
  • types

Frequently Asked Questions

What does types.js do?
types.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain.
What does types.js depend on?
types.js imports 2 module(s): types, types.
What files import types.js?
types.js is imported by 12 file(s): CommitFlamegraph.js, CommitRanked.js, FlamegraphChartBuilder.js, HookChangeSummary.js, ProfilerContext.js, ProfilerStore.js, ProfilingImportExportButtons.js, RankedChartBuilder.js, and 4 more.
Where is types.js in the architecture?
types.js is located at packages/react-devtools-shared/src/devtools/views/Profiler/types.js (domain: BabelCompiler, directory: packages/react-devtools-shared/src/devtools/views/Profiler).

Analyze Your Own Codebase

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

Try Supermodel Free