Debugging WG August

[huntie]

Topics

• React Native / Hermes team progress towards 0.73

  • Flipper deprecation / New launch flow (@huntie)

    • Landing changes towards this. Now integrated on main. Improvements coming.
      • Create dev-middleware package facebook/react-native#38194
      • Migrate cli-plugin-metro into repo facebook/react-native#38795
      • Integrate dev-middleware into start command facebook/react-native#39059 ⬅️ Now default flow, usage example for integrators

  • JSC Remote Debugging deprecation (@huntie)

    • We will be proceeding with a phased deprecation in 0.73 (via docs), removal in 0.74 (also bandwidth motivated).

  • New Hermes CDP handler and CDP server architecture — integration ongoing.

  • Testing the new stack for 0.73: Manual test suite, internal telemetry signals being set up. Also planning an in person tryout/bug bash at RN EU core contribs summit.

    • Internal telemetry: We're starting to collect usage data from Meta engineers to track the adoption and reliability of the new debugging solution once rolled out. See unstable_eventReporter (note: API will keep changing!) if interested in doing something similar in a framework-level integration.

  • Embedded Chrome DevTools frontend prototype (@motiz88), see screenshot

    • Based on current Chrome stable (Chromium rev 5845)
    • Only ~3MB increase in npm package size (NOTE: non-en_US locales not included, full i18n solution to tentatively follow after RN 0.73)
    • As a reminder, for 0.73 the focus is on hiding DevTools features that aren't supported in RN/Hermes (and gradually enabling them when available). Customisation is intentionally very light - this is "just" Chrome DevTools and not a redo of Flipper.
    • Currently working on cleaning up the code, setting up a repo for collaboration, automating builds etc.
    • The plan is to serve this frontend from @react-native/dev-middleware so it's available offline (and to all frameworks).
    • The branding as "React Native JS Inspector" is not final - we're considering a few different options but would primarily like to avoid confusion with React DevTools and react-native-debugger.

• FYIs

  • https://github.com/facebook/metro/releases/tag/v0.78.0 has shipped a breaking change to drop the built-in InspectorProxy creation. This should now be created/attached using the @react-native/dev-middleware package — we're working with current integrators to help with this change.
  • We're planning to make changes to the format of our /json/list endpoint.
  • [Lorenzo] we found the VSCode RN Extension people, please welcome Joaquin and Eric!

• Q&A

Notes/Actions