aralejs/aralejs.github.io

内存泄漏排查

Closed this issue · 7 comments

totoro 持续集成的时候发现部分 arale 组件有内存泄漏的情况,排查下具体是什么引起的。

首先排查 widget,看是什么造成增长的。

查了下, runner.html 精简了个 demo: http://aralejs.org/widget/examples/test.html,
发现还是绑定事件导致的, 去掉 demo 里 events 那行就不会涨内存.

定位到 widget.js 代码 https://github.com/aralejs/widget/blob/master/src/widget.js#L185 中 delegateEvents 中的

// delegateEvents 中 Line 185
$(element).on(eventType, callback)

// undelegateEvents 中 Line 206
this.element && this.element.off(type)

注释掉 Line 185 那行的绑定事件, 不会涨内存.
打 log 出来是 eventType 确实有绑定到 element 上, 然后 off 之前, this.element.data('events') 有值, off 之后, this.element.data('events') 无值. 怀疑是否是 element 对象变了, 导致 off 和 on 的不是同一个 element.

今天又查了下, 代码精简到:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <script src="http://assets.spmjs.org/jquery/jquery/1.7.2/jquery.js"></script>
</head>
<body>
<div id="test"></div>
<script>
    jQuery(document).ready(function($) {
        window.log = function(msg) {
            $('#test').html($('#test').html() + '<br/>' + msg)
        };
        var a = $('<div class="ttt"></div>');
        a.on('p', function() {
            log('hihi')
        });

        $(window).unload(function() {
            a.off();
            a.remove();
        });

        setTimeout(function() {
            window.location.reload();
        }, 3000);
    });
</script>
</body>
</html>

可访问页面在 http://aralejs.org/widget/examples/test.html

在 IE6 下, 每刷新一次, 内存涨 1M , 是因为给 DOM 元素 a 绑定了自定义事件 p , 这个自定义事件在 window unload 时删除不了, 但像 click 这种事件是可以删除的了的.

判断是 jQuery 1.7.2 的问题, 换到 1.8.0 及以上就没有了. 具体看 http://assets.spmjs.org/jquery/jquery/1.8.0/jquery-debug.js 里 Line 3239 行注释, 已经修复内存泄露的问题了.

Widget 的测试用例 runner.html, 是因为 https://github.com/aralejs/widget/blob/master/tests/widget-spec.js#L748 这个测试用例中, 绑定了自定义事件 导致, 暂时去掉这个用例, 刷新就不会涨内存了.

@leoner http://aralejs.org/widget/tests/runner.html 再用 totoro 跑下看看会不会导致 IE 崩溃?

赞!

💌

github 里引用文件及其行号,建议指定特定的提交版本,而不要用 master,否则修改后文件、行号对不上了。

2013/10/30 闲耘(tm) notifications@github.com

[image: 💌]

github 里引用文件及其行号,建议指定特定的提交版本,而不要用 master,否则修改后文件、行号对不上了。

Reply to this email directly or view it on GitHubhttps://github.com//issues/306#issuecomment-27355983
.

王保平 / 玉伯(射雕)
送人玫瑰手有余香

用 totoro 测试了下, 基本上多次,偶尔只有一次会增长了100多k, 可能是执行多次后,浏览器自身内存的消耗。 其他时候大部分都是能够恢复正常的。