(原创)easyui 页面加载慢的原因及解决办法

       Easyui  框架简单、易用,且功能丰富,可以满足大多的管理类网站开发的要求。但越开发到后面的时候,

总感觉页面加载越来越慢,有时打开一个页面需要好几秒甚至十几秒,这种体验是非常糟糕的。

       刚开始还以为是因为加载的东西多了,导致页面加载缓慢。通过IE浏览器的调试工具(IE中按F12调出),网

络调试后发现,绝大部分时间都花在  datagrid 及 combobox 或是 combotree 这几个组件上了。自己的页面需

要在 $(function(){   XXX  });  中,页面加载前生成 combobox、combotree 等组件。

一、定位原因

       通过调试后,得知 combobox、combotree、datagrid 等组件在加载时花的时间较多。通过初步测试发

现:如果 combobox 不通过 ajax 生成,而是直接在页面中写死option 项,加载的时间几乎为零,可以得出这

样的结论,easyui 在 $(function(){}) 中执行 ajax 从后端取出 combobox 数据会导致缓慢。同样,再测试

combotree 也存在这种情况。

二、解决办法

        由于是 java 开发,可以在第一次请求 servlet 时,先从后台生成 combobox \ combotree 的 json 数据,

并存储为 servlet 变量,在页面中获取后,直接初始化 combobox 或 combotree 等组件。而避用 ajax 请求的

方式初始化相关组件。

三、避免重复 datagrid 请求

       有时通过日志看到有些 datagrid 请求,重复请求了两次。这是由于 easyui 的设计问题造成的:如果在

页面中定义的 div 指定了 class="easyui-datagrid"  ,然后在 javascript 代码中,又通过

$("#userDg").datagrid 去请求数据的,都将两次请求数据。且两次收集的参数还有些不同。解决办法是,将

页面中定义的 div 的 class="easyui-datagrid"  属性删除即可

猜你喜欢

转载自hwzyyx.iteye.com/blog/2366379