Internet Explorer 7 / Backbone中可能存在内存泄漏？

Question

I've been playing around with Backbone to see if this framework is a good choice to build on from now on and forward in our application. One requirement is that we must support Internet Explorer 7+ and another is to show at least 200 items per page.

To test the framework I've built a pretty simple list and it works flawlessy in all major browsers except Internet Explorer 7. It seems like there are some memory leaks since each time I reset the data the total rendering time are increased.

I've setup some test scenarios:

With events declared: http://jsfiddle.net/mefraimsson/a2YMF/

Without events declared: http://jsfiddle.net/mefraimsson/u6byQ/

One idea I had was that the events declared never was cleaned up when elements was removed and added to the DOM. When I run the test scenario "without events declared" clicking Reload data frequently the rendering time are pretty stable, but running "With events declared" the rendering time are increased rapidly and the amount of memory used for IE7 is increased. That's why I think that there is some memory leak somewhere.

• Are there anyone who have experience with rendering of such large amount of data with Backbone?
• Are there anyone who have experienced memory leak problems working with Backbone?
• Do you recommend another approach when working with such large amount of data with Backbone? Instead of a large amount of sub-views use one view and iterate over data in template could be a possible solution, but then it feels like you don't get the most out of Backbone?
• What is your opinion, do you think it is related to the declaration of events or is it the implemenation of Backbone that's leaking memory?

Thanks in advance

Answer 1

Memory leaks are a common problem in Javascript apps in general. I think there are some frameworks which try to handle this for you, but backbone doesn't. The browser you're using does make some difference in how those leaks are noticed and the problems they cause, but they still exist in other browsers, too. It's generally not the browser that's at fault, but the way event binding is handled in Javascript through the use of callback functions.

I wrote an article discussing this with a suggestion for a way to handle it, specifically with views: http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

Be sure to read the comments, too. There are some other great suggestions for handling memory leaks in there.