Jak przyspieszyć swój kod JavaScript.
Zmniejszenia aktywności w pętlach
Pętle są często stosowane w programowaniu.
Każda instrukcja w pętli, w tym for oświadczeniu, wykonywana jest dla każdej iteracji pętli.
Szukaj wypowiedzi lub zadań, które mogą być umieszczone na zewnątrz pętli.
Bad Kod:
for (i = 0; i < arr.length; i++) {
Lepsze Kod:
l = arr.length;
for (i = 0; i < l; i++) {Zła Kod dostępu właściwość length tablicy za każdym razem pętla iteruje.
Im lepszy kod dostępu właściwości length zewnątrz pętli, i sprawia, że uruchomienie pętli szybciej.
Zmniejszenie dostępu DOM
Dostęp do DOM HTML jest bardzo powolny w porównaniu do innych instrukcji JavaScript.
Jeśli spodziewasz się uzyskać dostęp do elementu DOM kilka razy, dostęp do niego raz i używać go jako zmiennej lokalnej:
Zmniejszenie rozmiaru DOM
Trzymać liczbę elementów w HTML DOM Small.
To będzie zawsze poprawić ładowanie strony i przyspieszyć renderowanie (wyświetlanie strony), zwłaszcza na mniejszych urządzeniach.
Każda próba poszukiwania DOM (jak getElementsByTagName) będą korzystać z mniejszej DOM.
Uniknąć niepotrzebnych zmiennych
Nie twórz nowych zmiennych, jeśli nie zamierzasz zapisać wartości.
Często można zastąpić kod jak poniżej:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
Z tym:
document.getElementById("demo").innerHTML = firstName + " " + lastName
Opóźnienie JavaScript Ładowanie
Umieszczenie skrypty w dolnej części ciała stronę, przeglądarka pozwala załadować stronę w pierwszej kolejności.
Podczas gdy skrypt pobierania, przeglądarka nie rozpocznie żadnych innych składników. Ponadto cała aktywność analizowania i renderowania może być zablokowana.
Specyfikacja HTTP definiuje, że przeglądarki nie należy pobierać więcej niż dwa składniki równolegle.
Alternatywą jest użycie defer="true" w tagu skryptu. Atrybut Defer określa, że skrypt powinien być wykonywany po stronie zakończeniu analizowania, ale to działa tylko w przypadku skryptów zewnętrznych.
Jeśli jest to możliwe, można dodać skrypt do strony za pomocą kodu, po załadowaniu strony:
Przykład
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>Unikać Korzystanie z
Unikaj używania ze słów kluczowych. Ma to negatywny wpływ na szybkość. To również zaśmiecanie up zakresów języka JavaScript.
WITH słowo kluczowe jest niedozwolona w trybie ścisłym.