Kompresor Aset React Native

• Pembuatan varian @1x @2x @3x instan: buat ketiga varian densitas React Native dari satu gambar sumber dalam hitungan detik - sepenuhnya di browser. Kompresor mengecilkan sumber @3x Anda ke @2x dan @1x memakai interpolasi Canvas berkualitas tinggi, tanpa unggah ke server dan tanpa menunggu.
• Kompresor aset React Native online yang aman: gambar Anda tidak pernah keluar dari perangkat. Kompresor berjalan sepenuhnya di browser - tanpa unggahan ke server, tanpa transmisi data, dan 100 % privat. Aman untuk ikon app proprietary, splash screen, dan aset React Native produksi.
• Proses beberapa gambar sekaligus: unggah beberapa gambar secara bersamaan dan buat varian densitas untuk semuanya dalam satu proses. Semua file keluaran dikemas menjadi arsip ZIP siap pakai dengan konvensi penamaan React Native yang benar - image.png, [email protected], [email protected].
• 100 % gratis selamanya: kompresor aset React Native sepenuhnya gratis, tanpa pendaftaran, tanpa paket premium, tanpa batas ukuran file, dan tanpa iklan. Buat varian densitas aset React Native tanpa batas dengan biaya nol, selamanya.

• Pembuatan ikon app untuk semua densitas layar: buat varian @1x, @2x, dan @3x ikon app React Native Anda dalam satu langkah. Kompresor memastikan ikon Anda terlihat tajam di setiap perangkat - dari layar Android berdensitas rendah hingga layar Retina iPhone berdensitas tinggi - tanpa mengubah ukuran manual di Photoshop atau Figma.
• Optimalisasi splash screen dan gambar onboarding: kompres dan ubah ukuran splash screen serta ilustrasi onboarding ke ketiga varian densitas. Kompresor memperkecil ukuran file sekaligus menjaga kualitas visual, membantu app Anda dimuat lebih cepat dan memperkecil ukuran bundel total untuk pengiriman ke App Store dan Play Store.
• Persiapan aset UI dan ilustrasi: siapkan ilustrasi UI, gambar latar, dan aset dekoratif untuk layar React Native. Kompresor menghasilkan varian densitas yang diberi nama dengan benar dan otomatis dipilih React Native saat runtime - tanpa perubahan kode, cukup letakkan file di direktori aset Anda.
• Proyek Expo dan React Native CLI: berfungsi lancar dengan Expo maupun proyek React Native CLI murni. Kompresor menghasilkan file mengikuti konvensi penamaan standar React Native (image.png, [email protected], [email protected]) yang dikenali otomatis oleh Expo maupun bundler Metro.
• Serah terima desain dan ekspor aset: ubah ekspor desain dari Figma, Sketch, atau Adobe XD menjadi varian densitas siap React Native. Kompresor menerima ekspor PNG, JPEG, atau WebP apa pun dan menghasilkan ketiga file densitas dalam ZIP - siap diserahkan ke developer atau langsung dimasukkan ke proyek.
• Persiapan pengiriman ke App Store dan Play Store: kurangi ukuran bundel app React Native Anda sebelum dikirim ke App Store dan Play Store dengan mengompres semua aset gambar. Kompresor menerapkan kompresi kualitas pada setiap varian densitas, membantu Anda memenuhi batas ukuran dan memperbaiki tingkat konversi unduhan.

React Native memakai sistem densitas piksel untuk menyajikan resolusi gambar yang tepat di setiap layar. Tiga densitas standarnya adalah @1x (resolusi basis, ~1 piksel CSS = 1 piksel perangkat), @2x (Retina / high-DPI standar, 2 piksel perangkat per piksel CSS), dan @3x (layar iPhone dan Android unggulan berdensitas tinggi, 3 piksel perangkat per piksel CSS). Saat Anda merujuk gambar dengan require('./image.png'), React Native otomatis memilih varian densitas yang benar saat runtime berdasarkan densitas layar perangkat. Kompresor aset React Native kami membuat ketiga varian dari satu gambar sumber, dengan penamaan yang benar dan sudah dikompresi.

1. 1 Unggah gambar sumber Anda: seret dan lepas gambar PNG, JPEG, WebP, GIF, atau BMP. Gunakan aset resolusi tertinggi Anda sebagai sumber - idealnya versi @3x atau ekspor desain 3× ukuran tampilan yang diinginkan. File dimuat ke browser Anda - tidak ada data yang dikirim ke server mana pun.
2. 2 Pilih format keluaran, kualitas, dan varian densitas: pilih PNG (disarankan untuk ikon dan aset bertransparansi) atau JPEG (lebih kecil untuk foto). Pilih kualitas JPEG jika berlaku. Pilih varian densitas yang ingin dibuat - ketiganya, hanya @2x dan @3x, atau hanya @3x. Pemrosesan berjalan sepenuhnya di browser memakai Canvas API.
3. 3 Unduh dan tambahkan ke proyek Anda: semua varian densitas dikemas menjadi arsip ZIP. Ekstrak dan letakkan ketiga file di direktori yang sama dalam proyek React Native Anda. Rujuk aset dengan require('./image.png') - React Native menangani sisanya secara otomatis.

• Varian @1x (image.png): resolusi basis - sepertiga dari dimensi gambar sumber. Dipakai pada layar berdensitas rendah dan sebagai cadangan. Biasanya file terkecil dari ketiga varian.
• Varian @2x ([email protected]): dua pertiga dari dimensi gambar sumber. Dipakai pada layar Retina standar (sebagian besar iPhone dan perangkat Android kelas menengah). Varian yang paling sering disajikan dalam praktik.
• Varian @3x ([email protected]): dimensi penuh gambar sumber. Dipakai pada perangkat unggulan berdensitas tinggi (iPhone Pro, Android kelas atas). Ukuran file terbesar, tetapi rendering paling tajam di layar yang mendukung.
• Kompresi yang diterapkan: keluaran PNG menghapus metadata dan dikodekan ulang tanpa rugi. Keluaran JPEG menerapkan tingkat kualitas yang dipilih (60-90 %) untuk pengurangan tambahan. Pengecilan skala Canvas berkualitas tinggi (imageSmoothingQuality: 'high') dipakai untuk semua varian.

Bundler Metro React Native memakai konvensi penamaan khusus untuk mengenali varian densitas: image.png untuk @1x, [email protected] untuk @2x, dan [email protected] untuk @3x. Ketiga file harus berada di direktori yang sama. Kompresor aset React Native menghasilkan file persis dengan konvensi ini - tanpa perlu mengganti nama. Ini berfungsi dengan Expo (workflow managed dan bare) maupun proyek React Native CLI murni.