Σημειώσεις από την ομάδα για την τέχνη, τις μορφές και τις μικρές αποφάσεις πίσω από ένα καλό αποτέλεσμα.
Γιατί το AVIF νικά το WebP στις φωτογραφίες
Το πλεονέκτημα συμπίεσης του AVIF έναντι του WebP προέρχεται από τον υποκείμενο κωδικοποίηση. Το WebP χρησιμοποιεί τη μηχανή ενδοπλαισίου σχεδιασμένη για βίντεο αλλά σε χρήση για σταθερές εικόνες από το 2010. Το σύγχρονη μορφή, ο κωδικοποίηση πίσω από το AVIF, κυκλοφόρησε το 2018 μετά από χρόνια έρευνας στραμμένης ευθέως στα όρια των και. Το σύγχρονη μορφή εφαρμόζει πιο επιθετική υποδειγματοληψία χρώματος, πιο λεπτομερή κατάτμηση μπλοκ έως 4 επί 4 εικονοστοιχεία και πιο αποτελεσματικό εντροπικό κωδικοποιητή κειμένου. Το πρακτικό αποτέλεσμα, επικυρωμένο με ανάλυση σε μεγάλα σύνολα δοκιμών φωτογραφιών, είναι ότι το AVIF είναι συνήθως 20 έως 30 τοις εκατό μικρότερο από το WebP σας στην ίδια αντιληπτή ποιότητα σε φωτογραφίες. Σε γραφικά παραγόμενα από υπολογιστή με επίπεδο χρώμα και σκληρές ακμές το κενό στενεύει, επειδή ο απλούστερος αλγόριθμος του WebP χειρίζεται αυτά τα μοτίβα αποδοτικά. Για κάθε σελίδα της οποίας τα βαρύτερα στοιχεία είναι φωτογραφίες, η αναβάθμιση σε AVIF έχει μετρήσιμη επίδραση εύρους ζώνης.
Το δεύτερο απωλεστικό πέρασμα στην πράξη
Όταν μετατρέπετε ένα WebP σε AVIF, και η πηγή και η έξοδος είναι απωλεστικές. Η αποθήκευση WebP αποφάσισε ήδη ποια πληροφορία χρώματος να απορρίψει όταν δημιουργήθηκε αρχικά το WebP, και αυτές οι αποφάσεις είναι μόνιμες: η μετατροπή σε AVIF δεν μπορεί να ανακτήσει τίποτα από αυτές. Έπειτα η αποθήκευση AVIF παίρνει τις δικές της αποφάσεις για τα δεδομένα εικονοστοιχείων που λαμβάνει, στην ποιότητα 85. Για φωτογραφίες, η συνδυασμένη επίδραση δύο απωλεστικών περασμάτων παραμένει οπτικά σχεδόν χωρίς απώλειες σε τυπικά μεγέθη προβολής, μετρώντας γύρω στα σε πραγματικό φωτογραφικό περιεχόμενο. Για γραφικά ήδη υποβαθμισμένα από την αποθήκευση WebP τους, το δεύτερο πέρασμα μπορεί να συσσωρεύσει ορατά τεχνουργήματα. Ο πρακτικός κανόνας: αν το αρχικό WebP φαίνεται καθαρό στο μέγεθος που σκοπεύετε να το εμφανίσετε, το AVIF επίσης θα φαίνεται. Αν το WebP δείχνει ήδη θόρυβο συμπίεσης, εξετάστε προσεκτικά το AVIF πριν το στείλετε.
Πώς ρέει το κανάλι άλφα
Και το WebP και το AVIF κωδικοποιούν τη διαφάνεια ως ξεχωριστό επίπεδο άλφα δίπλα στα δεδομένα χρώματος. Η μετατροπή διαβάζει το κανάλι άλφα του WebP, το συνθέτει σε πλήρη διαφάνεια, μετά το παραδίδει στην αποθήκευση AVIF, που γράφει το δικό της κομμάτι άλφα χρησιμοποιώντας ενδοπλαισιακή κωδικοποίηση σύγχρονη μορφή στην ποιότητα 85. Απαλές διαβαθμίσεις διαφάνειας, απαλυμμένες ακμές και μερικώς διαφανείς περιοχές επιβιώνουν όλες αυτό το ταξίδι μετ' επιστροφής. Το επίπεδο άλφα του AVIF είναι το ίδιο απωλεστικό στην ποιότητα 85, που μπορεί να εισαγάγει μόλις αντιληπτό κροσσιασμό σε σκληρές ακμές υπό ακραίο μεγεθυντικό φακό. Σε κανονικά μεγέθη προβολής στον ιστό η διαφορά από την πηγή δεν είναι ορατή. Για εργασία ακριβείας εικονοστοιχείου σε μικρά εικονίδια όπου η ακμή άλφα πρέπει να είναι ακριβής, κρατήστε την πηγή WebP και επαληθεύστε την έξοδο σε πλήρη μεγέθυνση πριν τη στείλετε.
Προσδοκίες χρόνου αποθήκευσης σε περιηγητές και συσκευές
Η προετοιμασία AVIF προθερμαίνεται μία φορά ανά συνεδρία περιηγητή, προσθέτοντας περίπου ένα δευτερόλεπτο στην πρώτη μετατροπή. Μετά από αυτό, το Chromium δίνει την καλύτερη απόδοση: περίπου 40 χιλιοστά του δευτερολέπτου για μια μικρογραφία 0,12 megapixel, 250 χιλιοστά για μια φωτογραφία 1 megapixel, 2,8 δευτερόλεπτα για μια φωτογραφία 4K και 25 δευτερόλεπτα για μια πλήρη εικόνα 48 megapixel στη χειρότερη παρατηρημένη περίπτωση. Ο Firefox είναι η αξιοσημείωτη εξαίρεση, τρέχοντας την ίδια προετοιμασία περίπου τέσσερις φορές πιο αργά, που φέρνει την περίπτωση 4K κοντά στα 31 δευτερόλεπτα και τα μεγάλα αρχεία πέρα από δύο λεπτά. Το WebKit κάθεται ανάμεσα στα δύο, πιο κοντά στο Chromium. Το κινητό υλικό τρέχει 3 έως 5 φορές πιο αργά από την επιφάνεια εργασίας σε όλες τις μηχανές. Για συνηθισμένη μετατροπή αρχείο προς αρχείο, ο Chrome σε φορητό ή επιτραπέζιο είναι το πρακτικό εργαλείο. Για χρήστες Firefox με μεγάλες εικόνες, η ειλικρινής συμβουλή είναι να αλλάξουν περιηγητή ή να μείνουν στο WebP.
Τα Core Web Vitals και η αναβάθμιση σε AVIF
Οι σελίδες που σερβίρουν φωτογραφίες πληρώνουν κόστος εύρους ζώνης για κάθε εικόνα που φορτώνεται. Αν αυτές οι εικόνες είναι τώρα WebP, η μετατροπή τους σε AVIF κόβει τη μεταφορά ανά εικόνα κατά περίπου 20 έως 30 τοις εκατό σε φωτογραφίες. Σε μια σελίδα με εικόνα ήρωα WebP, το AVIF τη φέρνει σε περίπου noticeably smaller. Σε ένα πλέγμα προϊόντων με δώδεκα μικρογραφίες WebP των, το AVIF εξοικονομεί περίπου noticeably smaller συνολικού βάρους σελίδας. Αυτές οι οικονομίες επηρεάζουν άμεσα το Largest Contentful Paint όταν το στοιχείο LCP είναι εικόνα. Με περίπου 94 τοις εκατό παγκόσμια υποστήριξη περιηγητών για AVIF, ένα στοιχείο picture που σερβίρει AVIF πρώτα με εφεδρικό WebP καλύπτει ουσιαστικά όλη την κίνηση. Το κόστος σήμανσης πληρώνεται μία φορά ανά στοιχείο εικόνας, και η οικονομία εύρους ζώνης επαναλαμβάνεται σε κάθε επόμενη φόρτωση σελίδας.
Γιατί η μετατροπή σε AVIF στηρίζεται σε διακομιστή
Το AVIF χτίζεται πάνω στον κωδικοποιητή σύγχρονη μορφή, την ίδια οικογένεια που χρησιμοποιεί το σύγχρονο βίντεο, και είναι επίτηδες βαρύ στη δημιουργία με αντάλλαγμα συμπαγή αρχεία. Το να γίνει αυτή η δουλειά σωστά, ιδίως σε μεγάλες φωτογραφίες, είναι πολύ πιο γρήγορο και αξιόπιστο σε έναν πραγματικό διακομιστή παρά στον περιηγητή ενός τηλεφώνου, οπότε αυτό το ζευγάρι στέλνει την εικόνα στον διακομιστή μας για να φτιάξει το καλύτερο δυνατό AVIF. Το αρχείο επεξεργάζεται και το αποτέλεσμα επιστρέφει σε εσάς, και η λήψη αφαιρείται μέσα σε περίπου 2 ώρες, χωρίς προσωπικά δεδομένα και χωρίς μακρόχρονη αποθήκευση. Η μετατροπή πολλών εικόνων μαζί τρέχει πάντα στον διακομιστή, που συναρμολογεί το έτοιμο σύνολο σε μία λήψη, διαγραμμένη μέσα στον ίδιο σύντομο χρόνο. Αν ο διακομιστής μας δεν μπορεί να προσεγγιστεί, μια μεμονωμένη μετατροπή περνά στη δημιουργία μέσα στον περιηγητή, αυτό το αρχείο μένει τοπικό, δεχόμενο μια πιο αργή δημιουργία για την ευκολία. Η ανταλλαγή είναι ξεκάθαρη: ο διακομιστής αγοράζει ποιότητα και ταχύτητα στη μορφή που το χρειάζεται πιο πολύ, και το αρχείο σας δεν κρατιέται ποτέ πέρα από το σύντομο παράθυρο που παίρνει η μετατροπή.