Profile cover photo
Profile photo
Xavier CAMBAR
151 followers -
Whether you know me and don't need to read that, or...
Whether you know me and don't need to read that, or...

151 followers
About
Xavier's posts

Post has attachment

Post has shared content
Chasing Leaks With The Chrome DevTools Heap Profiler Views

A friend debugging a web app today asked me what the differences between the Comparison, Dominator, Containment and Summary views in DevTools > Profiles > Heap snapshot were and I thought I’d share my replies.

Quick recap: the heap profiler gives us an overview of all the objects in memory at the time a snapshot is taken. This lets us find out what in our app using memory and is of particular use if you’re interested in improving performance.

Comparison view helps you track down memory leaks, by displaying which objects have been correctly cleaned up by the garbage collector. Generally used to record and compare two (or more) memory snapshots of before and after an operation. The idea is that inspecting the delta in freed memory and reference count lets you confirm the presence and cause of a memory leak.

Dominators view helps confirm that no unexpected references to objects are still hanging around (i.e that they are well contained) and that deletion/garbage collection is actually working.

Summary view helps you hunt down objects (and their memory use) based on type grouped by constructor name. This view is particularly helpful for tracking down DOM leaks.

Containment view provides a better view of object structure, helping us analyze objects referenced in the global namespace (i.e. window) to find out what is keeping them around. It lets you analyze closures and dive into your objects at a low level.
 
I've previously written about improving app performance using Timeline and the heap profiler http://addyosmani.com/blog/performance-optimisation-with-timeline-profiles/ but Peter Reinhardt also wrote about his experience with the heap profiler in more detail last year: http://reinpk.blogspot.co.uk/2012/03/using-heap-profiler-in-chrome-dev-tools.html

#devtools   #chrome  
Photo

Post has shared content

Post has attachment
Amsterdam
Photo

Post has shared content
Si au moins on était le 1er avril...

+Thomas Bassetto +Sylvain Zimmer What about a G+ event for +dotJS  ?
Did I miss it ?

Post has shared content

Post has attachment
#lxjs  schedule. These are gonna be 2 hard-playing hard-working days!

Can't wait to catch my plane to Lisbon!

http://2012.lxjs.org for details
Photo

Post has attachment
Megabox - Coming soon

Post has shared content
+Ariya Hidayat on Code Quality Tools. Not only did he write a very excellent and (human) readable parser, he has IMO a clear view on what's available as well as what's missing.

I dare add to the list of the missing quality tools the following:
* Profiling with call graph (see kcachegrind)
* Copy/Paste Detector (CPD) /Project Mess Detector (PMD) (yep, I've been a PHP dev in a previous life!)
* min/max/average execution time on functions/xhr
* I can't remember my last item :-/
Recommended: Slides On Advanced Code Quality Analysis

+Ariya Hidayat's talk from Fluent discusses the development of Esprima - a JavaScript parser designed from the ground-up to be readable, high performant, easily extensible and able to accommodate future ES Harmony features. A recommended talk with lots of good points.

http://www.slideshare.net/ariyahidayat/javascript-parser-infrastructure-for-code-quality-analysis
Photo
Wait while more posts are being loaded