dimanche 24 septembre 2017

understanding memory leaks in javascript: use or not use global objects (proxy objects to keep track of changes)

I am trying to improve performance of an app with the profile tab of chrome console.

The app renders a webgl graphics, with many objects in it. User interacts with the webgl objects; there are several promises associated to them, which will feed content as properties for a proxy object - [http://ift.tt/2hqphFS] - which I used to keep track of changes.

Also, some proxyPage properties are called by the render engine.

I thought that passing proxyPage's properties directly to the render engine would speed the work, but maybe I am really wrong, because references may be kept somewhere also when not needed anymore.

Suppose proxyPage is my proxy object and is a global object, and I have functions for rendering like:

function doSmtg( objectProperty) // do something

Are the following patterns equivalent, concerning possible memory leaks?

doSmtg( proxyPage.property ) // I pass directly my proxyPage properties all around my app

and

var tmp = proxyPage.property;

doSmtg( tmp ); // I try to make use of temporary local variables referencing to my global object, and then destroy them.

tmp = null;

I also attach a screenshot if it can help understand what I am doing: spikes reflects timeline memory allocations, which seems mostly referred to my proxyPage object.

Reference to window.proxyPage is there for helping me debugging.

enter image description here

Comments helping me to understand design practices are also helpful, thanks!

Aucun commentaire:

Enregistrer un commentaire