JavaScript 性能

JavaScript 性能

  • JS 錯誤
  • JS 保留詞

如何加速您的 JavaScript 代碼。


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 關鍵詞。


分享到:


相關文章: