淺談頁面裝載js及效能分析方法_javascript技巧

一、裝載

   先裝載靜態頁面的引用js文件，然後查找引用文件中是否包含onload函數，例如main.js中包含onload函數，在main.js中查找是否有對其他js文件的引用，優先裝載引用js文件，被引用中文件的裝載順序和main.js的順序一致。
裝載完畢後，開始執行onload函數。由於js執行順序是順序執行的，為提高頁面相應速度，一般做法是在onload中只畫頁面，一些事件的綁定函數，ajax方法等可延遲書寫。

二、反應速度分析

1.借助工具進行分析

各大瀏覽器的開發者工具（最喜歡使用火狐）可以方便的查看各個js檔案、html檔案、css檔案及圖片的裝載及執行時間。

2.硬編碼分析

在第一步中我們基本上能定位到瓶頸js檔案了，在瓶頸js中，可以使用console.time('test')和console.Endtime('test')語句對js函數及程式碼區塊掐取執行時間。不過console語句只在非IE瀏覽器中執行有效，而在IE下會報錯。如果你偏好使用IE，那就用時間戳記吧。在掐住時，比較方便的方法是，直接掐住整個js文件，然後使用火狐瀏覽器，按F12可以在控制台中看到目標js中所有函數及代碼塊的耗時，即可定位到瓶頸代碼處。