Sebenarnya banyak alternatif dari Electron, tinggal pilih saja sesuai kebutuhan. Secara teknis, pilihannya terbagi jadi dua 😌
-
Chromium Bundled
Contoh: Electron, NW.jsPendekatan ini cenderung lebih stabil dan konsisten di berbagai OS. Namun, kelemahannya ada pada ukuran file bundle atau installer yang besar dan konsumsi resource, terutama RAM, yang cenderung lebih tinggi.
-
System WebView
Contoh: Tauri, Wails, NeutralinojsUkuran file bundle yang dihasilkan bisa jauh lebih kecil karena memanfaatkan web engine bawaan sistem operasi. Tantangannya, dari sisi engine UI pendekatan ini bisa lebih tricky dan membutuhkan penyesuaian ekstra, terutama ketika berhadapan dengan perbedaan WebView antar-OS seperti WebKit di macOS.
Kelima teknologi tersebut tetap memungkinkan kita membangun desktop app menggunakan teknologi web seperti HTML, CSS, dan JavaScript. Perbedaan paling fundamental justru terletak pada browser engine, runtime, native backend, ukuran output build, dan cara aplikasi berinteraksi dengan sistem operasi.
Perbedaan Chromium Bundled dan System WebView
Pada pendekatan Chromium Bundled, aplikasi membawa browser engine sendiri. Electron dan NW.js misalnya, sama-sama membawa Chromium dan Node.js sebagai bagian dari runtime aplikasi.
Keuntungannya adalah lingkungan rendering menjadi lebih terkontrol dan relatif konsisten di Windows, macOS, maupun Linux.
Konsekuensinya, ukuran aplikasi menjadi lebih besar karena setiap aplikasi ikut mendistribusikan browser engine dan runtime-nya sendiri.
Pendekatan System WebView bekerja sebaliknya. Tauri 2, Wails, dan Neutralinojs tidak membawa Chromium sendiri, tetapi menggunakan WebView yang sudah tersedia di sistem operasi.
Karena browser engine tidak perlu ikut dikemas, ukuran aplikasi dapat jauh lebih kecil. Namun, developer juga perlu memperhatikan perbedaan implementasi WebView pada setiap platform.
1. Electron
Electron merupakan salah satu framework desktop berbasis teknologi web yang paling populer. Electron menggabungkan Chromium dan Node.js sehingga developer dapat membuat desktop app menggunakan HTML, CSS, dan JavaScript.
Setiap aplikasi Electron membawa runtime Chromium dan Node.js sendiri. Pendekatan ini membuat perilaku rendering relatif konsisten di berbagai sistem operasi.
Dari sisi developer experience, hal ini menjadi keuntungan besar karena aplikasi tidak terlalu bergantung pada versi WebView yang tersedia di perangkat pengguna.
Namun, konsekuensinya adalah ukuran distribusi yang relatif besar. Aplikasi Electron sederhana umumnya sudah berada di kelas puluhan hingga lebih dari 100 MB, tergantung versi Electron, platform, dependency, assets, dan metode packaging yang digunakan.
- Frontend: HTML, CSS, JavaScript
- Chromium bundled: Ya
- Node.js runtime: Ya
- System WebView: Tidak
- Backend utama: Node.js dan native C/C++
- Ukuran build: Besar, umumnya sekitar 80-150 MB atau lebih
- Konsistensi rendering: Tinggi
- Ekosistem: Sangat besar
Electron cocok ketika konsistensi lintas platform, kematangan ekosistem, dan ketersediaan library lebih penting dibanding ukuran installer atau konsumsi resource.
2. NW.js
NW.js memiliki pendekatan yang sangat dekat dengan Electron. Framework ini juga menggabungkan Chromium dan Node.js dalam satu runtime desktop.
Developer dapat menggunakan HTML, CSS, JavaScript, serta API Node.js dalam aplikasi. Karena Chromium ikut dibundel, NW.js juga memiliki tingkat konsistensi rendering yang relatif tinggi antar-platform.
Tetapi konsekuensinya hampir sama seperti Electron: ukuran distribusi cukup besar. Seluruh runtime NW.js perlu ikut dikirimkan bersama aplikasi.
Secara praktis, output NW.js juga berada pada kelas puluhan hingga lebih dari 100 MB, tergantung versi runtime, build flavor, OS, arsitektur CPU, dan assets aplikasi.
- Frontend: HTML, CSS, JavaScript
- Chromium bundled: Ya
- Node.js runtime: Ya
- System WebView: Tidak
- Backend utama: Node.js dan C/C++
- Ukuran build: Besar, umumnya puluhan hingga 100 MB lebih
- Konsistensi rendering: Tinggi
- Ekosistem: Mature
NW.js menarik ketika developer menginginkan pendekatan yang masih sangat dekat dengan browser dan Node.js, tetapi dengan model integrasi yang berbeda dari Electron.
3. Tauri 2
Tauri 2 mengambil pendekatan berbeda dari Electron. Tauri tidak membawa Chromium sendiri, tetapi menggunakan WebView yang sudah tersedia pada sistem operasi.
Pada Windows, Tauri memanfaatkan Microsoft Edge WebView2. Pada macOS menggunakan WKWebView berbasis WebKit, sedangkan Linux umumnya menggunakan WebKitGTK.
Frontend tetap dapat dibuat menggunakan HTML, CSS, JavaScript, TypeScript, React, Vue, Svelte, Solid, dan framework web modern lainnya.
Sementara itu, logic native utama pada Tauri ditulis menggunakan Rust.
Node.js perlu dipahami secara berbeda dibanding Electron. Tauri 2 tidak meng-embed Node.js sebagai runtime aplikasi produksi. Node.js, npm, pnpm, Yarn, atau Bun biasanya hanya digunakan sebagai development tooling apabila frontend memang membutuhkannya.
Salah satu keunggulan terbesar Tauri adalah ukuran aplikasi. Dokumentasi Tauri 2 menyebut aplikasi minimal dapat berukuran kurang dari 600 KB.
Tentu angka tersebut adalah minimal case. Aplikasi nyata yang menggunakan framework frontend, icon, database, plugin, assets, serta dependency Rust biasanya akan menghasilkan binary berukuran beberapa MB hingga puluhan MB.
- Frontend: HTML, CSS, JavaScript/TypeScript
- Chromium bundled: Tidak
- Node.js runtime: Tidak
- Node.js untuk frontend tooling: Opsional
- System WebView: Ya
- Backend utama: Rust
- Minimal build: Kurang dari 600 KB
- Real-world build: Umumnya beberapa MB atau lebih
- Konsistensi rendering: Bergantung pada WebView OS
- Ekosistem: Besar dan terus berkembang
Tauri 2 cocok untuk aplikasi yang menginginkan ukuran kecil, integrasi native kuat, serta security model yang lebih ketat tanpa harus membawa Chromium sendiri.
4. Wails
Wails menggunakan konsep yang kurang lebih serupa dengan Tauri, tetapi native backend-nya menggunakan Go.
UI tetap dibangun menggunakan HTML, CSS, JavaScript, atau framework frontend seperti React, Vue, dan Svelte.
Method Go dapat diekspos ke frontend sehingga JavaScript dapat berkomunikasi langsung dengan logic aplikasi native.
Wails juga tidak membawa Chromium sendiri. Browser engine berasal dari WebView milik sistem operasi.
Karena itu ukuran aplikasinya relatif kecil dibanding Electron. Untuk aplikasi sederhana, output binary Wails umumnya berada di kisaran sekitar 10-20 MB, tergantung dependency Go, frontend, target OS, dan optimasi build.
- Frontend: HTML, CSS, JavaScript
- Chromium bundled: Tidak
- Node.js runtime: Tidak
- System WebView: Ya
- Backend utama: Go
- Ukuran build: Sekitar 10-20 MB untuk aplikasi sederhana
- Konsistensi rendering: Bergantung pada WebView OS
- Ekosistem: Cukup besar
Wails menjadi pilihan menarik khususnya bagi developer Go yang ingin membuat desktop app dengan frontend berbasis teknologi web tanpa membawa Chromium.
5. Neutralinojs
Neutralinojs mengambil pendekatan yang lebih minimal dibanding framework lain dalam daftar ini.
Framework ini tetap memungkinkan developer menggunakan HTML, CSS, dan JavaScript, tetapi tidak membawa Chromium maupun Node.js runtime.
Native core Neutralinojs dibuat menggunakan C++, sedangkan UI dirender menggunakan WebView yang tersedia pada sistem operasi.
Karena runtime native-nya sangat kecil, ukuran distribusi Neutralinojs juga bisa sangat kecil.
Dokumentasi resminya menyebut aplikasi sederhana dapat berukuran sekitar 2 MB dalam kondisi uncompressed dan sekitar 0,5 MB ketika dikompresi.
Neutralinojs juga mendukung embedding resources sehingga aplikasi dapat didistribusikan dalam bentuk executable yang lebih sederhana.
- Frontend: HTML, CSS, JavaScript
- Chromium bundled: Tidak
- Node.js runtime: Tidak
- System WebView: Ya
- Native core: C++
- Ukuran sederhana: Sekitar 2 MB uncompressed
- Compressed package: Sekitar 0,5 MB
- Konsistensi rendering: Bergantung pada WebView OS
- Ekosistem: Lebih kecil
Trade-off utamanya adalah ekosistem dan native API yang tidak sebesar Electron ataupun Tauri. Namun untuk aplikasi kecil dan sederhana, pendekatan Neutralinojs sangat menarik.
Perbandingan Ukuran Build Electron, NW.js, Tauri 2, Wails, dan Neutralinojs
| Framework | Browser Engine | Native Backend | Estimasi Ukuran Build |
|---|---|---|---|
| Electron | Bundled Chromium | Node.js / C++ | ±80-150 MB atau lebih |
| NW.js | Bundled Chromium | Node.js / C++ | Puluhan hingga 100 MB lebih |
| Tauri 2 | System WebView | Rust | Minimal <600 KB, aplikasi nyata umumnya beberapa MB atau lebih |
| Wails | System WebView | Go | ±10-20 MB untuk aplikasi sederhana |
| Neutralinojs | System WebView | C++ | ±2 MB uncompressed, ±0,5 MB compressed |
Perlu dicatat bahwa angka tersebut bukan benchmark yang benar-benar apple-to-apple. Ukuran final dapat berubah signifikan tergantung OS, arsitektur CPU, frontend framework, dependency, plugin, assets, database, debug atau release build, serta jenis installer.
Mana Alternatif Electron yang Sebaiknya Dipilih?
Tidak ada satu framework yang otomatis menjadi pilihan terbaik untuk semua jenis aplikasi.
Jika prioritasnya adalah ekosistem besar, kompatibilitas web yang tinggi, dan rendering yang konsisten, maka Electron masih menjadi pilihan yang sangat kuat.
Jika ingin pendekatan Chromium dan Node.js yang mirip Electron, NW.js bisa menjadi alternatif.
Jika ingin ukuran aplikasi lebih kecil dengan native backend Rust, Tauri 2 menjadi salah satu pilihan paling menarik.
Jika lebih nyaman menggunakan Go, Wails menawarkan konsep yang mirip dengan backend Go.
Sedangkan jika prioritasnya adalah runtime yang sangat minimal, Neutralinojs patut dipertimbangkan.
Kesimpulan
Pada akhirnya perbedaan utama kelima framework tersebut dapat diringkas menjadi dua pendekatan.
Electron dan NW.js membawa Chromium sendiri. Hasilnya lebih konsisten dan memberikan environment yang lebih terkontrol, tetapi ukuran aplikasi serta konsumsi resource cenderung lebih besar.
Sementara Tauri 2, Wails, dan Neutralinojs menggunakan System WebView. Pendekatan ini memungkinkan ukuran aplikasi jauh lebih kecil karena browser engine tidak perlu ikut didistribusikan bersama aplikasi.
Trade-off-nya adalah developer perlu lebih memperhatikan perbedaan WebView antar-platform.
Jadi pertanyaannya sebenarnya bukan sekadar: "Mana yang lebih bagus dari Electron?"
Tetapi lebih tepat: "Trade-off mana yang paling sesuai dengan kebutuhan aplikasi kita?"
Posting Komentar