どのようにJavaScriptコードをスピードアップします。
ループ内の活性を低下させます
ループは、多くの場合、プログラミングで使用されています。
含むループ内の各ステートメント、 for文は、ループの各反復のために実行されます。
ループの外側に配置することができ文または割り当てを検索します。
バートコード:
for (i = 0; i < arr.length; i++) {
より良いコード:
l = arr.length;
for (i = 0; i < l; i++) {
不正なコードは、配列のループが繰り返されるたびにlengthプロパティにアクセスします。
より良いコードは、ループの外lengthプロパティにアクセスし、ループの実行時間を短縮できます。
DOMアクセスを削減
HTML DOMにアクセスすると、他のJavaScript文に比べ、非常に遅いです。
あなたは、DOM要素を複数回アクセスしたら、それをアクセスし、ローカル変数として使用することが予想される場合は:
DOMのサイズを小さく
HTML DOM小の要素数を保管してください。
これは、常にページの読み込みを改善し、特に小型のデバイス上で、(ページ表示)をレンダリングスピードアップします。
(getElementsByTagNameのような)DOMを検索するあらゆる試みは、より小さなDOMの恩恵を受ける。
不要な変数を避けます
あなたは値を保存する予定がない場合は、新しい変数を作成しないでください。
多くの場合、あなたはこのようなコードを置き換えることができます。
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
これとともに:
document.getElementById("demo").innerHTML = firstName + " " + lastName
遅延JavaScriptの読み込み中
ページ本体の下部にスクリプトを置く、ブラウザが最初のページをロードすることができます。
スクリプトがダウンロードしている間、ブラウザは、他のダウンロードを開始しません。 さらに、すべての解析およびレンダリング活動がブロックされる可能性があります。
HTTPの仕様では、ブラウザは、並列に二つ以上のコンポーネントをダウンロードしないことを規定しています。
代替案は、使用することですdefer="true"スクリプトタグに。 延期属性は、ページが構文解析が終了した後にスクリプトが実行されるべきであることを指定しますが、それだけで外部スクリプトのために働きます。
可能な場合はページが読み込まれた後、あなたは、コードによってページにスクリプトを追加することができます。
例
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>
での使用は避けてください
キーワードでの使用は避けてください。 これは、速度にマイナスの影響を持っています。 JavaScriptのスコープアップそれもクラッタ。
キーワードとstrictモードでは使用できません 。