Nota daripada pasukan tentang kraf, format, dan keputusan kecil di sebalik hasil yang baik.
Bagaimana WebP mencapai saiz lebih kecil daripada PNG
WebP menggunakan dua mod pemampatan yang berbeza. Mod lossless menggabungkan ramalan spatial dan warna dengan peringkat pengekodan entropi yang lebih canggih daripada DEFLATE PNG, mencapai nisbah pemampatan kira-kira 26 peratus lebih baik pada imej biasa menurut tanda aras yang diterbitkan Google. Mod lossy menerapkan transformasi berasaskan blok yang serupa dengan pemampatan video, direka untuk membuang maklumat yang tidak relevan dari segi persepsi sambil mengekalkan apa yang sebenarnya dilihat mata. Untuk imej dengan saluran alfa, WebP menggunakan sub-pemampatan lossless berasingan bagi data alfa sambil menerapkan pemampatan lossy pada data RGB, itulah sebabnya WebP lossy berketelusan boleh menjadi kira-kira tiga kali lebih kecil daripada PNG pada kualiti visual setara. DEFLATE PNG hanya lossless dan tidak boleh memanfaatkan tukar ganti persepsi yang dieksploitasi oleh mod lossy. Perbezaan format itulah yang menjelaskan jurang ini.
Saluran alfa secara terperinci
Kedua-dua PNG dan WebP menyokong ketelusan alfa 8 bit, bermakna setiap piksel boleh memegang nilai kelegapan dari 0 (lutsinar penuh) hingga 255 (legap penuh). Apabila enjin imej platform menyimpan semula PNG sebagai WebP, ia membaca nilai RGBA setiap piksel dan menyalurkan nilai alfa terus ke langkah pemampatan WebP, di mana nilai itu dikekalkan dengan pemampatan lossless tanpa mengira cara data RGB dikodkan. Hasilnya, setiap piksel lutsinar dalam PNG pada alfa 0, setiap piksel separa lutsinar antara 1 dan 254, dan setiap piksel legap pada 255 dipetakan kepada keadaan yang sama persis dalam WebP. Untuk logo dengan bayang jatuh lembut atau teks beranti-alias pada latar lutsinar, kehalusan tepi kekal utuh. Ini berbeza dengan JPG, yang tiada medan alfa dalam spesifikasi bekasnya dan terpaksa menggabungkan imej terhadap satu warna latar sebelum mengekod.
Core Web Vitals dan pilihan format imej
Largest Contentful Paint mengukur berapa lama elemen kelihatan terbesar pada halaman mengambil masa untuk muncul dalam port pandangan. Bagi kebanyakan halaman kandungan, elemen itu ialah imej hero, dan Google menggunakan LCP sebagai isyarat kedudukan dalam penilaian Core Web Vitalnya. Imej PNG ialah punca kegagalan LCP yang konsisten kerana saiz failnya, kerana PNG fotografik pada resolusi 4K boleh memberat beberapa megabait sedangkan WebP setara pada kualiti hampir lossless biasanya hanya sebahagian kecil daripada itu. PageSpeed Insights menanda perkara ini secara khusus dalam item audit menyajikan imej dalam format generasi baharu, menyenaraikan PNG sebagai format sasaran untuk diganti. Menukar PNG yang muncul dalam laluan render kritikal kepada WebP ialah salah satu perubahan tunggal berdaya ungkit tertinggi untuk memperbaik prestasi halaman yang diukur. Garis masa sokongan pelayar menjadikannya selamat, dengan Chrome menambah WebP pada 2011, Firefox pada 2019, Safari pada 2020, dan Edge sejak pembinaan semula Chromiumnya.
Output lossy dan tetapan hampir lossless
Penukaran WebP menawarkan parameter kualiti dari 0 hingga 100, di mana nilai lebih tinggi mengekalkan lebih banyak perincian dengan kos fail yang lebih besar. Alat ini menyimpan pada tetapan hampir lossless tetap yang ditala untuk mengimbangi kesetiaan visual dengan saiz fail bagi kategori aset web biasa iaitu foto, grafik antara muka dan ikon. Pada tetapan ini, output tidak dapat dibezakan dari segi persepsi daripada PNG sumber pada jarak tontonan skrin biasa. Secara teknikal, sedikit kejituan peringkat bit hilang berbanding kodan lossless sebenar, bermakna perbandingan peringkat bait antara piksel WebP yang dinyahkod dengan piksel PNG asal akan menunjukkan perbezaan berangka yang kecil. Perbezaan ini berada di bawah ambang persepsi manusia bagi kandungan fotografik. Untuk pengimejan perubatan, fotografi satelit, atau pemeliharaan digital arkib, di mana kesetiaan lossless ialah keperluan tegas, pendekatan betul ialah menyimpan PNG dan menggunakan WebP hanya sebagai eksport penyampaian, bukan salinan kerja.
Kelakuan metadata
Saluran yang digunakan untuk penukaran PNG ke WebP mengupas metadata EXIF, IPTC dan XMP daripada output. Ini sepadan dengan kelakuan yang diperhatikan merentas ketiga-tiga enjin pelayar utama. Profil warna ICC dikendalikan secara tidak konsisten, di mana Chrome dan Safari mengekalkan teg profil ICC sRGB dalam output WebP manakala Firefox mengupas semua metadata termasuk profil ICC. Hasil bersihnya ialah WebP yang ditukar adalah selamat sRGB merentas pelayar, tetapi sebarang penandaan gamut luas seperti Display-P3, Adobe RGB atau ProPhoto RGB yang hadir dalam PNG sumber tidak akan bertahan dalam Firefox. Untuk aliran kerja profesional yang kritikal warna, ketidakkonsistenan ini penting, jadi jika output akhir memerlukan kesetiaan profil warna, tukar dengan alat yang menulis data ICC secara jelas, atau terapkan teg profil sebagai langkah pasca pemprosesan menggunakan penyunting metadata imej yang khusus.
Bila mengekalkan PNG dan bila WebP memadai
Pokok keputusan praktikalnya pendek. Jika destinasi akhir imej ialah halaman web atau aplikasi web, dan persekitaran render ialah mana-mana pelayar dari 2020 ke atas, WebP ialah format eksport yang tepat. Jika imej perlu dibuka dalam aplikasi reka bentuk seperti Figma, Sketch atau Affinity Designer, sahkan sokongan WebP dalam versi khusus yang anda guna, kerana sokongan berbeza. Jika imej akan digunakan dalam aliran kerja cetakan, PNG atau TIFF lebih diutamakan kerana kebanyakan RIP cetakan tidak mengendalikan WebP. Jika imej akan dihantar melalui e-mel, PNG lebih selamat kerana klien e-mel terkenal tidak konsisten dengan format moden. Jika imej akan digunakan sebagai fail kerja yang disunting dan disimpan semula berkali-kali, simpan PNG sebagai induk. WebP pada kualiti hampir lossless ialah format penyampaian yang sangat baik, manakala PNG ialah format yang lebih baik untuk pengarkiban dan penyuntingan. Aliran kerja ideal menyimpan PNG sebagai asal dan mengeksport ke WebP untuk penyampaian web.
