Sebesség Közepes hatás Egyszerű 20–40 perc

Modern képformátumok (WebP/AVIF)

A WebP és AVIF 25–50%-kal kisebb a JPEG/PNG-nél.

Mi ez

A WebP és az AVIF modern képformátumok, amelyek azonos minőség mellett jelentősen jobb tömörítést kínálnak a JPEG/PNG-nél. Minden jelenlegi böngésző támogatja őket.

Miért foglalkozzon vele

A képek általában az oldal súlyának legnagyobb részét teszik ki. A WebP/AVIF-ra váltás tíz százalékokat takarít meg az adatból látható minőségvesztés nélkül, közvetlen gyorsulás.

Hogyan csinálja

1Konvertáld a képeket WebP-be (univerzális) vagy AVIF-ba (még kisebb).
2Használj <picture>-t fallbackkal a biztonság kedvéért.
3Automatizáld a konverziót a buildben / képtranszformációs CDN-en keresztül.
4Egyúttal méretezd a ténylegesen szükséges méretre.

Példa

Helyesen

<picture>
  <source srcset="foto.avif" type="image/avif">
  <source srcset="foto.webp" type="image/webp">
  <img src="foto.jpg" alt="..." width="800" height="600">
</picture>

Összegzés

A modern formátumok az egyik leghatékonyabb módja az oldalsúly csökkentésének. Ideális esetben automatizáld a konverziót, hogy ne legyen kézi munka minden képnél. Kombináld tömörítéssel, helyes méretekkel és lazy loadinggal.

Kapcsolódó témák