开发者

Finding Javascript leak in Chrome

开发者 https://www.devze.com 2023-01-20 11:17 出处:网络
I do a lot of ajax calls on my site and was using jQuery 1.4.2 until I noticed that it was leaking.It was leaking with IE, Firefox, and Chrome.After some investigation I found the IE fix for it.I trie

I do a lot of ajax calls on my site and was using jQuery 1.4.2 until I noticed that it was leaking. It was leaking with IE, Firefox, and Chrome. After some investigation I found the IE fix for it. I tried it but it didn't fix it for any of the three browsers. I then found a posting on here where the person compared Yahoo's Javascript library to jQuery. Yahoo's didn't leak for that person. I switched to Yahoo's and it did stop the leak in IE and Firefox (I even used the Firefox leak addon). But Chrome is still leaking. Chrome builds up to around 200MB of memory and then crashes my tab. The ajax call is every second. It takes about an hour before the tab crashes. If I leave the page the memory is released. Again, IE and Firefox the problem is now gone.

What's the best way of determining where the problem is for Chrome? I looked for an add-on but haven't found one yet. I also did some searching on Google but haven't really found anything there either. I took heap snapshots but I just see big numbers next to (closure) and (code).

I liked the Firefox one (Leak Monito开发者_开发百科r), made it easy to see the problem. Anything like that for Chrome or any suggestions for finding the leak?


Use Chrome's built-in Heap Profiler in DevTools (press F12 in Chrome then go to Profiles tab):

Finding Javascript leak in Chrome

Here you can find how to test it:

link


The framework isn't causing the leak, it's your code. Let me guess at what your code looks like.

$.get('//url/',function(){
   //lets do fun stuff!
   function(){
     //more fun expensive stuff for the browser to do
   }
};

//A more efficient way (doesn't create closures)
function expensivefn(){
  //Do expensive stuff here
}
$.get('//url',expensivefn);

This is only one possible way your code could be inefficient. I don't commonly create pages that infinitely loop, usually I look for a set amount of time then ask the user if he still wants to poll. The loop you are using could be creating unnecessary closures just like the above example. For example,

//Bad!
setInterval(function(){
  //Expensive stuff
}, 1000)

//Good
function expensivestuff(){
  //Expensive stuff
}
setInterval(expensivestuff,1000);
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号