Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scheduling Profiler: De-emphasize React internal frames #22588

Merged

Commits on Oct 19, 2021

  1. Scheduling Profiler: De-emphasize React internal frames

    This commit adds code to all React bundles to explicitly register the beginning and ending of their own code. This is done by creating Error objects (which capture a file name, line number, and column number) and registering them to a DevTools hook if present.
    
    Next, as the Scheduling Profiler logs metadata to the User Timing API, it prints these module ranges along with other metadata (like Lane values and profiler version number).
    
    Lastly, the Scheduling Profiler UI compares stack frames to these ranges when drawing the flame graph and dims or de-emphasizes frames that fall within an internal module.
    
    The net effect of this is that user code (and 3rd party code) stands out clearly in the flame graph while React internal modules are dimmed.
    
    Internal module ranges are completely optional. Older profiling samples, or ones recorded without the React DevTools extension installed, will simply not dim the internal frames.
    Brian Vaughn committed Oct 19, 2021
    Configuration menu
    Copy the full SHA
    6764526 View commit details
    Browse the repository at this point in the history

Commits on Oct 20, 2021

  1. Added new Rollup bundle config option: wrapWithModuleBoundaries

    This flag identifies certain modules (e.g. react, react-dom, scheduler) that should self-report their module boundaries to React DevTools for Scheduling Profiler purposes. Note that this flag only applies to DEV and PROFILE bundle types (not PRODUCTION). Also note that this change does not affect modules with wrapWithModuleBoundaries:false (e.g. server renderering, test renderer, jsx transform).
    Brian Vaughn committed Oct 20, 2021
    Configuration menu
    Copy the full SHA
    a6f6461 View commit details
    Browse the repository at this point in the history
  2. Configuration menu
    Copy the full SHA
    c3439e9 View commit details
    Browse the repository at this point in the history