JavaScript 效能優化小結_javascript技巧
- WBOY原創
- 2016-05-16 15:36:531061瀏覽
隨著 Web2.0 技術的不斷推廣，越來越多的應用使用 JavaScript 技術在客戶端進行處理，從而使 JavaScript 在瀏覽器中的效能成為開發者所面臨的最重要的可用性問題。而這個問題又因 JavaScript 的阻塞特性變的複雜，也就是說當瀏覽器在執行 JavaScript 程式碼時，不能同時做其他事情。本文詳細介紹如何正確的載入和執行 JavaScript 程式碼，從而提高其在瀏覽器中的效能。
在J2EE程式設計中，我們接觸最多的腳本語言還是JavaScript。在使用JavaScript中我們通常會考慮其效能問題，因此將日常總結的關於JavaScript效能優化的方式總結出來，以備查詢。
在使用JavaScript中經常會遇到字串的拼接問題。請問大家在使用Java程式設計的時候遇到上述的問題，該怎麼處理？
NX學生：老師，使用StringBulider 或StringBuffer
老師：回答正確，使用StringBuilder或StringBuffer能夠避免過多建立對象，降低系統效能。
好了，回到正題，我們還是來解答在使用JavaScript中，遇到上述問題的處理方式。
首先，先來看看NX學生的處理方式：
<html>
<script type="text/javascript">
var string="begin"
var date = new Date()
var begin = date.getTime()
for(var i=0;i<9999999;i++){
string+="abc"
}
alert(new Date().getTime() - begin)
</script>
</html>
老師一看NX學生實現的方式，差點笑噴。這種垃圾的實現方式，真是毀了你一世英名啊。
老師面帶微笑的說：你這種實現方式就相當於小學生的水平，就是一堆垃圾字母的隨機組合。說完只聽見SB老師在鍵盤上鍵步如飛的敲其代碼來。 NX學生還沒反應過來，老師已經完成程式碼：
<html>
<script type="text/javascript">
var string="begin";
var string01=["begin"];
var date = new Date();
var begin = date.getTime();
for(var i=0;i<55555555;i++){
//string+="abc";
string01.push("abc");
}
var result = string01.join("");
alert(new Date().getTime() - begin);
</script>
</html>
透過以上程式碼的執行比較，老師的程式碼效能明顯優於NX學生的程式碼，NX學生程式碼也會經常導致IE宕掉。
NX學生看到程式碼運行的結果，頓時對老師產生仰慕之情，決定虛心想老師學習，不斷提升自己…
這個故事雖然告一段落，但是老師和NX學生的JavaScript之旅還在繼續…