react Architecture Docs
Home / File/ NetworkMeasuresView.js — react Source File

NetworkMeasuresView.js — react Source File

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

File javascript BabelCompiler 12 imports

Entity Profile

Dependency Diagram

graph LR
  13604060_cb94_5e01_9368_0ead23d3891e["NetworkMeasuresView.js"]
  20cc2065_4b5b_fd6b_be12_28f36b0ff4cf["types.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 20cc2065_4b5b_fd6b_be12_28f36b0ff4cf
  bbc225e1_d450_ae58_6679_9240ebe54628["index.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> bbc225e1_d450_ae58_6679_9240ebe54628
  e39a99ae_faf3_afd9_4fc8_fa9a6210f1d3["positioning.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> e39a99ae_faf3_afd9_4fc8_fa9a6210f1d3
  6743acc7_a552_31bd_d8df_67b4ec27ba6d["durationToWidth"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 6743acc7_a552_31bd_d8df_67b4ec27ba6d
  6fe722ba_3051_6ecf_abe3_62a190c3ad25["positioningScaleFactor"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 6fe722ba_3051_6ecf_abe3_62a190c3ad25
  a1e0fb75_d73e_2a52_2e38_23e1f70979f8["positionToTimestamp"]
  13604060_cb94_5e01_9368_0ead23d3891e --> a1e0fb75_d73e_2a52_2e38_23e1f70979f8
  83465e3e_5308_9ddc_a12b_a84d78f1c10a["timestampToPosition"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 83465e3e_5308_9ddc_a12b_a84d78f1c10a
  021281ec_8833_1644_b4c0_b06b07634697["text.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 021281ec_8833_1644_b4c0_b06b07634697
  1d4e7b93_85d0_def6_42c9_e20824e49731["drawText"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 1d4e7b93_85d0_def6_42c9_e20824e49731
  f4cf9100_74bc_5445_ffb5_84c37b555dd3["formatting.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> f4cf9100_74bc_5445_ffb5_84c37b555dd3
  7a7bab2a_0762_eb64_07af_7551fee380d1["formatDuration"]
  13604060_cb94_5e01_9368_0ead23d3891e --> 7a7bab2a_0762_eb64_07af_7551fee380d1
  eab2f8f4_2e4c_8e75_87d9_c7d9b524affb["constants.js"]
  13604060_cb94_5e01_9368_0ead23d3891e --> eab2f8f4_2e4c_8e75_87d9_c7d9b524affb
  style 13604060_cb94_5e01_9368_0ead23d3891e 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 {NetworkMeasure, TimelineData} from '../types';
import type {
  Interaction,
  IntrinsicSize,
  MouseMoveInteraction,
  Rect,
  ViewRefs,
} from '../view-base';

import {
  durationToWidth,
  positioningScaleFactor,
  positionToTimestamp,
  timestampToPosition,
} from './utils/positioning';
import {drawText} from './utils/text';
import {formatDuration} from '../utils/formatting';
import {
  View,
  Surface,
  rectContainsPoint,
  rectIntersectsRect,
  intersectionOfRects,
} from '../view-base';
import {BORDER_SIZE, COLORS, SUSPENSE_EVENT_HEIGHT} from './constants';

const HEIGHT = SUSPENSE_EVENT_HEIGHT; // TODO Constant name
const ROW_WITH_BORDER_HEIGHT = HEIGHT + BORDER_SIZE;

const BASE_URL_REGEX = /([^:]+:\/\/[^\/]+)/;

export class NetworkMeasuresView extends View {
  _depthToNetworkMeasure: Map<number, NetworkMeasure[]>;
  _hoveredNetworkMeasure: NetworkMeasure | null = null;
  _intrinsicSize: IntrinsicSize;
  _maxDepth: number = 0;
  _profilerData: TimelineData;

  onHover: ((event: NetworkMeasure | null) => void) | null = null;

  constructor(surface: Surface, frame: Rect, profilerData: TimelineData) {
    super(surface, frame);

    this._profilerData = profilerData;

    this._performPreflightComputations();
  }

  _performPreflightComputations() {
    this._depthToNetworkMeasure = new Map();

// ... (278 more lines)

Domain

Dependencies

Source

Frequently Asked Questions

What does NetworkMeasuresView.js do?
NetworkMeasuresView.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain.
What does NetworkMeasuresView.js depend on?
NetworkMeasuresView.js imports 12 module(s): constants.js, drawText, durationToWidth, formatDuration, formatting.js, index.js, positionToTimestamp, positioning.js, and 4 more.
Where is NetworkMeasuresView.js in the architecture?
NetworkMeasuresView.js is located at packages/react-devtools-timeline/src/content-views/NetworkMeasuresView.js (domain: BabelCompiler, directory: packages/react-devtools-timeline/src/content-views).

Analyze Your Own Codebase

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

Try Supermodel Free