Kokius svetainių optimizavimo būdus žinai?

Kritinio kelio optimizavimas (CRP): Sumažinti įkėlimo, atvaizdavimo ir turinio "viršūnės" rodymo laiką, teikiant pirmenybę kritiniams ištekliams (CSS, JavaScript).

HTTP užklausų mažinimas: Failų sujungimas ir minimizavimas CSS, JavaScript, naudoti spraitus vaizdams.

Lėtas įkėlimas (Lazy Loading): Atidėti išteklių (vaizdų, vaizdo įrašų) įkėlimą iki jų tapimo matomais naudotojui.

Vaizdų optimizavimas: Suspaudimas be kokybės praradimo, naudoti šiuolaikinius formatus (WebP), atsakingi vaizdai (srcset, sizes).

Talpykla: Naudoti naršyklės ir serverio talpyklą, siekiant sumažinti apkrovą ir pagreitinti pakartotinį įkėlimą.

CDN (Content Delivery Network) naudojimas: Turinį paskirstyti geografiškai išsibarsčiusiuose serveriuose, siekiant sumažinti delsą.

Asinchroninis ir atidėtas skriptų įkėlimas: Naudoti async ir defer atributus <script> žymose.

<script src="script.js" async></script>
<script src="another-script.js" defer></script>

Šriftų optimizavimas: Naudoti font-display: swap, kad išvengtumėte FOUC (Flash Of Unstyled Content), įkelti tik būtinus simbolių rinkinius.

@font-face {
  font-family: 'MyFont';
  src: url('myfont.woff2') format('woff2');
  font-display: swap; /* Išvengti nematomų tekstų */
}

Nepanaudoto CSS ir JavaScript šalinimas: Analizės įrankiai (pvz., Chrome DevTools Coverage) ir surinkėjai (Webpack, Parcel) padeda nustatyti ir pašalinti nenaudojamą kodą.

SSR (Server-Side Rendering) arba pre-rendering: Dalies ar visos puslapio atvaizdavimo atlikimas serveryje, siekiant pagerinti našumą ir SEO, ypač SPA.

Web Workers: Ressursų intensyvių užduočių vykdymas foniniame sraute, neblokiruojant pagrindinio UI srauto.

// Web Worker sukūrimas
const worker = new Worker('worker.js');

// Duomenų siuntimas worker'ui
worker.postMessage({ data: 'some data' });

// Žinučių apdorojimas iš worker'o
worker.onmessage = (event) => {
  console.log('Gauta iš worker:', event.data);
};

PWA (Progressive Web Apps): Naudoti service workers talpyklai ir neprisijungus prie interneto.

Našumo analizė: Reguliariai naudoti įrankius kaip Lighthouse, PageSpeed Insights, WebPageTest, Chrome DevTools Performance tab.