• Save
Memmangementjs
Upcoming SlideShare
Loading in...5
×
 

Memmangementjs

on

  • 491 views

 

Statistics

Views

Total Views
491
Slideshare-icon Views on SlideShare
486
Embed Views
5

Actions

Likes
4
Downloads
0
Comments
0

1 Embed 5

https://twitter.com 5

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Memmangementjs Memmangementjs Presentation Transcript

    • JAVASCRIPTMEMORYMANAGEMENTANDRES PAGELLA - @mapagella - http://www.andrespagella.comThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENT1369.9 MB?! I only have two open tabs!1(and I’m not using flash!)Thursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTBooleanNumbersStringsObjectsExternal Objects(DOM Nodes, Image Data, etc.)SCALAR VALUESCALAR VALUESCALAR VALUEOBJECT VALUEOBJECT VALUEVALUE TYPES IN JSThursday, May 30, 13
    • 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
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODE“Retaining Paths”Thursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEFlagged for elimination in next GC collection cycleThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPHROOT NODEOBJECT NODESCALAR NODEGC.Collect()is triggeredThursday, May 30, 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
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPH19 KB7 KB5 KB19 KB (Total)7 KB+5 KB+7 KB (Itself)Thursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE GRAPH19 KB7 KB5 KB19 KB (Total)7 KB+5 KB+7 KB (Itself)=19 KBThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORYThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORY?New object needs morememory in order to beallocatedThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORY?GC Pause is triggeredThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONAVAILABLE MEMORYSeveral milliseconds later...Thursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTMEMORY VALUE ALLOCATIONGarbage CollectionThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENT“Meh, I don’t care. I’vegot 16 GB of RAM”Thursday, May 30, 13
    • 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
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSROOT NODEOBJECT NODESCALAR NODEThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTROOT NODEOBJECT NODESCALAR NODE LeakHidden referenceto object still existsDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • 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
    • 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
    • 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
    • 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
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKS(Remember toRestart the browser)Thursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • JAVASCRIPT MEMORY MANAGEMENTDETECTING AND ELIMINATING LEAKSThursday, May 30, 13
    • THANK YOU!ANDRES PAGELLA@mapagellahttp://www.andrespagella.comThursday, May 30, 13