Your SlideShare is downloading. ×
0
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Memmangementjs
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Memmangementjs

383

Published on

Published in: Technology, Business
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
383
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
4
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. JAVASCRIPTMEMORYMANAGEMENTANDRES PAGELLA - @mapagella - http://www.andrespagella.comThursday, May 30, 13
  • 2. JAVASCRIPT MEMORY MANAGEMENT1369.9 MB?! I only have two open tabs!1(and I’m not using flash!)Thursday, May 30, 13
  • 3. JAVASCRIPT MEMORY MANAGEMENTBooleanNumbersStringsObjectsExternal Objects(DOM Nodes, Image Data, etc.)SCALAR VALUESCALAR VALUESCALAR VALUEOBJECT VALUEOBJECT VALUEVALUE TYPES IN JSThursday, May 30, 13
  • 4. JAVASCRIPT MEMORY MANAGEMENT<body><div class=”one”><p>One</p><p>Two</p><p>Three</p></div><div class=”two”><p>One</p><p>Two</p><p>Three</p></div></body>DOCUMENT OBJECT MODEL TREEThursday, May 30, 13
  • 5. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 6. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODE“Retaining Paths”Thursday, May 30, 13
  • 7. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 8. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 9. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 10. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 11. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEFlagged for elimination in next GC collection cycleThursday, May 30, 13
  • 12. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEGC.Collect()is triggeredThursday, May 30, 13
  • 13. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODE2 KB4 KB7 KB22 KB11 KB7 KB19 KB7 KB5 KB54 KB (Total)“Retained Size”Thursday, May 30, 13
  • 14. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPH19 KB7 KB5 KB19 KB (Total)7 KB+5 KB+7 KB (Itself)Thursday, May 30, 13
  • 15. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPH19 KB7 KB5 KB19 KB (Total)7 KB+5 KB+7 KB (Itself)=19 KBThursday, May 30, 13
  • 16. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORYThursday, May 30, 13
  • 17. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORY?New object needs morememory in order to beallocatedThursday, May 30, 13
  • 18. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORY?GC Pause is triggeredThursday, May 30, 13
  • 19. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORYSeveral milliseconds later...Thursday, May 30, 13
  • 20. JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONGarbage CollectionThursday, May 30, 13
  • 21. JAVASCRIPT MEMORY MANAGEMENT“Meh, I don’t care. I’vegot 16 GB of RAM”Thursday, May 30, 13
  • 22. JAVASCRIPT MEMORY MANAGEMENTWell, you should... The GCwill need to go through 16GM of memory checkingfor collectable objects...(Good luck with that)Thursday, May 30, 13
  • 23. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
  • 24. JAVASCRIPT MEMORY MANAGEMENTROOT NODEOBJECT NODESCALAR NODE LeakHidden referenceto object still existsDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 25. JAVASCRIPT MEMORY MANAGEMENTSPOT THE LEAKvar row = null, page = 0;$(#getRow).bind(click, callService);function callService() { var params = { pageNum: (page + 1) }; page++; $.get(services/rest/getRow, params, function(data) { row += data; $(#grid).html(row); });}Thursday, May 30, 13
  • 26. JAVASCRIPT MEMORY MANAGEMENTSPOT THE LEAKvar row = null, page = 0;$(#getRow).bind(click, callService);function callService() { var params = { pageNum: (page + 1) }; page++; $.get(services/rest/getRow, params, function(data) { row += data; $(#grid).html(row); });}Thursday, May 30, 13
  • 27. JAVASCRIPT MEMORY MANAGEMENTSPOT THE LEAKvar page = 0,rows = [];$(#getRow).bind(click, callService);function callService() { var params = { pageNum: (page + 1) }; page++; $.get(services/rest/getRow, params, function(data) { rows.push(data); });}Thursday, May 30, 13
  • 28. JAVASCRIPT MEMORY MANAGEMENTSPOT THE LEAKvar page = 0,rows = [];$(#getRow).bind(click, callService);function callService() { var params = { pageNum: (page + 1) }; page++; $.get(services/rest/getRow, params, function(data) { rows.push(data); });}Arrays are unbound objects!Thursday, May 30, 13
  • 29. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 30. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 31. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 32. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKS(Remember toRestart the browser)Thursday, May 30, 13
  • 33. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 34. JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
  • 35. THANK YOU!ANDRES PAGELLA@mapagellahttp://www.andrespagella.comThursday, May 30, 13

×