Tiga Kaedah Membina Aplikasi Desktop Dengan Teknologi Web, Dan Kelebihan Kaedah Ini

Editor's Review

Dalam artikel ini, kami melihat kepada keadah baru dalam pembangunan aplikasi desktop. Bagi mereka yang pernah berkecimpung dalam pembangunan sebegini, mungkin mereka biasa dengan nama-nama seperti Visual Basic, .NET, Qt, WxWidget, GTK, Delphi atau Java.

Tetapi sejak beberapa tahun lalu, programmer banyak menumpukan pembelajaran kepada teknologi web. Mungkin pembangunan aplikasi desktop tidak sepenting dahulu, dan tidak sepenting aplikasi mobail atau web. Tetapi aplikasi deskop pastinya masih diperlukan.

Nasib baik juga, sekarang aplikasi desktop boleh dibangunkan dengan teknologi web. Seperti mana Cordova yang menghasilkan aplikasi mobail dengan HTML, CSS, Javascript, kini anda boleh lakukan yang sama untuk aplikasi desktop. Lebih menarik lagi, ada tiga kaedah yang anda boleh gunakan untuk membangunkan aplikasi desktop dengan teknologi web.

Berikut adalah beberapa contoh aplikasi desktop yang dibangunkan dengan teknologi web:

Antara manfaat menggunakan teknologi web dalam pembangunan aplikasi desktop, ianya memudahkan pembinaan pelbagai versi untuk pelbagai platform. Contohnya, dengan kod sumber yang sama, aplikasi mudah dipakej untuk Windows, Mac dan juga Linux.

Jadi apakah kaedah yang boleh digunakan ini?

NW.js (terdahulu dikenali sebagai Node-Webkit)

http://nwjs.io/

Node-Webkit adalah projek yang pertama saya cuba setahun dua dahulu. Ketika itu ia masih dikenali sebagai Node-Webkit dan bukan NW.js lagi. Sempat saya membina sebuah aplikasi kiosk dengannya.

NW.js mempunyai dokumentasi yang banyak di websitenya dan juga di Wiki Github. Pembangunan dan bantuan komuniti juga rancak. Antara yang menarik adalah di mana kod HTML, CSS dan Javascript yang dibangunkan boleh disembunyikan daripada umum dengan menggunakan enjin Javascript V8. Namun ini mungkin menyebabkan aplikasi berjalan dengan sedikit perlahan.

Electron JS (terdahulu dikenali sebagai Atom Shell)

http://electron.atom.io/

Bermula sebagai kerangka untuk perisian teks editor Atom, ianya kemudian dikongsi kepada umum sebagai projek sumber terbuka dia Github. Sebab itu pada mulanya ianya dikenali sebagai Atom Shell. Tetapi kemudian ianya ditukar kepada Electron JS apabila ianya semakin serious dibangunkan.

Dokumentasi untuk Atom sangat banyak dan ini memudahkan mereka yang ingin menggunakannya untuk membangunkan aplikasi. Yang menarik lagi, ianya juga disertakan dengan modul untuk membantu mengemaskini aplikasi apabila kita membuat penambahbaikan.

Brackets Shell

https://github.com/adobe/brackets-shell

Brackets adalah sebuah teks editor sumber terbukan yang dibangunkan oleh komuniti bersama Adobe. Dan nyata ianya sebuah editor yang hebat. Rasa merasakan Bracket Shell, modul yang digunakan untuk mempakej aplikasi Brackets juga tidak kurang hebatnya.

Cuma, sebagai sebuah modul untuk pembangunan aplikasi, ianya tidak hadir dengan sebarang khidmat sokongan. Namun ada juga pihak yang berjaya menggunakan untuk membina dan melancarkan aplikasi sendiri. Jadinya dokumentasi amat terhad. Kaedah ringkas untuk mencuba Brackets Shell adalah dengan memuat-turun Brackets, menyalinnya ke satu folder baru, dan kemudian mengganti isi folder /www dengan aplikasi HTML5 anda.

Percubaan Ringkas

Saya ingin mencuba bagaimana sesebuah aplikasi dibina dan dilancarkan menggunakan tiga pilihan ini. Maka kami gunakan sebuah projek animasi CSS3 daripada Codrop dan mempakejnya menggunakan NW.js, ElectronJS dan Brackets Shell.

Hasil cubaan ringkas ini menunjukkan kepada kami betapa mudahnya membangunkan aplikasi dengan ketiga projek ini.

Namun, menggunakan Brackets Shell, terasa bahawa animasi CSS3 tidak berapa lancar. Dan sekiranya mahu digunakan untuk pembangunan aplikasi, saya tidak mencadangkan Brackets Shell. Di antara NW.js dan ElectronJS, buat masa sekarang, kita mempunyai pilihan yang jelas — sama ada mahu melindungi kod sumber aplikasi ataupun mahu kaedah yang lebih baik untuk memberi kemaskini dan penambahbaikan kepada pengguna.

Untuk melindungi kod aplikasi, gunakan NW.js.

Untuk menghantar kemaskini kepada pengguna, gunakan ElectronJS.