Eksperimen asli dan kondisi reproduksi
Aslinya adalah gambar contoh produk buatan AI yang disediakan oleh Moyoutil. Ini bukan hasil jepretan kamera asli. PNG, 1254×1254 piksel, 1.611.701 byte, tidak ada area transparan. Saya mengkodekannya ulang dengan toBlob di browser Canvas tanpa mengubah ukurannya. Nilai kualitas 60, 80, dan 90 masing-masing dimasukkan untuk JPEG dan WebP, dan tidak ada nilai kualitas yang diterapkan ke PNG.
Sumber ini disediakan sebagai contoh komparatif. Itu tidak mentransfer file pengguna dan eksekusi di bawah ini menghitung ulang file tersebut di browser saat ini. Jika nilainya berbeda dari tabel yang disimpan, periksa juga perbedaan encoder browser.
Jumlah byte yang diukur dan interpretasi hasil
| Formatnya | Masukkan kualitas | Byte sebenarnya |
|---|---|---|
| PNG | Tidak berlaku | 2476565 |
| JPEG | 60 | 33329 |
| JPEG | 80 | 62518 |
| JPEG | 90 | 120497 |
| WEBP | 60 | 13816 |
| WEBP | 80 | 24234 |
| WEBP | 90 | 67034 |
Untuk masukan ini, WebP lebih kecil dari JPEG pada angka kualitas yang sama, namun ini bukan perbandingan yang mengukur kualitas yang sama. Angka kualitas tidak memiliki arti yang sama di setiap format, dan hasilnya berbeda-beda tergantung konten gambar. Perbedaan visual memerlukan perbandingan langsung dengan memperbesar file yang dihasilkan dengan perbesaran yang sama.
Penyimpanan ulang PNG lebih besar dari aslinya yaitu 2.476.565 byte. Menyimpan sebagai PNG tidak selalu memperkecil ukurannya. Pengukuran ini mencatat ukuran file dan bukan merupakan eksperimen yang mengevaluasi superioritas atau inferioritas universal algoritma kompresi, akurasi warna, atau skor kualitas yang dirasakan.
Jalankan lagi di browser saya dan bandingkan dalam skala besar
Coba jalankan secara langsung tanpa file
Menjalankan kode pemrosesan alat sebenarnya dengan materi contoh yang dibuat oleh situs. Hasil saat ini dihitung di browser dan tidak ada data masukan yang diunggah ke server.
akan menampilkan hasil dan file contoh.
Contohnya bukanlah data atau kinerja pengunjung sebenarnya. Ukuran file dan bentuk font dapat bervariasi tergantung pada browser, perangkat, dan font.
Buka perbandingan close-up gambar yang dihasilkan, memungkinkan Anda menelusuri gambar pada ukuran piksel sebenarnya. Bandingkan tepi pemandangan yang sama dengan area yang kecerahannya sedikit berubah. File unduhan akan berisi hasil yang dikodekan dalam format yang Anda pilih. Semua ukuran asli sama, jangan berasumsi perbedaan kualitas berdasarkan pratinjau kecil.
Catatan tindakan API: MDN Canvas toBlob. Moyoutil memeriksa jenis MIME dari blob yang dikembalikan, karena format yang tidak didukung mungkin kembali ke PNG.
Pertanyaan yang Sering Diajukan
Apakah kualitasnya 90 90% dari kualitas aslinya?
Tidak. Ini adalah nilai pengaturan yang diteruskan ke pembuat enkode browser. Bukan berarti JPEG dan WebP dengan nomor yang sama memiliki kualitas yang sama.
Jika saya mengubah ke PNG, apakah JPEG yang lama akan hilang?
Tidak. Ini bukan fitur yang mengembalikan detail yang telah hilang. Keluaran PNG mungkin lebih besar dari aslinya.