Pengenalan WebP - Format Gambar Dari Google

Februari 22, 2019
Akhirnya gua bikin artikel bermanfaat juga buat lu.
Kali ini gua bakalan bahas sebuah format gambar, yah kurang lengkap rasanya kalo situs desain tapi tidak ngasih wejangan ahoy pada pengunjungnya.
Dan akhirnya gua putusin buat nerjemahin artikel yang sangat luar biasa ini biar lu pada tau sedikit tentang format gambar modern yang direkomendasikan Google.
Pengenalan WebP - Format Gambar Dari Google Nandur93

Sekilas tentang WebP

Apa itu WebP?

WebP adalah format gambar terbaru dari Google yang bertujuan untuk menawarkan ukuran file yang lebih rendah untuk kompresi lossless dan lossy pada kualitas visual yang dapat diterima. Ini termasuk dukungan untuk transparansi alpha-channel dan animasi.

Pada tahun lalu, WebP naik beberapa persen dari kompresi dalam mode lossy dan lossless dan kecepatan algoritma mendapat dua kali lebih cepat dengan peningkatan dekompresi 10%. WebP bukan alat untuk semua tujuan, tetapi memiliki beberapa posisi dan basis pengguna yang berkembang di komunitas kompresi gambar. Mari kita periksa alasannya.
WebP: Perbandingan ukuran file dan skor kesamaan visual pada kualitas yang berbeda.

Bagaimana kinerja WebP?

Kompresi Lossy
File WebP lossy, menggunakan varian VP8 atau VP9 key frame encoding video, rata-rata dikutip oleh tim WebP sebagai 25-34% lebih kecil dari file JPEG.

Dalam kisaran kualitas rendah (0-50), WebP memiliki keunggulan besar dibandingkan JPEG karena dapat mengaburkan artefak blokir yang jelek. Pengaturan kualitas sedang (-m 4 -q 75) adalah kecepatan keseimbangan/ukuran file secara dasar. Dalam kisaran yang lebih tinggi (80-99), keunggulan WebP menyusut. WebP direkomendasikan jika kecepatan lebih penting daripada kualitas.

Kompresi lossless
File lossless WebP adalah 26% lebih kecil dari file PNG. Penurunan waktu muat lossless dibandingkan dengan PNG adalah 3%. Karena itu, Anda umumnya tidak ingin memberikan pengguna Anda lossless di web. Ada perbedaan antara lossless dan ketajaman tepi (mis. Non-JPEG). Lossless WebP mungkin lebih cocok untuk konten arsip.

Transparansi
WebP memiliki saluran transparansi 8-bit lossless dengan hanya 22% lebih banyak byte daripada PNG. Ini juga mendukung transparansi RGB lossy, yang merupakan fitur unik untuk WebP.

Metadata
Format file WebP mendukung metadata foto EXIF ​​dan metadata dokumen digital XMP. Ini juga berisi Profil Warna ICC.

WebP menawarkan kompresi yang lebih baik dengan biaya yang lebih intensif CPU. Kembali pada tahun 2013, kecepatan kompresi WebP ~ 10x lebih lambat dari JPEG tetapi sekarang diabaikan (beberapa gambar mungkin 2x lebih lambat). Untuk gambar statis yang diproses sebagai bagian dari build Anda, ini seharusnya tidak menjadi masalah besar. Gambar yang dihasilkan secara dinamis kemungkinan akan menyebabkan overhead CPU yang dapat dilihat dan akan menjadi sesuatu yang perlu Anda evaluasi.

⋆ Catatan: Pengaturan kualitas lossy WebP tidak secara langsung sebanding dengan JPEG. JPEG pada ‘kulitas 70%’ akan sangat berbeda dengan gambar WebP pada ‘kualitas 70%’ karena WebP mencapai ukuran file yang lebih kecil dengan membuang lebih banyak data.

Siapa yang menggunakan WebP?

Banyak perusahaan besar menggunakan WebP dalam produksi untuk mengurangi biaya dan mengurangi waktu pemuatan halaman web.

Google melaporkan penghematan 30-35% menggunakan WebP dibandingkan skema kompresi lossy lainnya, melayani 43 miliar permintaan gambar per hari, 26% di antaranya adalah kompresi lossless. Itu adalah jumlah permintaan yang sangat banyak dan penghematan yang signifikan. Penghematan tidak diragukan lagi akan lebih besar jika dukungan browser lebih baik dan lebih luas. Google juga menggunakannya di situs produksi seperti Google Play dan YouTube.

Netflix, Amazon, Quora, Yahoo, Walmart, Ebay, The Guardian, Fortune dan USA Today, semua kompres dan melayani gambar dengan WebP untuk browser yang mendukungnya. VoxMedia mengurangi waktu muat 1-3 kali untuk The Verge dengan beralih ke WebP untuk pengguna Chrome mereka. 500px melihat pengurangan rata-rata 25% dalam ukuran file gambar dengan kualitas gambar yang sama atau lebih baik ketika beralih untuk menyajikannya kepada pengguna Chrome mereka.

Ada beberapa perusahaan lebih banyak daripada daftar sampel yang ditunjukkan ini.
Penggunaan WebP di Google: 43 miliar permintaan gambar WebP sehari dilayani di YouTube, Google Play, Chrome Data Saver dan G+.

Bagaimana cara kerja pengkodean WebP?

Pengkodean WebP lossy dirancang untuk bersaing dengan JPEG untuk gambar foto. Ada tiga fase kunci untuk pengkodean lossy WebP:

Macro-blocking - memecah gambar menjadi 16×16 (makro) blok piksel luma dan dua 8×8 blok piksel kroma. Ini mungkin terdengar akrab dengan gagasan JPEG melakukan konversi ruang warna, pengambilan sample saluran kroma dan pembagian gambar.

Prediksi - setiap blok 4×4 dari blok makro memiliki model prediksi yang diterapkan yang secara efektif melakukan penyaringan. Ini mendefinisikan dua set piksel di sekitar blok - A (baris tepat di atasnya) dan L (kolom di sebelah kiri itu). Dengan menggunakan kedua enkoder ini mengisi blok uji dengan 4×4 piksel dan menentukan yang menciptakan nilai paling dekat dengan blok asli.

Discrete Cosine Transform (DCT) diterapkan dengan beberapa langkah yang mirip dengan pengkodean JPEG. Perbedaan utama adalah penggunaan Kompresor Aritmatika vs Huffman JPEG.

Jika Anda ingin menggali lebih dalam, artikel Teknik Kompresi WebP Pengembang Google membahas topik ini secara mendalam.

Dukungan browser terhadap WebP

Tidak semua browser mendukung WebP, namun menurut CanIUse.com, dukungan pengguna global sekitar 74%. Chrome dan Opera mendukungnya secara native. Safari, Edge, dan Firefox sudah bereksperimen namun belum menyatakan secara resmi kapan bisa mendukung WebP. Inilah yang membuat beberapa pengembang web masih mengurungkan niatnya untuk beralih ke WebP.

Inilah daftar browser yang yang sudah dan belum mendukung WebP:
  • Chrome: Chrome sudah mendukung sejak versi 23
  • Chrome untuk Android: Sejak Chrome 50
  • Android: Sejak Android 4.2
  • Opera: Sejak 12.1
  • Opera Mini: Semua versi
  • Firefox: Hanya beberapa versi beta yang mendukung
  • Edge: Hanya beberapa versi beta yang mendukung
  • Internet Explorer: Tidak mendukung
  • Safari: Hanya beberapa versi beta yang mendukung
WebP bukan tanpa kelemahan. WebP tidak memiliki opsi ruang warna resolusi penuh dan tidak mendukung decoding progresif. Itu artinya, alat pendukung untuk WebP sangat diperlukan dan juga dukungan browser, sementara terbatas pada Chrome dan Opera pada saat ini, mungkin belum cukup mencakup pengguna Anda sehingga penggunaan WebP masih layak dipertimbangkan.

Sumber:
Sites: Images Guide
An eBook by Addy Osmani
Translated by Google kemudian kata-katanya di improvisasi

Artikel Terkait

Next Article
« Prev Post
Previous Article
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline gunakan <u></u>.
  • Untuk menulis huruf strikethrought gunakan <strike></strike>.
  • Untuk menulis kode HTML gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silakan parse kode pada kotak parser di bawah ini.

Disqus
Tambahkan komentar Anda

Tidak ada komentar

Pikirkanlah sesuka hatimu namun tulislah komentar sesuai yang seharusnya anda tulis

Featured Post

Kumpulan Editan Photoshop Jadul

Featured Post Nandur93