mayyangtaiwan / simile-widgets

Automatically exported from code.google.com/p/simile-widgets
0 stars 0 forks source link

TIMELINE. Simile Timeline #232

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
Simile Timeline leaks memory in IE 6 (potentially other browsers too). To
demonstrate this, use the indispensable tool
[sIEve|http://home.wanadoo.nl/jsrosman/] and navigate to the timeline home
page, looking at the JFK example. Click "about:blank" in sIEve. Observe
that the #leaks column in sIEve is no longer zero. For me it yields 29
leaked DOM elements. If in the app if you open and close an event pop-up
then navigate away, you'll see that number climb to 33 (proof of more leaks).

IE 6.0.2900 

[Submitted by David Smiley on simile.mit.edu] 

I've already troubleshooted and fixed these memory leaks. I was able to
solve them by using a robust browser event abstraction / utility library --
Yahoo UI toolkit. By modifying Timeline in exactly 2 places, the bugs went
away.
In dom.js, here's my registerEvent implementation:
{code}
SimileAjax.DOM.registerEvent = function(elmt, eventName, handler) {
   //YAHOO doesn't have memory leaks like Timeline's code does.
   YAHOO.util.Event.addListener(elmt,eventName,function(evt) {
      handler(elmt,evt,YAHOO.util.Event.getTarget(evt))
   });
};
{code}

And in xmlhttp.js, here's my implementation of get & post:
{code}
SimileAjax.XmlHttp.get = function(url, fError, fDone) {
   var req = YAHOO.util.Connect.asyncRequest('GET',url,{ success: function(o) {
      fDone(req.conn);
   },
   failure: function(o) {
      fError(o.statusText,o.status,req.conn);
   }
   });
};
SimileAjax.XmlHttp.post = function(url, body, fError, fDone) {
   var req = YAHOO.util.Connect.asyncRequest('POST',url,{ success:
function(o) {
      fDone(req.conn);
   },
   failure: function(o) {
      fError(o.statusText,o.status,req.conn);
   }
   },body);
};
{code}

I also observed a memory leak of code that was never invoked in my usage of
Timeline but would leak if someone ever called it. It's
createStructuredDataCopyButton in graphics.js. The assignment of a closure
to onmousedown is a no-no.

To include YAHOO, all I had to do was reference these two libraries:
http://yui.yahooapis.com/2.4.0/build/yahoo-dom-event/yahoo-dom-event.js
and
http://yui.yahooapis.com/2.4.0/build/connection/connection-min.js

Developers of Simile: Please consider throwing out some of the code in your
/ajax directory in exchange for YUI's dom, event, and connection libraries.
They are well tested open-source components that are not leaking memory
(unlike your code) and spare you from redundant effort. And you can refer
to those libraries directly from YAHOO which might also be cached by the
browser (YUI is popular) and so there is less code for the browser to download.

http://developer.yahoo.com/yui/event/

(FYI I work with Mike Nosal at MITRE)

David Smiley - 17/Dec/07 03:31 PM
Sorry for some of the messed up markup... I thought your JIRA was enabled
for confluence markup.
{code}test{code}
[ Show » ]
David Smiley - 17/Dec/07 03:31 PM Sorry for some of the messed up markup...
I thought your JIRA was enabled for confluence markup. {code}test{code}

[ Permlink | « Hide ]
David F. Huynh - 31/Dec/07 03:39 PM
Thank you for the fix!

And you're absolutely right that we Simile developers should adopt those
external libraries. We have started to invest in JQuery, but we haven't
changed much of our code to use it. I'm a little concerned about the API
download size if we keep including more libraries.

To say "we" is actually misleading, as there is only me who works on the
Timeline code base. And I have since gotten involved in many other
projects, more than I can handle. So I'm looking for open source developers
who can take good care of the Timeline code base. Would that be something
you're interested in, since you (MITRE) are already using Timeline heavily?
[ Show » ]
David F. Huynh - 31/Dec/07 03:39 PM Thank you for the fix! And you're
absolutely right that we Simile developers should adopt those external
libraries. We have started to invest in JQuery, but we haven't changed much
of our code to use it. I'm a little concerned about the API download size
if we keep including more libraries. To say "we" is actually misleading, as
there is only me who works on the Timeline code base. And I have since
gotten involved in many other projects, more than I can handle. So I'm
looking for open source developers who can take good care of the Timeline
code base. Would that be something you're interested in, since you (MITRE)
are already using Timeline heavily?

[ Permlink | « Hide ]
David Smiley - 31/Dec/07 03:53 PM
My ability/desire to take care of Timeline is contingent on my project at
work getting more funding and wanting improvements. That is a distinct
possibility but I don't know if it's going that way right now.

I know Mike Nosal has improvements he has made to Timeline and I'm not sure
what his status is on releasing those modifications to the project -- but
he certainly intends to if he has not by now.

Improvements I'd see myself making would be to attempt to make the Timeline
bands more lightweight internally for memory & performance reasons. We use
multiple timelines on one page with perhaps 20 bands each. It really brings
down IE 6.

I'm not sure if JQuery overlaps capabilities of the 2 YUI core libs I
referenced or not. But I know YUI, and I know it doesn't leak memory, and I
know YUI hosts their js libraries and the browser tends to cache them, and
it' s only a couple small js files, so I'm not particularly concerned about
bloat in this case.

~ David
[ Show » ]
David Smiley - 31/Dec/07 03:53 PM My ability/desire to take care of
Timeline is contingent on my project at work getting more funding and
wanting improvements. That is a distinct possibility but I don't know if
it's going that way right now. I know Mike Nosal has improvements he has
made to Timeline and I'm not sure what his status is on releasing those
modifications to the project -- but he certainly intends to if he has not
by now. Improvements I'd see myself making would be to attempt to make the
Timeline bands more lightweight internally for memory & performance
reasons. We use multiple timelines on one page with perhaps 20 bands each.
It really brings down IE 6. I'm not sure if JQuery overlaps capabilities of
the 2 YUI core libs I referenced or not. But I know YUI, and I know it
doesn't leak memory, and I know YUI hosts their js libraries and the
browser tends to cache them, and it' s only a couple small js files, so I'm
not particularly concerned about bloat in this case. ~ David

Original issue reported on code.google.com by GabrielR...@googlemail.com on 8 Apr 2009 at 2:47

GoogleCodeExporter commented 8 years ago
What about jquery ?

Original comment by litobyte...@gmail.com on 28 Jun 2009 at 5:03

GoogleCodeExporter commented 8 years ago
I've tried the fix using the YAHOO javascript, but it doesn't seem to resolve 
the
issue.  Is anyone able to verify using sIEve that it clears the memory leaks?  
It's
possible I'm not implementing in correctly.  I couldn't find the dom.js and
xmlhttp.js files in the bundled version or the functions referenced anywhere.  I
downloaded the 'full' version and edited them in there, but it doesn't seem to 
be
making a difference.  Any help appreciated

Original comment by joann...@gmail.com on 22 Jul 2009 at 2:29

GoogleCodeExporter commented 8 years ago
To follow up to my previous comment, I've noticed renaming dom.js and xmlhttp.js
doesn't have any negative side affects and the timeline still works.  Looks 
like it's
not calling them.

Original comment by joann...@gmail.com on 22 Jul 2009 at 2:33

GoogleCodeExporter commented 8 years ago
Yes, memory leakage is also a problem for me. Anyone can solve this?

Original comment by airmax...@gmail.com on 22 Jul 2009 at 8:12

GoogleCodeExporter commented 8 years ago
Good project, bad implementation

Original comment by airmax...@gmail.com on 22 Jul 2009 at 8:33

GoogleCodeExporter commented 8 years ago
Hey everyone,
Simile has memory leaks and it happens when you refresh the page or just 
loading the 
page with setTimeOut (js function) many times.
The "dispose" function included in the package doesn't do its job so well.
After many tests I have made I can tell that using YAHOO events manager is 
necessary.
But not enough! - One important thing - you must use the 
YAHOO.util.Event.removeListener also, which was not mentioned in this post.
I have changed the TimeLine.dispose and added few lines that remove the 
listeners and 
free the memory that was allocated to bands, events, bubbles etc.
I recommend you all to dispose the events allocated by Simile TimeLine in case 
you 
suffer from memory leaks.
I use TimeLine dynamicly, bands and events being moved according to timers 
every 
second - so it matters alot.

Idan.

Original comment by idan.ha...@gmail.com on 8 Dec 2009 at 3:30

GoogleCodeExporter commented 8 years ago
Idan can you provide your fix for the memory leakage problem?

Kind regards,
Pedro

Original comment by pbmo...@gmail.com on 22 Dec 2009 at 3:06

GoogleCodeExporter commented 8 years ago
Does anybody else know more about where to add the 
YAHOO.util.Event.removeListener portion of the code to Timeline?

Original comment by Kla...@gmail.com on 15 Jan 2011 at 4:21

GoogleCodeExporter commented 8 years ago
Same request... Does anybody else know more about where to add the 
YAHOO.util.Event.removeListener portion of the code to Timeline?  Or otherwise 
know how to with IE ensure all listeners are disposed of?

Timeline v2.3

Original comment by codebene...@gmail.com on 11 Oct 2011 at 8:10