Veb-sayt yuklanishini tezlashtirish uchun qanday usullarni qo'llashingiz mumkin?

CSS va JavaScript fayllarini minimallashtirish va birlashtirish. Rasmlarni siqish va WebP kabi zamonaviy formatlardan foydalanish. Rasmlar va videolar uchun kechiktirilgan yuklash (lazy loading) foydalanish. Resurslarni mijoz va server tomonida kechiktirish. Matn resurslari uchun GZIP siqishni. HTTP so'rovlarini kamaytirish. CDN (Content Delivery Network) dan foydalanish. Render qilishning muhim yo'lini optimallashtirish. Foydalanilmaydigan kodni olib tashlash. Offline kirish va kechiktirish uchun Service Workers foydalanish.

// Rasm uchun lazy loading misoli
const images = document.querySelectorAll('img[data-src]');

const observer = new IntersectionObserver((entries, observer) => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      const img = entry.target;
      img.src = img.dataset.src;
      observer.unobserve(img);
    }
  });
});

images.forEach(image => {
  observer.observe(image);
});

Rasmlarning formatlarini taqqoslash:

Format	Taqdim etish uchun odatiy foydalanish	Xususiyatlar
JPEG	Rasm	Yo'qotma siqish, keng rang diapazoni
PNG	Shaffof grafiklar, logotiplar	Yo'qotmas siqish, shaffoflikni qo'llab-quvvatlash
GIF	Animatsiyali rasmlar	Yo'qotmas siqish, animatsiya qo'llab-quvvatlash
WebP	Rasm va grafiklar	Ko'proq samarali siqish (yo'qotma va yo'qotmas), shaffoflik va animatsiya qo'llab-quvvatlash

/* CSS ni birlashtirish va minimallashtirish misoli */
body {
  font-family: sans-serif;
  /* font-size: 16px; */ /* Foydalanilmaydigan kod olib tashlandi */
}

h1 {
  color: #333;
  margin-bottom: 20px;
}

# Nginx'da GZIP siqishni misoli
gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;