【2016-04-14】前端目录树加载速度优化

项目中有个报表配置页面，左侧是全部报表的目录树，右侧是报表的配置。

原本很简单的页面，随着报表的增多，页面展现的速度愈来愈慢，到了今天终于不能忍了，因而优化~

chrome里看了下XHR请求的加载速度，500ms，感受应该还能忍，在timeline里发现XHR返回后处理花了1.7s，这个处理过程报错两部分：

• ztree初始化；

• select2控件初始化：select2控件能够搜索ztree中全部报表节点

原本觉得是数据量比较大，致使ztree初始化比较慢，可是官方给出的demo表示5000个节点初始化只要70ms，遂排除ztree太慢的可能。

因而开始优化剩下的部分代码，方法很简单，移到setTimeout里，使之成为异步的，select2的初始化先排队，先渲染页面。

使用setTimeout还踩了个坑：

setTimeout(function () {
    // init select2
}, 20);

这样的能够异步，可是下面的就不异步了：

setTimeout(initSelect2(), 20);
function initSelect2(){
    // init select2   
}

缘由嘛很简单，由于setTimeout第一个参数是函数名，写成initSelect2()就变成自执行了，快被本身蠢哭了。