Kundalik performance
Tez veb-saytlar qurish uchun performance mutaxassisi bo'lishingiz shart emas. Ko'pchilik tezlik bir hovuch kundalik odatlardan keladi. Ishlash davomida bularni yodda saqlasangiz, sahifalaringiz hech qanday qahramonlik harakatisiz tez his qilinadi.
Kamroq JavaScript jo'nating
JavaScript — brauzerga yuboradigan eng qimmat narsa. U yuklab olinishi, so'ng tahlil qilinishi (parsed), so'ng ishga tushirilishi kerak — va bu sodir bo'lganda sahifa muzlaganday his qilinishi mumkin. Qancha kam JS jo'natsangiz, sahifa shuncha tez interaktiv bo'ladi.
Amaliy odatlar:
- Bir necha qator oddiy JavaScript bajara oladigan narsa uchun katta kutubxonani tortib olmang.
- Endi ishlatmaydigan kod va bog'liqliklarni (dependencies) olib tashlang.
- Ishni bajara olganida JavaScript o'rniga ichki qurilgan brauzer imkoniyatlarini (CSS va native forma validatsiyasi kabi) afzal ko'ring.
Katta rasmlardan qoching
Boshqa joyda yoritilganidek, rasmlar ko'pincha sahifaning eng og'ir qismi. Ularni ko'rsatiladigan o'lchamga o'zgartiring, WebP kabi zamonaviy formatlardan foydalaning va ekrandan tashqarida boshlanadiganlarni lazy-load qiling. Bu odatda mavjud bo'lgan eng tez yutuq, shuning uchun uni takrorlashga arziydi.
Sahifani bloklamang
"Bloklash" yuklanish paytida biror narsa sahifaning ko'rinishi yoki javob berishini to'xtatishini anglatadi. Klassik aybdor — <head> dagi <script> bo'lib, brauzer sahifani qurishni davom ettirishdan oldin uni to'liq yuklab olishi va ishga tushirishi kerak.
Ikkita oson tuzatish:
- Skriptlarni
<body>oxiriga qo'ying yokideferatributini qo'shing, shunda skript HTML tahlil qilinguncha kutadi. - Sahifa yuklanishi bilanoq og'ir ish bajarishdan qoching; muhim kontent avval paydo bo'lsin.
<!-- defer lets the HTML finish before the script runs -->
<script src="app.js" defer></script>Maqsad — foydalanuvchilar asosiy kontentni tez ko'rishi va ishlatishi, garchi ba'zi qo'shimchalar hali yuklanayotgan bo'lsa ham.
Lighthouse bilan o'lchang
Performance haqida taxmin qilish xavfli — buning o'rniga o'lchang. Lighthouse — Chrome DevTools ga bevosita qurilgan bepul vosita. U sahifangizni yuklaydi, performance uchun uni 100 balldan baholaydi (accessibility va best practices ham) va tuzatish uchun aniq narsalarning ustunlik berilgan ro'yxatini beradi.
Uni ishga tushirish uchun: sahifangizni Chrome da oching, DevTools ni oching, Lighthouse tabiga o'ting va Analyze ni bosing. Avval yuqori takliflarga e'tibor bering — Lighthouse ularni ta'sir bo'yicha tartiblaydi, shuning uchun birinchi bir nechtasini tuzatish odatda eng ko'p yordam beradi.
O'lchang, o'zgartirish kiriting, so'ng u haqiqatan ham yordam berganini tasdiqlash uchun yana o'lchang. Ushbu tsikl — umid o'rniga ishonch bilan yaxshilash usuli.
Suhbat maslahatlari
- Eng katta richaglarni tartibda nomlang: kamroq JavaScript, kichikroq rasmlar va dastlabki renderni bloklamaslik.
- Skriptlarning sahifani bloklashini to'xtatishning oddiy usuli sifatida
defer(yoki body oxiridagi skriptlar) ni tushuntiring. - Lighthouse ni asosiy o'lchash vositangiz sifatida eslatib o'ting va o'zgartirishdan oldin va keyin o'lchashni ta'kidlang.
Muhokama
Hozircha izoh yo‘q
Muhokamada qatnashish uchun tizimga kiring.
KirishHozircha fikr yo‘q
Birinchi bo‘lib yozing: bu mavzuda nima yordam berdi — yoki nimani aniqroq tushuntirish kerak.