What's New In DevTools (Chrome 58)

Welcome to the first installment of the DevTools release notes! From here on
out, the first time you open a new version of Chrome, DevTools opens the
What's New drawer with a link to the release notes for that version.

New features

Editable cookies

Inspectable and editable CSS variables in the Styles pane

You can now inspect and edit CSS variables in the Styles pane. See CSS
Variables Demo to try it out yourself.

Out-of-memory breakpoints

When an app allocates a lot of memory in a short amount of time, DevTools now
automatically pauses and increases the heap limit. This enables you to inspect
the heap, execute commands on the Console to free up memory, and continue
debugging the issue. See One Small Step For Chrome, One Giant Heap For
V8 for more information.

Changes

The Timeline panel is now the Performance panel

The Timeline panel has been renamed to the Performance panel, to better
reflect its purpose.

The Profiles panel is now the Memory panel

The Profiles panel has been renamed to the Memory panel, to better
reflect its purpose.

The CPU Profiler is behind a hidden panel

Now that the Profiles panel is called the Memory panel, it doesn't really
make sense to have the CPU profiler on that panel anymore. Furthermore,
the long-term goal is to get all users profiling from the Performance panel.
In the meantime, you can still access the old CPU profiler from
Settings > More Tools > JavaScript Profiler.