Javascript效能優化之 函式節流技術

2021-06-10 13:48:20 字數 1051 閱讀 4355

函式節流技術的主要思路是,通過乙個定時器,阻斷連續重複的函式呼叫。對於我們自己內部使用的函式,這通常意義不大,也不推薦使用這個技術,它可能會丟失對某些資料的處理。但是對於在使用者介面呼叫的函式,卻非常有意義。例如乙個

mousemove 

或者ie 

中resize 

事件的監聽函式。

這類事件監聽函式往往伴隨著兩個主要特徵:

1. 短時間內連續多次重複觸發

; 2. 

大量的dom 

操作。眾所周知,

dom 

操作對記憶體和

cpu 

的開銷是比較大的,特別是當同時滿足特徵

1時,往往給瀏覽器造成不小的壓力。函式節流技術的意義在於在使用者察覺範圍外,降低函式呼叫的頻率,從而提公升效能。

這個技巧的大概模式如下面這樣:

varprocessor=,

process

:function(),

100); }

};//呼叫

processor.process();

performprocessing 

是真正要呼叫的函式,而程式的入口在

process

,每次進入

process

,真正要呼叫的函式

performprocessing 

都會被延遲

100 

毫秒執行,如果在此期間,

process 

再次被呼叫,則會重置前一次的計時器,重新開始計時,這樣保證了

performprocessing 

中的**至少要間隔

100 

毫秒才會被執行一次,原理非常的簡單,下面這個函式也是利用這個原理,通過閉包達到了同樣的目的,它接受兩個引數,第乙個是要真正要執行的函式,第二個是間隔的時間。

functionthrottle(fn

,delay

),delay);

}; }

JavaScript效能優化

盡量使用區域性變數 減少全域性變數的使用 可以縮小查詢的作用域鏈。使用變數和陣列要比訪問物件上的屬性更有效率。對於多重屬性查詢,將多次使用的屬性查詢儲存在區域性變數中。前 window.location.href.substring window.location.href.indexof 後 va...

JavaScript效能優化 資料訪問

乙個function的作用域模型,一般分為活動物件 區域性變數什麼的 全域性物件 window物件,document 訪問順序是先變數活動物件,後查詢全域性物件。function initui document可以用區域性變數儲存 var doc document var bd doc.body v...

效能優化之PHP優化

1.使用apache下的ab工具進行效能測試 測試 ab n100 c100 請求100次,併發量是100 關注兩個量 requests per second 每秒請求數 和time per request 平均響應時間 2.盡量使用php內建變數,常量,函式,原因 php 需要經過zend引擎獨行...