隨着網絡的發展,網速和機器速度的提高,越來越多的網站用到了豐富客戶端技術。而現在Ajax則是最爲流行的一種方式。JavaScript是一種解釋型語言,所以能無法達到和C/Java之類的水平,限制了它能在客戶端所做的事情,爲了能改進他的性能,我想基於我以前給JavaScript做過的很多測試來談談自己的經驗,希望能幫助大家改進自己的JavaScript腳本性能。
語言層次方面 而事實上,如何使用這兩個循環,則有很大講究。我在測試中有些很有意思的情況,見附錄。最後得出的結論是: 如果是循環變量遞增或遞減,不要單獨對循環變量賦值,應該在它最後一次讀取的時候使用嵌套的++或—操作符。 如果要與數組的長度作比較,應該事先把數組的length屬性放入一個局部變量中,減少查詢次數。
局部變量和全局變量
不使用Eval
減少對象查找 這一點可以和循環結合起來,因爲我們常常要根據字符串、數組的長度進行循環,而通常這個長度是不變的,比如每次查詢a.length,就要額外進行一個操作,而預先把var len=a.length,則就少了一次查詢。
字符串連接 如果要連接多個字符串,應該少使用+=,如
s+=a;s+=b;s+=c;
s+=a + b + c;
var buf = new Array();for(var i = 0; i < 100; i++){ buf.push(i.toString());}var all = buf.join(""); 1. 把數字轉換成字符串,應用"" + 1,雖然看起來比較醜一點,但事實上這個效率是最高的,性能上來說: ("" +) > String() > .toString() > new String() 這條其實和下面的“直接量”有點類似,儘量使用編譯時就能使用的內部操作要比運行時使用的用戶操作要快。 String()屬於內部函數,所以速度很快,而.toString()要查詢原型中的函數,所以速度遜色一些,new String()用於返回一個精確的副本。 2. 浮點數轉換成整型,這個更容易出錯,很多人喜歡使用parseInt(),其實parseInt()是用於將字符串轉換成數字,而不是浮點數和整型之間的轉換,我們應該使用Math.floor()或者Math.round()。 另外,和第二節的對象查找中的問題不一樣,Math是內部對象,所以Math.floor()其實並沒有多少查詢方法和調用的時間,速度是最快的。 3. 對於自定義的對象,如果定義了toString()方法來進行類型轉換的話,推薦顯式調用toString(),因爲內部的操作在嘗試所有可能性之後,會嘗試對象的toString()方法嘗試能否轉化爲String,所以直接調用這個方法效率會更高
使用直接量 同樣,var foo = {}的方式也比var foo = new Object();快,var reg = /../;要比var reg=new RegExp()快。
字符串遍歷操作
高級對象
DOM相關
對象查詢
創建DOM節點 無法保證代碼的有效性 字符串操作效率低 所以應該是用document.createElement()方法,而如果文檔中存在現成的樣板節點,應該是用cloneNode()方法,因爲使用createElement()方法之後,你需要設置多次元素的屬性,使用cloneNode()則可以減少屬性的設置次數——同樣如果需要創建很多元素,應該先準備一個樣板節點。
定時器
其他
文件優化
總結 直接拿手頭現成的東西比較快,如局部變量比全局變量快,直接量比運行時構造對象快等等。 儘可能少地減少執行次數,比如先緩存需要多次查詢的。 儘可能使用語言內置的功能,比如串鏈接。 儘可能使用系統提供的API,因爲這些API是編譯好的二進制代碼,執行效率很高 同時,一些基本的算法上的優化,同樣可以用在JavaScript中,比如運算結構的調整,這裏就不再贅述了。但是由於JavaScript是解釋型的,一般不會在運行時對字節碼進行優化,所以這些優化仍然是很重要的。 當然,其實這裏的一些技巧同樣使用在其他的一些解釋型語言中,大家也可以進行參考。 |
javascript腳本的性能優化
隨着網絡的發展,網速和機器速度的提高,越來越多的網站用到了豐富客戶端技術。而現在Ajax則是最爲流行的一種方式。JavaScript是一種解釋型語言,所以能無法達到和C/Java之類的水平,限制了它能在客戶端所做的事情, ...
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.