Bismillahirrohmanirrohim.
Ada beberapa perkakas yang menurut Penulis bermanfaat untuk mengoptimalkan berkas svg, png, dan jpg. Manfaat nantinya untuk aset website, icon, background, patern, mockup, cover dan lain-lain. Tapi sayangnya belum ada versi GUI, semuanya menggunakan perintah terminal di GNU/Linux.
Pertama, kompresi berkas svg dengan SVGO
Laman Web: https://github.com/svg/svgo
Perkakas favorit Penulis adalah svgo, karena dengan svgo ini mampu mengkompres berkas svg menjadi minimalis, dengan menghilangkan layer, metadata, dan objek tersembunyi. Sangat berguna untuk optimasi website jika menggunakan asset svg. Misalnya ilustrasi Penulis yang berada di GNOME.ID, hanya sekian detik untuk menampilkan ilustrasi di bagian header dan fiture section.
Cara Install svgo di distro GNU/Linux
$ sudo npm install -g svgo
Repo Fedora
$ sudo dnf install nodejs-svgo
Lanjut ke demontrasinya (Penulis menggunakan GNU/Linux KDE NEON). Contoh Penulis punya 3 jenis ilustrasi. Kemudian lihat isi berkasnya.
$ ls -lh
total 680K
-rw-r--r-- 1 hervyqa users 224K May 14 11:02 ilustrasi-1.svg
-rw-r--r-- 1 hervyqa users 174K May 14 11:02 ilustrasi-2.svg
-rw-r--r-- 1 hervyqa users 280K May 14 11:02 ilustrasi-3.svg
Kompresi berkas svg dengan nama lain.
$ svgo ilustrasi-1.svg -o ilustrasi-1-hasil.svg
ilustrasi-1.svg:
Done in 664 ms!
223.576 KiB - 82.8% = 38.366 KiB
Dari contoh diatas svgo berhasil merubah ilustrasi-1.svg menjadi ilustrasi-1-hasil.svg. Dari 223.567 Kib manjadi 38.366 Kib.
Anda juga bisa kompresi berkas svg sekaligus. Tapi jika anda melakukan ini harap backup dulu berkas svg inkscape aslinya.
mkdir backup
cp *.svg backup
Kemudian kompres berkas svg sekaligus
svgo *.svg
ilustrasi-1.svg:
Done in 451 ms!
223.576 KiB - 82.8% = 38.366 KiB
ilustrasi-2.svg:
Done in 536 ms!
173.315 KiB - 88.5% = 19.988 KiB
ilustrasi-3.svg:
Done in 336 ms!
279.723 KiB - 94.3% = 15.963 KiB
Kompresi berkas PNG dengan OptiPng
Laman Web: http://optipng.sourceforge.net/
Perkakas optipng berfungsi untuk kompresi berkas png. Sama dengan svgo tadi, tujuannya sama-sama untuk kompresi berkas.
Cara install di GNU/Linux:
- openSUSE
$ sudo zypper install optipng
- Debian/Ubuntu/Mint
$ sudo apt install optipng
- Fedora
$ sudo dnf install optipng
- Centos dengan repo epel
$ su -c 'yum install optipng'
- Arch/Manjaro
$ sudo pacman -S optipng
Mari kita coba. Kita lihat ukuran berkasnya dahulu.
$ ls -lh
total 284K
-rw-r--r-- 1 hervyqa users 281K Jul 6 13:05 gambar.png
Kemudian kompres berkas pngnya.
$ optipng gambar.png
** Processing: /home/hervyqa/Documents/ilustrasi/2019/gambar.png
1000x661 pixels, 4x8 bits/pixel, RGB+alpha
Input IDAT size = 286837 bytes
Input file size = 287388 bytes
Trying:
zc = 9 zm = 8 zs = 0 f = 0
zc = 9 zm = 8 zs = 1 f = 0
zc = 1 zm = 8 zs = 2 f = 0
zc = 9 zm = 8 zs = 3 f = 0
zc = 9 zm = 8 zs = 0 f = 5 IDAT size = 273737
zc = 9 zm = 8 zs = 1 f = 5 IDAT size = 268841
zc = 1 zm = 8 zs = 2 f = 5
zc = 9 zm = 8 zs = 3 f = 5
Selecting parameters:
zc = 9 zm = 8 zs = 1 f = 5 IDAT size = 268841
Output IDAT size = 268841 bytes (17996 bytes decrease)
Output file size = 268972 bytes (18416 bytes = 6.41% decrease)
Kemudian cek lagi.
$ ls -lh
total 264K
-rw-r--r-- 1 hervyqa users 263K Jul 10 07:58 gambar.png
Alhamdulillah! dari 281Kib jadi 263Kib. Meskipun ukuran berkasnya tidak terlalu signifikan berubahnya.
Tips: Lalu kapan menggunakan optipng? Gunakanlah optipng ketika membutuhkan foto bitmap, blur dan transparansi gambar.
Kompresi berkas JPG dan JPEG dengan JpegOptim
Laman Web: https://github.com/tjko/jpegoptim
Terakhir jpegoptim. Perkakas ini berfungsi untuk kompresi berkas jpg dan jpeg.
Cara install di GNU/Linux:
- openSUSE
$ sudo zypper install jpegoptim
- Debian/Ubuntu/Mint
$ sudo apt install jpegoptim
- Fedora
$ sudo dnf install jpegoptim
- Centos dengan repo epel
$ su -c 'yum install jpegoptim'
- Arch/Manjaro
$ sudo pacman -S jpegoptim
Caranya hampir sama dengan optipng. kita cek dulu berkasnya.
$ ls -lh
total 308K
-rw-r--r-- 1 hervyqa users 302K Jul 6 14:58 gambar.jpg
Kemudian kompres berkas jpgnya.
$ jpegoptim gambar.jpg
/home/hervyqa/Documents/ilustrasi/2019/gambar.jpg 750x600 24bit P Exif IPTC XMP Adobe [OK] 308454 --> 295806 bytes (4.10%), optimized.
Tips: Jadi, menggunakan jpegoptim itu ketika membutuhkan foto bitmap, blur dan tidak memutuhkan transparansi gambar. Jika butuh transparansi pakai png dan kompresinya pakai optipng.
Nah itu tadi 3 perkakas tambahan favorit untuk memaksimalkan aset. Sekian dan terima kasih sudah membaca. Semoga bermanfaat.
