JavaScript 性能
我們可以通過改變一些編程習慣,掌握一些編程技巧,就能夠加速 javascript 代碼的執(zhí)行速度,改善 javascript 的性能。
1. 減少循環(huán)中的活動
編程經(jīng)常會用到循環(huán)。
循環(huán)每迭代一次,循環(huán)中的每條語句,包括 for 語句,都會被執(zhí)行。
能夠放在循環(huán)之外的語句或賦值會使循環(huán)運行得更快。
差的代碼:
var i; for (i = 0; i < arr.length; i++) {
更好的代碼:
var i; var l = arr.length; for (i = 0; i < l; i++) {
循環(huán)每次迭代時,壞代碼就會訪問數(shù)組的 length 屬性。
好代碼在循環(huán)之外訪問 length 屬性,使循環(huán)更快。
2. 減少 dom 訪問
與其他 javascript 相比,訪問 html dom 非常緩慢。
假如您期望訪問某個 dom 元素若干次,那么只訪問一次,并把它作為本地變量來使用:
范例
var obj; obj = document.getelementbyid("demo"); obj.innerhtml = "hello";
3. 縮減 dom 規(guī)模
請盡量保持 html dom 中較少的元素數(shù)量。
這么做總是會提高頁面加載,并加快渲染(頁面顯示),尤其是在較小的設備上。
每一次試圖搜索 dom(比如 getelementsbytagname)都將受益于一個較小的 dom。
4. 避免不必要的變量
請不要創(chuàng)建不打算存儲值的新變量。
通常您可以替換代碼:
var fullname = firstname + " " + lastname; document.getelementbyid("demo").innerhtml = fullname;
用這段代碼:
document.getelementbyid("demo").innerhtml = firstname + " " + lastname
5. 延遲 javascript 加載
請把腳本放在頁面底部,使瀏覽器首先加載頁面。
腳本在下載時,瀏覽器不會啟動任何其他的下載。此外所有解析和渲染活動都可能會被阻塞。
http 規(guī)范定義瀏覽器不應該并行下載超過兩種要素。
一個選項是在 script 標簽中使用 defer="true"。defer 屬性規(guī)定了腳本應該在頁面完成解析后執(zhí)行,但它只適用于外部腳本。
如果可能,您可以在頁面完成加載后,通過代碼向頁面添加腳本:
范例
window.onload = downscripts; function downscripts() { var element = document.createelement("script"); element.src = "myscript.js"; document.body.appendchild(element); }
6. 避免使用 with
請避免使用 with 關鍵詞。它對速度有負面影響。它也將混淆 javascript 作用域。
嚴格模式中不允許 with 關鍵詞。