JS 之效能優化 1

2022-07-08 10:54:12 字數 887 閱讀 8768

了解js效能優化是學習前端必備的一項技能。下面就簡單的列出幾點:

1.注意作用域,避免全域性查詢。

訪問全域性變數比訪問區域性變數慢,是因為需要遍歷作用域鏈,查詢作用域鏈需要額外的時間。所以在乙個函式中,將訪問多次的全域性物件或者域外變數儲存為區域性變數來使用。如某個方法需引用全域性變數的值,則在該方法所在的物件的作用域中定義乙個區域性變數等於全域性變數的值。

避免不必要的屬性查詢,將屬性設定為區域性變數。

function()

4.js的執行盡量脫離dom樹,限制dom操作的次數,優化dom互動,儘量減少瀏覽器對dom的渲染和重繪操作

最小化現場更新,現場更新就是立即對頁面的顯示進行更新。盡量少更新。這時候可使用文件碎片來構建dom結構。document.createdocumentfragment()

使用innerhtml來構建大的dom結構。但是也避免重複大量的使用。

5.使用事件**

頁面上的事件處理程式的數量和頁面響應使用者互動的速度之間有個負相關。所以為了減少事件處理程式,盡量使用事件委託技術。

6.js的執行順序

js放html頁面最後麵時,不一定提公升js效能,但是在網速較慢的時候會快速的渲染頁面。

7.js定義行為,html定義內容,css定義外觀,不混淆

8.減少http請求數,js壓縮,http壓縮

9.資料盡量儲存在陣列裡

10、**的優化不是減少**量,而是增加**提高**的可閱讀性。

包括正確標記變數,封裝某個重複的行為,合理的注釋等。

JS效能優化 之 FOR迴圈

for 迴圈我們用的真的是太多了,但你是否關注過它的優化寫法呢?記錄下 for迴圈遍歷 for.of遍歷 foreach遍歷 for.in遍歷 map遍歷1.最最常規寫法,沒有任何不妥 for var i 0 i 10 i 2.迴圈的次數為變數的情況 for var i 0 i arr.length...

JS效能優化 之 FOR迴圈

for 迴圈我們用的真的是太多了,但你是否關注過它的優化寫法呢?記錄下 1.最最常規寫法,沒有任何不妥 for var i 0 i 10 i 2.迴圈的次數為變數的情況 for var i 0 i arr.length i 其實大多數人都是這種寫法,這種寫法的缺點在於,每次迴圈都要去讀取一次陣列的長...

Js效能優化

1.使用區域性變數來轉接全域性變數或深層屬性,縮小物件訪問層級 2.慎用with,因為with加深了內部的作用域鏈 3.eval無法提前被解析和優化,即無法被預編譯,所以要慎用。4.對字串細化操作時要轉化成字串物件new sting,省得內部每一次都要進行 轉換,影響效率。正規表示式也是如此。5.與...