Bagaimana mempercepat kode JavaScript Anda.
Mengurangi aktivitas di Loops
Loop sering digunakan dalam pemrograman.
Setiap pernyataan dalam satu lingkaran, termasuk for pernyataan, dieksekusi untuk setiap iterasi dari loop.
Cari untuk laporan atau tugas yang dapat ditempatkan di luar lingkaran.
Kode yang buruk:
for (i = 0; i < arr.length; i++) {
Kode yang lebih baik:
l = arr.length;
for (i = 0; i < l; i++) {Kode buruk mengakses properti panjang array setiap kali loop iterasi.
Kode yang lebih baik mengakses properti panjang di luar loop, dan membuat loop berjalan lebih cepat.
Mengurangi DOM Access
Mengakses HTML DOM sangat lambat, dibandingkan dengan laporan lainnya JavaScript.
Jika Anda berharap untuk mengakses elemen DOM beberapa kali, mengaksesnya sekali, dan menggunakannya sebagai variabel lokal:
Mengurangi DOM Ukuran
Menjaga jumlah elemen dalam HTML DOM kecil.
Ini akan selalu meningkatkan loading halaman, dan mempercepat render (tampilan halaman), terutama pada perangkat yang lebih kecil.
Setiap upaya untuk mencari DOM (seperti Buka menu) akan mendapatkan keuntungan dari DOM yang lebih kecil.
Hindari Variabel yang tidak perlu
Jangan membuat variabel baru jika Anda tidak berencana untuk menyimpan nilai-nilai.
Sering kali Anda dapat mengganti kode seperti ini:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
Dengan ini:
document.getElementById("demo").innerHTML = firstName + " " + lastName
Memuat keterlambatan JavaScript
Menempatkan script Anda di bagian bawah halaman tubuh, memungkinkan browser memuat halaman pertama.
Sementara naskah adalah men-download, browser tidak akan mulai download lainnya. Selain semua parsing dan rendering aktivitas mungkin diblokir.
Spesifikasi HTTP mendefinisikan bahwa browser tidak harus men-download lebih dari dua komponen secara paralel.
Sebuah alternatif adalah dengan menggunakan defer="true" dalam tag script. Atribut defer menetapkan bahwa script harus dijalankan setelah halaman selesai parsing, tetapi hanya bekerja untuk script eksternal.
Jika memungkinkan, Anda dapat menambahkan script ke halaman dengan kode, setelah halaman telah dimuat:
Contoh
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>Hindari Menggunakan dengan
Hindari menggunakan dengan kata kunci. Ini memiliki efek negatif pada kecepatan. Hal ini juga mengacaukan up lingkup JavaScript.
Dengan kata kunci tidak diperbolehkan dalam mode yang ketat.