Performa JavaScript

Bagaimana untuk mempercepat kod JavaScript anda.

Kurangkan aktiviti dalam pengulangan

Pengulangan sering digunakan dalam pemrograman.

Dalam setiap iterasi pengulangan, setiap perintah di dalam pengulangan, termasuk for Perintah, akan dijalankan.

Perintah atau pengaturan yang boleh ditempatkan di luar pengulangan akan membuat pengulangan berlaku lebih cepat.

Kod yang buruk:

var i;
for (i = 0; i < arr.length; i++) {

Kod yang baik:

var i;
var l = arr.length;
for (i = 0; i < l; i++) {

Dalam setiap iterasi pengulangan, kod yang buruk akan mengakses array length aturan.

Kod yang baik mengakses di luar pengulangan length aturan, supaya pengulangan lebih cepat.

Kurangkan akses DOM

Dibandingkan dengan JavaScript lain, akses ke HTML DOM sangat lambat.

Jika anda mengharapkan mengakses elemen DOM beberapa kali, hanya akses sekali dan gunakan sebagai variabel lokal:

Contoh

var obj;
obj = document.getElementById("demo");
obj.innerHTML = "Hello";

Cuba sendiri

Kurangkan saiz DOM

Sila cuba untuk mempertahankan jumlah elemen yang kecil di HTML DOM.

Hal ini akan selalu meningkatkan muat halaman, dan mempercepat perenderan (pemaparan halaman), terutama di peranti kecil.

Setiap kali cuba mencari DOM (seperti getElementsByTagName）akan mendapat manfaat daripada DOM yang kecil.

Awas daripada variabel yang tidak perlu

Jangan buat variabel baru yang tidak diinginkan untuk menyimpan nilai.

Biasanya anda boleh menggantikan kod:

var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;

Gunakan kod ini:

document.getElementById("demo").innerHTML = firstName + " " + lastName

Lengkapi muat JavaScript

Sila letakkan skrip di bawah halaman, supaya pelayar menggelintir halaman dahulu.

Saat skrip diunduh, pemeriksa tidak akan memulakan sebarang unduhan lain. Selain itu, semua aktiviti penguraian dan perekaan mungkin akan dihalang.

Spesifikasi HTTP mendefinikan bahawa pemeriksa tidak boleh mengunduh lebih daripada dua jenis elemen secara bersamaan.

Satu pilihan adalah untuk menggunakan defer="true"Properti defer menentukan skrip sepatutnya dijalankan selepas halaman selesai diparsa, tetapi ia hanya boleh digunakan untuk skrip luaran.

Jika mungkin, anda boleh menambahkan skrip ke halaman melalui kod selepas halaman selesai dimuatkan:

Contoh

<script>
window.onload = downScripts;
function downScripts() {
    var element = document.createElement("script");
    element.src = "myScript.js";
    document.body.appendChild(element);
}
</script>

Mengelakkan untuk digunakan with

Sila mengelakkan untuk digunakan with Kata Kunci. Ia mempunyai kesan negatif kepada kelajuan. Ia juga akan menghaluskan skop JavaScript.

Dalam modus ketat.Tidak Diizinkan Kata Kunci with.