J-R Choiniere
J-R Choiniere

Reputation: 694

How can I debug anonymous JavaScript functions in Chrome's performance analyzer?

I'm working with Angular 4 and I'm using a lot of anonymous arrow functions (() => {}). Is it possible to determine which of these functions I'm debugging in Chrome's performance analyzer without giving them names?

Here's an example of what I'm looking at;

Screenshot

Upvotes: 6

Views: 3111

Answers (1)

Kayce Basques
Kayce Basques

Reputation: 25897

Click on the function in the Main chart to select it. DevTools highlights it blue. In the Summary tab you can see more info about that function.

Summary tab

Click the link next to Function in order to view that function's source code in the Sources panel.

Sources panel

I think the Performance panel automatically formats minified files, but if not, you can manually unminfiy by clicking Format.

Upvotes: 3

Related Questions