JavaScript 性能
- JS 錯誤
- JS 保留詞
如何加速您的 JavaScript 代碼。
減少循環中的活動
編程經常會用到循環。
循環每迭代一次,循環中的每條語句,包括 for 語句,都會被執行。
能夠放在循環之外的語句或賦值會使循環運行得更快。
差的代碼:
<code>var i;
for (i = 0; i < arr.length; i++) {
/<code>
更好的代碼:
<code>var i;
var l = arr.length;
for (i = 0; i < l; i++) {
/<code>
循環每次迭代時,壞代碼就會訪問數組的 length 屬性。
好代碼在循環之外訪問 length 屬性,使循環更快。
減少 DOM 訪問
與其他 JavaScript 相比,訪問 HTML DOM 非常緩慢。
假如您期望訪問某個 DOM 元素若干次,那麼只訪問一次,並把它作為本地變量來使用:
實例
<code>var obj;
obj = document.getElementById("demo");
obj.innerHTML = "Hello";
/<code>
縮減 DOM 規模
請儘量保持 HTML DOM 中較少的元素數量。
這麼做總是會提高頁面加載,並加快渲染(頁面顯示),尤其是在較小的設備上。
每一次試圖搜索 DOM(比如 getElementsByTagName)都將受益於一個較小的 DOM。
避免不必要的變量
請不要創建不打算存儲值的新變量。
通常您可以替換代碼:
<code>var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
/<code>
用這段代碼:
<code>document.getElementById("demo").innerHTML = firstName + " " + lastName/<code>
延遲 JavaScript 加載
請把腳本放在頁面底部,使瀏覽器首先加載頁面。
腳本在下載時,瀏覽器不會啟動任何其他的下載。此外所有解析和渲染活動都可能會被阻塞。
HTTP 規範定義瀏覽器不應該並行下載超過兩種要素。
一個選項是在>
如果可能,您可以在頁面完成加載後,通過代碼向頁面添加腳本:
實例
<code>
/<code>
避免使用 with
請避免使用 with 關鍵詞。它對速度有負面影響。它也將混淆 JavaScript 作用域。
嚴格模式中不允許 with 關鍵詞。
閱讀更多 鎮上寶塔 的文章
關鍵字: 瀏覽器 性能 JavaScript