I'm using a third party statistics library which seems to have loads of issues. It's both large and compressed, so it's not particularly easy to debug. I'm using the Chrome DevTools and I was wondering what options there might be for ranking functions by the number of calls by their name, maybe? I thought the answer was the Profiler tab, but the profiles I captured are only documenting the JS files referencing "line 1" in long chains.
This thing is freezing my app and I'd rather avoid making changes to their code as much as possible, even if it's for the sake of debugging.
EDIT: I seem to remember a recent demo of chrome DevTools somewhere showing a timeline that depicted function blocks stacked vertically based on the time increment going horizontally called "flame charts" or something similar... That would be ideal, but I can't remember the link right now for the life of me. Not opposed to using Canary on this one at all if anyone knows what this tool is?
The latest video about DevTools is here http://youtu.be/x6qe_kVaBpg?t=19m44s
It covers different topics about DevTools and includes a section about CPU profile too.
So, you need to record a cpu profile and look into it.
Also you can use FlameChart view on it.
You can click on an item in BottomUp or TopDown or even a FlameChart bar and see the function body in the Sources panel.
If you sources are minified, as in the screenshot, then you can press a button in the status bar of Sources panel. It looks like two curly braces {}. Then DevTools will format the sources.
and that action will affect all the links to the source file in all other places like Timeline, CPUProfile etc. As example in the first snapshot you saw a function O.Pk that was at line 778 of minified version of the script. After pretty printing the source file the link to the function was changed automatically. Now it is pointing to the line 15871.