What's New in DevTools (Microsoft Edge 128)

To check out the latest features of Microsoft Edge DevTools and the Microsoft Edge DevTools extension for Microsoft Visual Studio Code and Visual Studio, read these announcements.

To stay up to date and get the latest DevTools features, download an Insiders preview version of Microsoft Edge. Whether you're on Windows, Linux, or macOS, consider using Canary (or another preview channel) as your default development browser. The Beta, Dev, and Canary versions of Microsoft Edge run as separate apps, side-by-side with the stable, released version of Microsoft Edge. See Microsoft Edge Insider Channels.

For the latest announcements, follow the Microsoft Edge team on Twitter. To report a problem with DevTools or ask for a new feature, file an issue in the MicrosoftEdge/DevTools repo.

Updated labels for CSS selector stats

In the Performance tool, the duplicate Selector Stats label has been removed from the Recalculate Style event details.

The Enable advanced rendering instrumentation (slow) checkbox has been renamed to Enable advanced paint instrumentation (slow). Selecting this checkbox now only turns on paint instrumentation, and no longer turns on CSS selector stats as well. To enable gathering CSS selector stats, in the Performance tool, select the Capture settings (the Capture settings icon) button, and then select the Enable CSS selector stats (slow) checkbox.

Before:

Old selector stats labels

After:

New selector stats labels

See also:

Fixed whitespace in Activity Bar right-click menus

In recent versions of Microsoft Edge, some context menus in the Activity Bar displayed empty whitespace in the header area at the top:

Old context menu header

The top of each context menu now shows the title again:

New context menu header

Heap snapshot improvements

In the Memory tool, there are several improvements for heap snapshots:

  • Generating heap snapshots is now faster.

  • HTML elements are grouped by tag name, such as <body>, <div>, or <img>.

  • Shallow sizes now match JavaScript semantics better, by showing fewer internal objects (unless you select the Show option to expose internals in heap snapshots experiment checkbox and then, before taking a snapshot, select the Expose internals (includes additional implementation-specific details) checkbox).

  • The Include numerical values in capture checkbox (shown before you take a heap snapshot) has been removed, and heap snapshots now always show numeric values.

See also:

View WebSocket message activities in the Performance tool

WebSocket activities have been added to the Network track in the Performance tool, to help correlate JavaScript activity with WebSocket messages. This can help identify whether latency issues are coming from the client's parsing of a message, or from the server's response.

See also:

Announcements from the Chromium project

Microsoft Edge 128 also includes the following updates from the Chromium project: