Liburan Bersama Electron
Liburan itu nggak masalah kalau nggak jalan-jalan, tapi ingat, harus selalu ada kegiatan, pastikan membawa kebaikkan dan jangan pernah bermalas-malasan.
Beberapa hari ini cukup banyak yang tanya kepada saya,
“Lagi bikin apa mas?”
Saya jawab, “lagi bikin aplikasi foto polaroid, mas”.
Kebetulan beberapa teman lagi giat-giatnya bisnis foto polaroid, tapi sayangnya pre-order nya selalu dibatasi. usut punya usut, alasannya adalah karena proses editing yang memakan waktu cukup lama. Manual menata foto satu-persatu di corel / inkscape, cropping, dan memberi background. Saya pikir, sayang sekali kalau membatasi profit hanya karena alasan proses editing yang lama.
Kemudian disela-sela kesibukkan, saya sempatkan untuk membuat prototype sederhana. se-sederhana yang penting bisa langsung menata otomatis, cropping dengan mudah, mengatur jarak bagian dalam (padding) foto dengan mudah, export to PDF dan offline.
Alhamdulillah, setelah sekitar 4 hari belajar dan mengimplementasikan, jadilah dia, program sederhana.
Alasan Migrasi Ke Electron
Semua berjalan sesuai ekspektasi. Tidak hanya itu, aplikasi ini hanyalah web biasa. ya! Web biasa! dan Offline! Ukurannya hanya sekitar 7Mb itupun karena assets dari ionicons dan kawan-kawannya. Teman-teman biasa menggunakannya dengan cara membuka chrome kemudian drop file html aplikasi ini ke dalamnya. Sederhana sekali bukan? But it works! Bahkan aplikasi ini mampu melakukan save project dan open project.
Proses generate PDF pun berjalan lancar. Jadi bisa langsung di cetak. Sampai akhirnya dapat laporan,
“Mas, komputernya orang print nggak kuat buat buka file PDF nya”
Dalam hati, “Ha? Masak iya komputer jaman now nggak mampu buat buka file PDF?”
Setelah saya cek, PDF yang dihasilkan berukuran sangat besar. bisa berpuluh-puluh Megabyte. Ini tidak wajar karena yang diproses hanya beberapa foto saja, sekitar 90 foto polaroid dan harusnya aman. Selain itu file hasil save project pada aplikasi bisa mencapa ratusan Megabyte. Buang-buang storage.
Karena aplikasi ini tidak mengharuskan user untuk memiliki server, alhasil terpaksa menggunakan protocol file pada browser. Kendala lain adalah file-file hasil crop yang harusnya disimpan dalam bentuk file, terpaksa disimpan dalam bentuk base64 String dan itu disimpan di redux store. ngeri gak tuh?
Sedikit Tentang Redux
Mengapa Redux? Waktu itu saya sedang mengembangkan middleware / plugin untuk redux, jatuh cinta pada konsep repatch dan redux-saga. Akhirnya saya gabungkan keduanya. Sudah jadi, tapi belum release — Mungkin akan dibahas pada artikel yang lain. Ini mengapa proses pembuatannya jadi agak panjang, sampai 4 hari.
Redux tidak memutasi state secara langsung, melainkan menduplikasinya. Alhasil browser harus menanggung beban base64 string yang panjangnya berkali-kali lipat dan jumlahnya yang tak sedikit. Karena redux melakukan duplikasi, bukan hanya sekedar mutasi. Bayangkan berapa panjang string yang ada di memori browser saat aplikasi harus mengedit banyak foto dengan proses cropping berulang? yups cukup membuat laptop berhenti untuk sesaat. haha.
Versi Baru Dengan Electron
Project ini berhenti lama, karena kesibukkan semester kemarin. Alhamdulillahnya, masih bisa digunakan untuk teman-teman produktif. Diakali dengan cara mengedit per 5 lembar saja, jadi tidak begitu berat dan mengkonversikannya ke PDF versi corel secara manual, supaya komputernya orang print bisa melakukan printing, tidak lag lagi.
Waktu liburan sempat ada pembahasan soal electron, saya ditanyai tentang pengalaman mengembangkan electron. Punya, tapi sedikit. Mumpung liburan, waktu yang tepat untuk belajar lebih.
Singkat cerita aplikasinya jadi dalam waktu seminggu, dengan fitur lebih lengkap dan lebih canggih. Proses generate PDF lebih cepat dan dengan ukuran yang lebih kecil. Aplikasi dilengkapi dengan fitur keyboard shortcut. Dan mampu melakukan zoom canvas sederhana layaknya di aplikasi inkscape, tapi masih perlu enhancement. Aplikasi ini mampu generate PDF maupun JPEG. Dan memiliki tipe varian polaroid yang lebih banyak lagi. Proses cropping pun jadi ringan, dan sekarang user bisa memproses lebih banyak foto tanpa harus begitu khawatir akan konsumsi memori.
Banyak hal yang saya pelajari dalam proses pengembangan ini, selain belajar soal mengembangkan aplikasi cross platform. Saya juga belajar tentang:
- Pengembangan Keyboard Shortcut Pada Web
- Konversi PDF ke Image via Browser
- Konversi Image ke PDF via Browser
- Kompresi PDF
- Membuat state management baru mirip dengan monx
- EXIF data pada Image
- Custom Protocol Pada Electron
- Sedikit Canvas API
Semua ini tidak mungkin dibahas dalam satu artikel bukan? Mau tau lebih detail? Follow aja dulu~
Penutup
Setiap detil isi konten dalam artikel ini tidak bermaksud untuk show off,menyinggung, menyindir, mengkritik ataupun sejenisnya. Melainkan hanya menuliskan pengalaman selama mengembangkan suatu aplikasi.
Sangat terbuka untuk kritik dan saran. Kalau saya salah, mohon dengan sangat untuk diingatkan. Semoga bermanfaat dan jangan lupa Like and Share~
Let’s talk about some projects with me
Just Contact Me At:
- Email: bosnaufalemail@gmail.com
- Skype Id: bosnaufal254
- twitter: @BosNaufal
