Kinerja JavaScript

Bagaimana cara agar kode JavaScript Anda semakin cepat.

Kurangi aktivitas di dalam lingkungan

Perputaran sering digunakan dalam pemrograman.

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

Perintah atau pengaturan yang dapat ditempatkan di luar lingkungan perputaran akan membuat lingkungan berjalan lebih cepat.

Kode buruk:

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

Kode yang baik:

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

Dalam setiap iterasi lingkungan, kode buruk akan mengakses length aturan.

Kode yang baik mengakses di luar lingkungan perputaran. length aturan, sehingga perputaran di dalam lingkungan akan lebih cepat.

Kurangi akses DOM

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

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

Contoh

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

Coba sendiri

Kurangi ukuran DOM

Silakan tinggalkan sedikit elemen di DOM HTML.

Hal ini akan selalu meningkatkan penggunaan halaman, dan mempercepat penggantian (penayangan) halaman, khususnya di perangkat yang kecil.

Setiap kali Anda mencoba mencari DOM (seperti getElementsByTagNamesemua akan mendapat keuntungan dengan DOM yang lebih kecil.

Akan menghindari variabel yang tidak perlu

Jangan buat variabel baru yang tidak berencana untuk menyimpan nilai.

Biasanya Anda dapat mengganti kode:

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

Gunakan kode ini:

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

Tunda penggunaan JavaScript

Silakan letakkan skrip di dasar halaman, sehingga peramban memuat halaman terlebih dahulu.

Saat skrip diunduh, browser tidak akan memulai unduhan lain. Selain itu, semua aktivitas penguraian dan pengerian mungkin akan dihalangi.

Spesifikasi HTTP mendefinisikan bahwa browser tidak boleh mengunduh lebih dari dua elemen sekaligus.

Opsi satu adalah menggunakan properti defer di tag script: defer="true". Properti defer menentukan bahwa skrip harus dijalankan setelah halaman selesai diurai, tetapi ini hanya berlaku untuk skrip eksternal.

Jika memungkinkan, Anda dapat menambahkan skrip ke halaman melalui kode setelah halaman selesai dimuat:

Contoh

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

Hindari penggunaan with

Dengan cari-cari, hindari penggunaan with Kata Kunci. Ini mempunyai dampak negatif terhadap kecepatan. Ini juga akan membingungkan lingkungan JavaScript.

Dalam mode ketat.Tidak Diizinkan Kata Kunci with.