Does anyone here have recommended resources for learning how to use the performance tools in various browsers? Does anyone have links to (official or unofficial) documentation of those? They seem a bit under-documented to me, but maybe I’m just not looking in the right place.
Or any specific concrete examples (e.g. screencasts, detailed blog posts) showing someone’s profiling / performance optimization process?
The tools are a bit daunting and I don’t know them very well. Most of the expository material I can find online is more focused on page load speed, DOM performance, etc., rather than Javascript performance per se.
Chrome’s developer tools link to https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/ but that seems to just scratch the surface.
I find it difficult to figure out when making/running benchmarks or looking at the developer tools exactly what level of JIT managed to compile my JS function, what it got compiled into, whether small functions were successfully inlined or not, how many branch mispredictions or CPU cache misses the inner loops were causing, etc.
Sometimes I make a change which seems like it should be obviously faster (e.g. just deleting some code and not changing anything else, or replacing a trig function with a couple of multiplications) and I find that the speed doesn’t change at all, or even regresses, and I’m not sure where I should turn to figure out what’s going on.