如何加快你的JavaScript代碼。
在循環減少活動
環路在編程中通常使用的。
在循環中每個語句,包括for聲明,是循環的每個迭代執行。
搜索可以放置在循環外陳述或分配。
糟糕的代碼:
for (i = 0; i < arr.length; i++) {
更好的代碼:
l = arr.length;
for (i = 0; i < l; i++) {
壞代碼訪問數組的長度屬性中的每個循環迭代的時間。
更好的代碼訪問外循環的長度屬性,使循環運行得更快。
減少DOM訪問
訪問HTML DOM是很慢的,相對於其他JavaScript語句。
如果您希望在訪問DOM元素幾次,一次訪問它,並把它作為一個局部變量:
減少DOM大小
保持在HTML DOM小的基元的數量。
這將始終把提高頁面加載,加速渲染(頁面顯示),尤其是在更小的設備。
千方百計搜索DOM(類似的getElementsByTagName)將受益於更小的DOM。
避免不必要的變量
不要創建新的變量,如果你不打算保存的值。
通常你可以這樣替換代碼:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
有了這個:
document.getElementById("demo").innerHTML = firstName + " " + lastName
延遲加載的JavaScript
在頁面主體的底部把你的腳本,讓瀏覽器首先加載頁面。
雖然腳本下載,瀏覽器將不會啟動任何其他下載。 此外,所有的解析和渲染活動可能被阻止。
HTTP規範定義了瀏覽器應該不平行下載超過兩種組分。
另一種方法是使用defer="true"的腳本標籤。 defer屬性指定的頁面已完成解析後,該腳本會被執行,但它僅適用於外部腳本。
如果可能的話,可以通過代碼腳本添加到頁面,在頁面加載後:
例
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>
避免使用
避免使用帶有關鍵字 。 它對速度有負面影響。 它還雜波了JavaScript的作用域。
該關鍵字與不嚴格模式不允許的 。