Click here to Skip to main content
12,755,095 members (39,206 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as

Stats

3.8K views
Posted 12 Apr 2014

Chrome Developer Tools Profiling Flame Charts

, 12 Apr 2014 CPOL
Rate this:
Please Sign up or sign in to vote.
Chrome developer tools profiling Flame charts

I just recently, and totally coincidentally, found out that Chrome developer tools can generate flame charts while profiling js code!

Recently, it seems like generating flame charts from profiling data has become popular in languages like Ruby, Python and PHP, so I'm excited to see that Chrome has this option for js code as well.

The default view for profiling data in the dev tools is the 'tree view', but you can easily change it to 'flame chart' by selecting it on the dropdown in the bottom part of the window.

Like here:

Then, you will be able to see the profiling results, in a way that sometimes is easier to look at.

You can use the mouse scroll button to zoom in on a specific area of the flame chart, and see what's going on there.

In case you're not familiar with reading flame charts, then here's a simple explanation:

  • Each colored line is a method call
  • The method calls above one another represent the call stack
  • The width of the lines represents how long each call was

And here, you can see an example of a flame chart, and I marked a few sections that the flame chart points out for us, that are non-optimized TryCatchBlocks. In this case, it's comfortable viewing it in a flame chart because you can see nicely how many method calls each try/catch block is surrounding.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Gilly Barr
Web Developer
Israel Israel
Started programming e-commerce sites with PHP & MySQL at the age of 14. Worked for me well for about 5 years.

Transfered to C# & asp.net, while serving in the IDF.
Worked on the 'Core Performance' Team at ShopYourWay.com (Sears Israel)
Currently working at Logz.io

Check out my blog!
or my twitter

You may also be interested in...

Pro
Pro

Comments and Discussions

 
-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.170217.1 | Last Updated 13 Apr 2014
Article Copyright 2014 by Gilly Barr
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid