【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()就變成自執行了，快被本身蠢哭了。