MohirDox

Ko'rinishi

JavaScript Unumdorlik (Performance) ​

JavaScript kodingizni qanday tezlashtirish mumkin.

Sikllar ichidagi faoliyatni kamaytiring ​

Sikllar dasturlashda tez-tez ishlatiladi. Siky ichidagi har bir bayonot, shu jumladan for bayonoti, siklning har bir iteratsiyasi uchun bajariladi.

Sikl tashqarisiga joylashtirilishi mumkin bo'lgan bayonotlar yoki tayinlashlar siklni tezroq ishlashiga olib keladi.

❌ Yomon:

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

✅ Yaxshiroq kod:

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

Yomon kod massivning length xususiyatiga sikl har iteratsiya qilinganida murojaat qiladi. Yaxshiroq kod length xususiyatiga sikl tashqarisida murojaat qiladi va siklni tezroq ishlashiga olib keladi.

DOM murojatlarini kamaytiring ​

HTML DOM-ga murojaat qilish boshqa JavaScript bayonotlariga nisbatan juda sekin.

Agar DOM elementiga bir necha marta murojaat qilishni kutsangiz, unga bir marta murojaat qilib, mahalliy o'zgaruvchi sifatida ishlating:

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

DOM hajmini kamaytiring ​

HTML DOM-dagi elementlar sonini kichik saqlang. Bu har doim sahifa yuklashini yaxshilaydi va renderlashni (sahifa ko'rsatishni) tezlashtiradi, ayniqsa kichik qurilmalarda.

DOM-ni qidirish uchun har bir urinish (masalan getElementsByTagName) kichikroq DOM dan foyda ko'radi.

Keraksiz o'zgaruvchilardan saqlaning ​

Qiymatlarni saqlashni rejalashtirmaysiz, yangi o'zgaruvchilar yaratmang.

Ko'pincha bunday kodni:

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

Bunga almashtirish mumkin:

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

JavaScript yuklashni kechiktiring ​

Skriptlaringizni sahifa tanasi (body) pastiga qo'yish brauzerga avval sahifani yuklash imkonini beradi.

Skript yuklanayotganda, brauzer boshqa yuklamalarni boshlamaydi. Bundan tashqari, barcha tahlil qilish va renderlash faoliyati bloklanishi mumkin.

Eslatma

HTTP spetsifikatsiyasi brauzerlar parallel ravishda ikki komponentdan ko'p yuklamasligi kerakligini belgilaydi.

Muqobil variant — script tegida defer="true" ishlatishdir. defer atributi skript sahifa tahlili tugagandan keyin bajarilishi kerakligini belgilaydi, lekin faqat tashqi skriptlar uchun ishlaydi.

Iloji bo'lsa, sahifa yuklangandan keyin skriptni kod orqali qo'shishingiz mumkin:

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

with ishlatmang ​

with kalit so'zidan foydalanishdan saqlaning. U tezlikka salbiy ta'sir ko'rsatadi. U JavaScript ko'lamlarini ham chalkashtirib yuboradi. with kalit so'ziga qat'iy rejimda (strict mode) ruxsat berilmaydi.