Kompresor Gambar

Cara kerjanya

Alat ini menggambar gambar Anda ke sebuah <canvas> HTML dan mengenkodenya ulang dengan enkoder gambar bawaan browser. Untuk JPEG dan WebP, slider kualitas menentukan seberapa agresif detail dibuang — kualitas lebih rendah berarti file lebih kecil. PNG bersifat lossless, jadi slider tidak berpengaruh padanya; Anda memperkecil PNG dengan mengubah ukurannya atau menggantinya ke WebP. Karena seluruh proses terjadi di browser Anda, gambar tidak pernah dikirim ke mana pun, dan proses enkode ulang menghapus metadata EXIF/GPS sebagai efek samping.

JPEG vs WebP vs PNG

Tips untuk gambar lebih kecil

• Ubah ukuran dulu. Foto langsung dari ponsel bisa selebar 4000 px; sebagian besar penggunaan web dan sosial tidak pernah membutuhkan lebih dari 1600–2048 px. Memangkas lebar menjadi setengah kira-kira memangkas file menjadi seperempat.
• Kualitas 70–85 biasanya tidak dapat dibedakan dari aslinya untuk foto, sementara ukurannya berkurang drastis.
• Pilih WebP untuk web — biasanya 25–35% lebih kecil daripada JPEG pada kualitas visual yang sama dan setiap browser saat ini mendukungnya.
• Pertahankan PNG untuk grafik yang memiliki tepi tajam, teks, atau transparansi; konversikan foto keluar dari PNG, format yang memang tidak pernah dimaksudkan untuknya.

Yang perlu diketahui

• Jika file "terkompres" ternyata lebih besar daripada aslinya — umum saat menyimpan ulang JPEG yang sudah dioptimalkan pada kualitas tinggi — pertahankan file asli Anda; alat ini akan memberi tahu.
• GIF beranimasi dan WebP beranimasi diratakan menjadi frame pertamanya (canvas menangkap satu frame saja).
• File asli Anda tidak pernah diubah; Anda selalu mengunduh salinan baru.

Lossy vs lossless: dua tawar-menawar berbeda

Setiap format gambar membuat salah satu dari dua janji. Format lossless (PNG, GIF, atau WebP dalam mode lossless) menjamin bahwa file yang Anda dekode identik dengan aslinya, piksel demi piksel — ia hanya menghemat ruang dengan mendeskripsikan piksel yang ada secara lebih ringkas. Format lossy (JPEG, serta WebP atau AVIF dalam mode biasanya) diizinkan membuang informasi yang kemungkinan tidak disadari mata, yang menghasilkan file jauh lebih kecil dengan mengorbankan sedikit ketepatan. Satu perbedaan itu menjelaskan hampir semua hal tentang mengapa kompresi berperilaku seperti itu: slider kualitas hanya berpengaruh pada format lossy, karena hanya format lossy yang memiliki detail yang boleh dibuang. Jalankan sebuah JPEG pada kualitas 60 dan Anda mendapat file jauh lebih kecil; lakukan hal yang sama pada PNG dan tidak terjadi apa-apa pada slider, karena PNG tidak punya detail yang boleh dibuang.

Tawar-menawar ini juga tidak linear. Format lossy dapat membuang 60–70% pertama dari ukuran file sebuah foto dengan perubahan yang benar-benar tak terlihat pada jarak pandang normal, lalu mulai menunjukkan kerusakan yang tampak — tepi lembut, teks kabur, langit yang memblok — saat Anda melewati titik di mana hanya informasi bermakna yang tersisa untuk dibuang. Seni kompresi adalah menemukan lekukan pada kurva itu, itulah sebabnya alat ini menunjukkan ukuran sebelum/sesudah dan pratinjau langsung alih-alih sekadar menerapkan setelan tetap.

Di dalam sebuah JPEG: apa yang sebenarnya diubah oleh slider kualitas

JPEG (dinamai dari Joint Photographic Experts Group yang menstandarkannya pada tahun 1992) dibangun di seputar cara kerja penglihatan manusia yang sebenarnya, dan memahami empat tahapnya membuat slider kualitas jauh lebih tidak misterius.

• Konversi warna. Gambar dikonversi dari RGB ke YCbCr — satu kanal kecerahan (Y, luma) dan dua kanal selisih-warna (Cb dan Cr, chroma). Mata jauh lebih peka terhadap kecerahan daripada warna, sehingga memisahkannya memungkinkan enkoder menangani warna secara lebih kasar.
• Chroma subsampling. Kebanyakan JPEG menyimpan kedua kanal warna pada setengah resolusi di setiap arah (disebut 4:2:0), yang langsung memangkas data warna sekitar 50% dengan nyaris tanpa efek yang terlihat pada foto — meski itulah tepatnya mengapa teks merah halus atau tepi jenuh bisa tampak berumbai pada JPEG yang dikompres berat.
• DCT. Setiap kanal dibagi menjadi blok piksel 8×8, dan sebuah Discrete Cosine Transform mengubah setiap blok dari piksel menjadi sekumpulan koefisien frekuensi — beberapa yang menggambarkan nada luas dan banyak yang menggambarkan detail halus.
• Kuantisasi. Inilah satu-satunya tahap yang lossy secara tak-terpulihkan. Setiap koefisien dibagi dengan sebuah nilai dari tabel kuantisasi lalu dibulatkan, yang menolkan sebagian besar koefisien detail-halus. Slider kualitas sekadar menskalakan tabel itu: kualitas lebih rendah berarti pembagian lebih kasar, lebih banyak nol, file lebih kecil — dan, pada akhirnya, "blocking" 8×8 yang terlihat, yang merupakan artefak khas JPEG.

Jadi ketika Anda menurunkan kontrol kualitas alat ini, Anda menyuruh enkoder JPEG browser untuk mengkuantisasi lebih agresif. Di sekitar 70–85 pembulatan tetap di bawah ambang persepsi untuk sebagian besar foto; di bawah sekitar 50 struktur blok dan umbai warna mulai tampak. Ini juga sebabnya mengompres ulang JPEG yang sudah dikompres itu sia-sia: detailnya sudah dibuang pada kali pertama, jadi lintasan kedua sebagian besar hanya menambahkan galat pembulatan baru ke gambar yang sudah menurun. Kompres dari aslinya bila memungkinkan.

WebP dan AVIF: alternatif modern

WebP, yang dirilis Google pada tahun 2010, meminjam predictive coding yang digunakan oleh codec video VP8: alih-alih mengompres setiap blok secara terisolasi, ia memprediksi sebuah blok dari tetangganya dan hanya menyimpan selisihnya. Studi Google sendiri mengukur file lossy WebP sekitar 25–34% lebih kecil daripada JPEG pada kualitas visual setara, dan file lossless WebP sekitar 26% lebih kecil daripada PNG. Ia juga mendukung transparansi dan animasi, yang tak pernah bisa dilakukan JPEG. Setiap browser saat ini telah mendukungnya selama bertahun-tahun (Chrome sejak 2010, Firefox 65, dan Safari 14 pada 2020), sehingga untuk sebagian besar pekerjaan web WebP adalah default yang masuk akal yang ditawarkan alat ini.

AVIF melangkah lebih jauh. Dibangun di atas codec video AV1 yang bebas-royalti di dalam container HEIF yang sama yang digunakan Apple untuk foto iPhone, ia umumnya mencapai sekitar 50% lebih kecil daripada JPEG dan mengungguli WebP baik pada ukuran file maupun kedalaman warna. Dukungan kini luas (Chrome 85, Firefox 93, Safari 16), meski enkode AVIF lebih lambat dan dukungan browser-canvas untuk menulis AVIF masih belum merata — itulah sebabnya alat ini berpegang pada JPEG, WebP, dan PNG, tiga format yang bisa dibaca dan dienkode ulang setiap browser secara andal.

Mengapa PNG nyaris tak menyusut di sini — dan cara benar-benar mengompres satu

PNG, yang difinalisasi oleh W3C pada tahun 1996 sebagai pengganti GIF yang bebas-paten, bersifat lossless secara desain. Ia bekerja dalam dua tahap: setiap baris piksel terlebih dulu difilter (salah satu dari lima prediktor — None, Sub, Up, Average, atau filter Paeth yang cerdik — mengganti setiap piksel dengan selisih kecil dari tetangganya), lalu data yang difilter dikompres dengan DEFLATE, algoritme LZ77-plus-Huffman yang sama yang digunakan di dalam file ZIP. Karena ia tak pernah membuang detail, menyimpan ulang PNG pada ukuran yang sama melalui canvas browser hampir tak pernah memperkecilnya — enkoder ulang canvas tak bisa menandingi pilihan filter per-baris yang cermat dan kuantisasi palette yang digunakan pengoptimal PNG khusus (seperti pngquant atau OxiPNG).

Jadi jika sebuah PNG terlalu besar, Anda punya tiga langkah bagus: ubah ukurannya lebih kecil (lebih sedikit piksel adalah satu-satunya hal yang selalu memperkecil PNG); konversikan sebuah foto keluar dari PNG ke JPEG atau WebP, karena PNG dirancang untuk grafik datar, logo, dan tangkapan layar, bukan foto; atau pertahankan PNG hanya di tempat Anda benar-benar membutuhkan tepi lossless, teks tajam, atau transparansi. Untuk tangkapan layar sebuah halaman web, WebP-lossless atau PNG yang diubah ukuran biasanya jawaban yang tepat; untuk foto mirip-JPEG yang disimpan sebagai PNG, mengganti format dapat memangkas file 80% atau lebih.

Kompresi, kecepatan halaman, dan Core Web Vitals

Gambar biasanya bagian terberat dari sebuah halaman web, sehingga mengompresnya adalah salah satu hal paling berdaya-ungkit yang bisa Anda lakukan untuk kinerja. Gambar yang lebih kecil terunduh lebih cepat, yang secara langsung memperbaiki Largest Contentful Paint (LCP) — metrik Core Web Vitals yang mengukur seberapa cepat konten utama muncul, dan yang digunakan Google sebagai sinyal peringkat. Pada koneksi seluler dan paket data terbatas, perbedaan antara foto ponsel 3 MB dan versi siap-web 200 KB adalah perbedaan antara halaman yang terasa instan dan halaman yang terlihat memuat perlahan.

Dua kebiasaan melipatgandakan manfaatnya. Pertama, ubah ukuran sebelum Anda mengompres: foto langsung dari ponsel bisa selebar 4000 px, tetapi hero web lebar-penuh jarang membutuhkan lebih dari 1600–2048 px, dan memangkas lebar menjadi setengah kira-kira memangkas jumlah piksel menjadi seperempat. Kedua, sajikan gambar pada ukuran yang benar-benar ditampilkan — mengenkode lebih banyak piksel daripada yang ditunjukkan tata letak adalah pemborosan murni. Kontrol "lebar maks" alat ini memungkinkan Anda melakukan keduanya dalam satu lintasan — mendekode aslinya, memperkecilnya, dan mengenkode ulang pada kualitas yang Anda pilih.

Mengapa melakukannya di browser Anda itu penting

Kebanyakan "kompresor gambar gratis" mengunggah foto Anda ke server, memprosesnya di sana, dan mengirimkan hasilnya kembali — yang berarti foto Anda, apa pun isinya, sejenak berada di mesin orang lain. Alat ini tak pernah melakukan itu. Ia mendekode gambar dengan createImageBitmap() bawaan browser, menggambarnya ke <canvas> di luar-layar, dan mengenkodenya ulang dengan enkoder canvas.toBlob() asli browser, sepenuhnya di perangkat Anda. Tidak ada yang diunggah, tidak ada yang dicatat, dan ia tetap bekerja offline setelah halaman dimuat.

Ada bonus privasi yang tertanam dalam cara kerja canvas. Sebuah foto kamera membawa blok metadata EXIF — model kamera, tanggal dan waktu persisnya, dan sering kali koordinat GPS tempat foto diambil. Mengenkode ulang melalui canvas menghasilkan gambar bersih tanpa blok EXIF sama sekali, sehingga data itu terhapus otomatis setiap kali Anda mengompres. Itu ideal ketika Anda hendak memposting foto secara publik, dan alasan untuk menyimpan file asli Anda dengan aman jika Anda pernah membutuhkan metadata itu kembali.

Memilih setelan kualitas untuk pekerjaan umum

Tidak ada satu kualitas "yang benar" — bergantung pada bagaimana gambar akan dilihat. Sebagai titik awal untuk slider JPEG/WebP:

Apa pun yang Anda pilih, percayai pratinjau langsung dan angka sebelum/sesudah ketimbang aturan tetap — langit biru datar dan pemandangan kota yang mendetail berperilaku sangat berbeda pada nilai kualitas yang sama.

Pertanyaan yang sering diajukan

Apakah gambar saya diunggah ke server?

Tidak. Gambar didekode dan dienkode ulang sepenuhnya di browser Anda menggunakan Canvas API bawaan — gambar tidak pernah meninggalkan perangkat Anda dan tidak pernah dicatat atau dikirim. Ini juga berfungsi offline setelah halaman dimuat, itulah sebabnya aman untuk mengompres foto pribadi, tangkapan layar, atau hasil pindai.

Apakah mengompres menurunkan kualitas gambar?

Untuk JPEG dan WebP, ya — keduanya lossy, jadi setelan kualitas yang lebih rendah membuang lebih banyak detail agar file lebih kecil. Sekitar 70–85 biasanya tidak dapat dibedakan dari aslinya untuk foto. PNG bersifat lossless, sehingga mengenkode ulang tidak pernah menurunkan kualitas; untuk memperkecil PNG Anda mengubah ukuran dimensinya atau menggantinya ke WebP.

Format mana yang harus saya pilih untuk web?

WebP memberikan file terkecil untuk foto maupun grafik dan didukung oleh setiap browser saat ini, sehingga menjadi default terbaik untuk web. Gunakan JPEG untuk foto saat Anda membutuhkan kompatibilitas maksimal, dan PNG hanya bila Anda membutuhkan kualitas lossless atau transparansi.

Mengapa PNG saya yang sudah dikompres tidak menjadi lebih kecil?

PNG sudah lossless dan enkoder ulang canvas tidak dapat menerapkan trik palette/kuantisasi yang digunakan oleh pengoptimal PNG khusus, jadi menyimpan ulang PNG pada dimensi yang sama jarang memperkecilnya. Untuk memperkecil PNG, turunkan lebar maksimum "Ubah ukuran", atau konversikan ke JPEG (jika tidak ada transparansi) atau WebP — keduanya akan jauh lebih kecil.

Apakah ada batas ukuran file atau resolusi?

Tidak ada batas tetap, tetapi semuanya terjadi di tab browser Anda, sehingga gambar yang sangat besar (puluhan megapiksel) menggunakan lebih banyak memori dan butuh sesaat untuk diproses. Jika gambar besar terasa lambat, setel lebar maksimum "Ubah ukuran" — sebagian besar penggunaan web dan sosial tidak pernah membutuhkan lebih dari 1600–2048 px.

Apakah ini menghapus metadata EXIF / GPS dari foto saya?

Ya. Mengenkode ulang melalui canvas menghasilkan gambar bersih tanpa blok EXIF, sehingga model kamera, tanggal, dan lokasi GPS terhapus otomatis. Itu merupakan bonus privasi saat berbagi foto — meskipun berarti Anda sebaiknya menyimpan file asli jika ingin mempertahankan metadata tersebut.

Alat terkait

• Kompres Gambar ke Ukuran (KB)
• Pengubah Ukuran Gambar
• Konverter HEIC ke JPG
• Gambar ke PDF

Lihat semua alat browser →