Notes de l'equip sobre artesania, formats i les petites decisions darrere d'un bon resultat.
Per què l'AVIF supera el WebP en fotografies
L'avantatge de compressió de l'AVIF sobre el WebP ve del còdec de sota. El WebP fa servir el motor intratrama dissenyat per a vídeo però usat per a imatges fixes des del 2010. L'un format modern, el còdec darrere de l'AVIF, va sortir el 2018 després d'anys de recerca enfocada de ple als límits del el i l'. L'un format modern aplica un submostreig de croma més agressiu, una partició de blocs més fina fins a 4 per 4 píxels i un codificador entròpic més eficaç. El resultat pràctic, validat amb anàlisi en grans conjunts de proves de fotografies, és que l'AVIF sol ser un 20 a 30 per cent més petit que el WebP a la mateixa qualitat perceptiva en fotografies. En gràfics generats per ordinador amb color pla i vores dures la diferència s'estreny, perquè l'algorisme més simple del WebP gestiona aquests patrons amb eficiència. Per a qualsevol pàgina on els elements més pesats siguin fotografies, la millora cap a l'AVIF té un impacte mesurable en l'amplada de banda.
La segona passada amb pèrdues a la pràctica
Quan convertiu un WebP a AVIF, tant l'origen com la teva sortida tenen pèrdues. El desament del WebP ja va decidir quina informació de color descartar quan el WebP es va crear inicialment, i aquelles decisions són permanents: convertir a AVIF no en pot recuperar cap. Després el desament de l'AVIF pren les seves pròpies decisions sobre les dades de píxel que rep, a qualitat 85. En fotografies, l'efecte combinat de dues passades amb pèrdues continua sent visualment gairebé sense pèrdues a mides de visualització típiques, mesurant al voltant de en contingut fotogràfic real. En gràfics ja degradats pel seu desament WebP, la segona passada pot acumular artefactes visibles. La regla pràctica: si el WebP d'origen es veu net a la mida en què el penseu mostrar, l'AVIF també s'hi veurà. Si el teu WebP ja mostra soroll de compressió, examineu l'AVIF amb cura abans de publicar-lo.
Com flueix la capa de transparència
Tant el WebP com l'AVIF codifiquen la transparència com un capa de transparència separat al costat de les dades de color. La conversió llegeix la capa de transparència del WebP, el composa a transparència plena, després el lliura al desament de l'AVIF, que escriu la seva pròpia capa de transparència fent servir codificació intratrama un format modern a qualitat 85. Els degradats de transparència suaus, les vores difuminades i les àrees parcialment transparents sobreviuen tots aquest viatge d'anada i tornada. El capa de transparència de l'AVIF té ell mateix pèrdues a qualitat 85, cosa que pot introduir un serrellat amb prou feines perceptible a les vores dures sota una ampliació extrema. A mides de visualització normals al web la diferència respecte de l'origen no és visible. Per a feina de píxel exacte en icones petites on la vora alfa ha de ser precisa, manteniu l'origen WebP teu i verifiqueu la teva sortida a ampliació plena abans de publicar-la.
Expectatives de temps de desament entre navegadors i dispositius
La preparació de l'AVIF s'escalfa un cop per sessió de navegador, afegint aproximadament un segon a la primera conversió. Després, el Chromium dona el millor rendiment: aproximadament 40 mil·lisegons per a una miniatura de 0,12 megapíxels, 250 mil·lisegons per a una fotografia d'1 megapíxel, 2,8 segons per a una fotografia 4K i 25 segons per a una imatge completa de 48 megapíxels en el pitjor cas observat. El Firefox és l'excepció destacada, executant la mateixa preparació unes quatre vegades més lent, cosa que situa el cas 4K a prop de 31 segons i els fitxers grans més enllà de dos minuts. El WebKit se situa entre tots dos, més a prop del Chromium. El maquinari mòbil va de 3 a 5 vegades més lent que l'escriptori en tots els motors. Per a conversió rutinària fitxer a fitxer, el Chrome en un portàtil o escriptori és l'eina pràctica. Per a usuaris de Firefox amb imatges grans, el consell honest és canviar de navegador o quedar-se amb el WebP.
Els Core Web Vitals i la millora cap a l'AVIF
Les pàgines que serveixen fotografies paguen un cost d'amplada de banda per cada imatge carregada. Si aquestes imatges ara són WebP, convertir-les a AVIF retalla la transferència per imatge en aproximadament un 20 a 30 per cent en fotografies. En una pàgina amb una imatge protagonista WebP de, l'AVIF la deixa en uns 140 a. En una graella de productes amb dotze miniatures WebP de, l'AVIF estalvia uns 70 a de pes total de pàgina. Aquests estalvis afecten directament el Largest Contentful Paint quan l'element LCP és una imatge. Amb prop del 94 per cent de suport global de navegadors per a l'AVIF, un element picture que serveix AVIF primer amb un WebP de reserva cobreix essencialment tot el trànsit. El cost de marcatge es paga un cop per component d'imatge, mentre que l'estalvi d'amplada de banda es repeteix a cada càrrega de pàgina posterior.
Per què la conversió a AVIF s'enganxa a un servidor
L'AVIF es construeix sobre el còdec un format modern, la mateixa família que fa servir el vídeo modern, i és expressament pesat de generar a canvi de fitxers compactes. Fer bé aquesta feina, sobretot en fotos grans, és molt més ràpid i fiable en un servidor de debò que en el navegador d'un telèfon, així que aquesta parella envia la imatge al nostre servidor per generar el millor AVIF possible. El fitxer es processa i el resultat us torna, i la baixada es retira en unes 2 hores, sense dades personals i sense emmagatzematge de llarga durada. Convertir diverses imatges de cop sempre corre al servidor, que munta el conjunt acabat en una sola baixada, esborrada en el mateix temps curt. Si no es pot arribar al nostre servidor, una conversió sola passa a generar-se dins el navegador, aquest fitxer queda en local, i accepta una generació més lenta per comoditat. El bescanvi és clar: el servidor compra qualitat i rapidesa en el format que més ho necessita, i el vostre fitxer no es guarda mai més enllà de la breu finestra que dura la conversió.
