Koje metode možete koristiti za ubrzanje učitavanja veb sajta?

Minimizacija i objedinjavanje CSS i JavaScript fajlova. Kompresija slika i korišćenje modernih formata kao što je WebP. Korišćenje lazy loading (lenjo učitavanje) za slike i video snimke. Keširanje resursa na strani klijenta i servera. GZIP kompresija za tekstualne resurse. Smanjenje HTTP zahteva. Korišćenje CDN (Content Delivery Network). Optimizacija kritičnog puta renderovanja. Uklanjanje neupotrebljenog koda. Korišćenje Service Workers za offline pristup i keširanje.

// Primer lazy loading slike
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);
});

Upoređenje formata slika:

Format	Tipična upotreba	Osobine
JPEG	Fotografije	Gubitnička kompresija, širok spektar boja
PNG	Grafike sa transparentnošću, logotipi	Bez gubitaka, podrška za transparentnost
GIF	Animirane slike	Bez gubitaka, podrška za animaciju
WebP	Fotografije i grafike	Efikasnija kompresija (sa i bez gubitaka), podrška za transparentnost i animaciju

/* Primer objedinjavanja i minimizacije CSS-a */
body {
  font-family: sans-serif;
  /* font-size: 16px; */ /* Uklonjen neupotrebljeni kod */
}

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

# Primer GZIP kompresije u Nginx-u
gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;