Garbage Collection & Heap Management in JavaScript

Given at the 2012 Scotland JS conference

Transcript

1. Garbage Collection & Heap Management in JavaScript By Ryan Sandor Richards Wednesday, June 27, 2012
2. About me • Ryan Sandor Richards • Engineer at Fastly http://www.fastly.com • Twitter: @rsandor Wednesday, June 27, 2012
3. Overview • What is the Heap? • What is Garbage Collection? • How can we use this information? Wednesday, June 27, 2012
4. What is the Heap? • Process memory is split into two segments • Stack - Local variables, return address, etc. • Heap - Used for dynamic memory allocation Wednesday, June 27, 2012
5. Memory Lifecycle • Allocate - Memory of a specific size is allocated in the heap segment • Use - data is read/written to memory • Free - memory is reclaimed from the heap Wednesday, June 27, 2012
6. Memory Lifecycle Wednesday, June 27, 2012
7. Memory Lifecycle • Important for systems languages like C • Not often exposed by interpreted languages like JavaScript • The JavaScript engine is doing this for you Wednesday, June 27, 2012
8. Allocation in JavaScript • The “new” keyword • Implicit object creation: {}, [], “” • Factories • Damn near anything Wednesday, June 27, 2012
9. Allocation in JavaScript Wednesday, June 27, 2012
10. Lots o’ Heap Wednesday, June 27, 2012
11. Lots o’ Garbage Wednesday, June 27, 2012
12. Garbage Collection • Automate heap memory reclamation • Distance the programmer from memory management • Used by most interpreted languages • Invented by John McCarthy in 1959 for LISP Wednesday, June 27, 2012
13. GC is not magic Wednesday, June 27, 2012
14. Types of Garbage • Semantic - memory is no longer used • Syntactic - memory no longer reachable • Syntactic ⊂ Semantic Wednesday, June 27, 2012
15. Semantic GC • Memory no longer used by the program would be freed • Completely eliminates the programmer • Undecidable Wednesday, June 27, 2012
16. Syntactic GC • Memory that is no longer “reachable” from the global scope is freed • Decidable (thankfully) • Many methods, approaches, etc. • Does not fully eliminate the programmer Wednesday, June 27, 2012
17. GC Overview • For each object in the heap determine whether or not the object is reachable from the root set (global scope). • Free memory for each object that cannot be reached • “reachable” can be decided in many ways Wednesday, June 27, 2012
18. Reference Counting • Engine keeps a count of references to each object in the heap • When the reference count reaches 0 the object is freed • Objective-C uses a similar scheme for more structured memory management Wednesday, June 27, 2012
19. Reference Counting Wednesday, June 27, 2012
20. Reference Counting • Simple to implement • Does a fine job in most cases • Used by older engines: IE 6, 7, (maybe 8) • Has some issues... Wednesday, June 27, 2012
21. Circular References Wednesday, June 27, 2012
22. Circular References Wednesday, June 27, 2012
23. Circular References DOM element Closure Scope Wednesday, June 27, 2012
24. Circular References zomg! Wednesday, June 27, 2012
25. Mark & Sweep • Engine inspects the entire heap • Perform a tree-traversal of the root set marking objects that are “in use” or “reachable” • Then sweep the heap removing any objects not marked as “in use” Wednesday, June 27, 2012
26. Mark & Sweep • Overcomes circular reference problems • Slow but can be made fast • Has many sophisticated methods and modifications • All modern JS engines use Mark & Sweep Wednesday, June 27, 2012
27. Mark & Sweep Wednesday, June 27, 2012
28. GC Notes • You usually don’t have to worry about it • Circular References are no longer a problem • Can’t force GC from JavaScript • Why are we talking about this? Wednesday, June 27, 2012
29. MEMORY BLOAT Wednesday, June 27, 2012
30. Motivations • Pages can be active for a long time • Bloat leads slowdowns & crashes • Keep heap as small as possible: • Nulling references • Use delete correctly Wednesday, June 27, 2012
31. Nulling References Wednesday, June 27, 2012
32. Wednesday, June 27, 2012
33. Using Delete • Used to remove properties from objects • Behavior depends on execution context and method of assignment • Can’t delete built-ins, arguments, etc. See: http://perfectionkills.com/understanding-delete/ Wednesday, June 27, 2012
34. DOM Elements • Unused DOM nodes cause hella bloat • Remove & dereference when they are no longer needed • Most major frameworks have helper functions [e.g. jQuery.remove()] Wednesday, June 27, 2012
35. Events • Impractical eventing can cause serious bloat • Delegation solves most of this • Custom eventing - be careful! Wednesday, June 27, 2012
36. Finding & Fixing Bloat • Google Chrome has some amazing tools • There are various 3rd party applications to help with older browsers • Bloat prevention can be impractical for large projects Chrome Walkthrough: http://gent.ilcore.com/2011/08/finding-memory-leaks.html Wednesday, June 27, 2012
37. Questions? • Make sure to: • Visit: http://www.fastly.com • Follow: @rsandor • Null out your unused references :P Wednesday, June 27, 2012