首页 > 代码库 > easyUI之datagrid大数据量加载慢的原因之我见

easyUI之datagrid大数据量加载慢的原因之我见

最近项目中使用了easyUI这个js展现层,说实话,展示效果还算不错,使用上也比较方便,但是让我头疼的就是datagrid的这个控件。

它的使用起始非常简单方便,而且提供的功能也比较全面,但是美中不足的就是,该控件在加载比较大的数据量时,渲染速度有点难以承受。

网上找了相关的解决方案,无外乎就是使用view。

view这个东西说实话的确能起到改善datagrid的加载速度的问题,但是缺陷也比较多,网上有该缺陷描述,本人不在此说了。

还有一个提到的方案,就是修改

jquery-easyui-min-1.3.6.js

第9272行

将循环内的代码注释掉

即:

var tr1 = $(trs1[i]);

var tr2 = $(trs2[i]);

tr1.css("height", "");

tr2.css("height", "");

var _530 = Math.max(tr1.height(), tr2.height());

tr1.css("height", _530);

tr2.css("height", _530);

 

这个方法我已经测试过,无效。

以下为个人观点:

最终发现,datagrid的列有一个属性,[width],对应的描述是

属性名称属性值类型描述默认值
widthnumber列的宽度。如果没有定义,宽度将自动扩充以适应其内容。undefined

如果列的width属性没有设置数值,那么就会自动计算宽度数值,这可是一个循环遍历的过程,要计算每一个列的宽度,并且还需要在所有数据行中取最大值来作为最终该列宽度数值

问题原因找到了,于是乎在设置datagrid列表的列时,将每列width属性进行数值设定,再次加载数据,以前加载600条数据大概需要140秒,

现在加载600条数据21秒,虽然还是非常慢,但是找到了一个导致datagrid加载速度缓慢的原因。不知道对大家有帮助没。

 

 

 

easyUI之datagrid大数据量加载慢的原因之我见