从4.2版本开始,Ext JS非常慢地检查/取消选中树中的节点

时间:2014-03-04 15:48:21

标签: performance extjs extjs4.2 treepanel

我使用 cascadeBy 函数和record.set('checked',checked);在Ext JS treepanel中检查/取消选中子节点。 在4.0.7和4.1版本的EXT JS中,所有工作都很快。但是,当我将项目升级到4.2版本时,此操作使用的时间将超过4倍。

以下是示例:

http://jsfiddle.net/CaV3n/1/

checkchange: function (record, checked, opts) {

    var i=0;
    var start=new Date;
record.cascadeBy(function(e) {

    i++;
    e.set('checked', checked);
    });
    var stop = new Date;
    alert(i +'items '+ (stop-start)+'ms');

}

如果我使用版本4.2.0,我有在2677ms中呈现的132个项目

如果我使用版本4.1.0,我有在132毫米内呈现的132个项目

如果我使用的是版本4.1.1,我有在645ms中呈现的132个项目

如何提高树梢速度?

1 个答案:

答案 0 :(得分:8)

我会在ExtJS论坛中将其记录为'问题/错误'

但要提高效果,请使用suspendLayouts()

    checkchange: function (record, checked, opts) {
        var i = 0;
        var start = new Date();
        panel.suspendLayouts();
        record.cascadeBy(function (e) {
            i++;
            e.set('checked', checked);
        });
        panel.resumeLayouts();
        var stop = new Date();
        alert(i + 'items ' + (stop - start) + 'ms');

    }

这是一个工作小提琴:

http://jsfiddle.net/Vandeplas/8Dq2s/

它在1/10之前渲染...更像是60ms!

此方法专为这些“批量”更新而设计。