Kandungan
- PWA vs Aplikasi asli: Apakah perbezaannya?
- Aplikasi web progresif: Membangun untuk web
- Kekuatan PWA
- Kelemahan PWA
- React Native
- Kekuatan React Native
- Kelemahan React Native
- NativeScript
- Kekuatan NativeScript
- Kelemahan NativeScript
Pendekatan mana yang harus anda ambil semasa membuat aplikasi? Sekiranya anda mengambil jalan teknologi PWA / web atau anda harus menggunakan dan menggunakan platform khusus? Kedua-dua pilihan mempunyai kebaikan dan keburukan, dan dalam artikel ini kami menumpukan perhatian pada beberapa pilihan popular yang digunakan untuk membuat aplikasi web dan asli.
PWA (Progressive Web Apps) aka aplikasi web, dibina dengan teknologi web yang popular HTML, CSS dan JavaScript dan berfungsi dalam penyemak imbas web. (Lihat beberapa tag HTML penting untuk membantu pembuatan anda.) PWA adalah laman web mudah alih yang direka bentuk untuk kelihatan seperti aplikasi, dan penggunaan API web memberi mereka fungsi yang serupa dengan aplikasi asli.
Untuk nasihat lebih lanjut mengenai pembuatan aplikasi, lihat siaran kami tentang cara membuat aplikasi, atau jika itu adalah laman web yang ingin anda buat, lihat pembangun laman web teratas dan perkhidmatan hosting web ini.
PWA vs Aplikasi asli: Apakah perbezaannya?
Aplikasi Web Progresif mempunyai kelebihan untuk dipasang dan hidup pada peranti tanpa memerlukan kedai aplikasi. Dan, sebahagian daripada proses tersebut adalah Manifest Aplikasi Web yang membolehkan pembangun mengawal bagaimana aplikasi muncul dan bagaimana aplikasi dilancarkan. Juga, pereka web / pemaju bahagian depan akan mempunyai kemahiran yang diperlukan untuk mula membina dengan segera. Tidak perlu belajar bahasa baru, tidak seperti aplikasi asli.
Aplikasi asli dibina dengan mempertimbangkan OS tertentu - iaitu. iOS dan Android - dan gunakan kerangka atau bahasa untuk memenuhi tujuan tersebut. Aplikasi iOS biasanya menggunakan Xcode atau Swift, dan aplikasi Android, JavaScript. Tetapi, untuk artikel ini kami menumpukan perhatian pada beberapa kerangka sumber terbuka berasaskan JavaScript - React Native dan NativeScript - yang berfungsi untuk kedua-dua platform.
Kelebihan aplikasi asli adalah bahawa mereka biasanya membawa fungsi yang lebih baik kerana mereka menggunakan perkakasan dan perisian peranti dengan lebih baik, lebih pantas dan lebih responsif dan anda mendapat jaminan kualiti walaupun dinilai di gedung aplikasi. Tetapi, ini bermaksud harus belajar bagaimana menggunakan kerangka atau perpustakaan tertentu.
Di sini kita melihat tiga pilihan yang berbeza - satu untuk web (PWA) dan dua untuk asli (React Native, NativeScript) - untuk membina aplikasi. Kami menjalani bagaimana mereka beroperasi, apa yang boleh mereka lakukan dan melihat kekuatan dan kelemahan mereka untuk membantu anda menentukan pilihan yang harus anda pilih untuk membina aplikasi anda.
Aplikasi web progresif: Membangun untuk web
Kekuatan PWA
- Aplikasi juga berfungsi di penyemak imbas
- Pengedaran: penyemak imbas, perusahaan dan kedai aplikasi
- Boleh menggunakan kerangka kerja React, Angular, Vue, vanilla atau lain-lain
Kelemahan PWA
- Tidak ada akses ke setiap API asli
- Keupayaan dan pengedaran kedai di iOS dan iPadOS adalah terhad
- Ini dalam evolusi berterusan
PWA adalah corak reka bentuk terkini untuk membuat aplikasi berprestasi tinggi, luar talian, yang dapat dipasang dengan hanya menggunakan web stack: HTML, CSS, JavaScript dan API penyemak imbas. Terima kasih kepada pekerja perkhidmatan dan spesifikasi manifes aplikasi web, kami kini dapat membuat pengalaman aplikasi kelas pertama setelah memasang untuk Android, iOS, iPadOS, Windows, macOS, Chrome OS dan Linux.
Untuk membuat PWA, anda boleh menggunakan seni bina apa pun: dari sisi pelayan, JavaScript vanila, React, Vue, sudut atau kerangka sisi pelanggan yang lain. Ini boleh menjadi aplikasi satu halaman atau aplikasi web berbilang halaman dan kami menentukan bagaimana kami akan menyokong pengguna semasa di luar talian.
Dalam pendekatan ini, kami tidak perlu mengemas dan menandatangani sumber aplikasi kami: kami hanya menghoskan fail di pelayan web dan pekerja perkhidmatan akan bertanggungjawab untuk menyimpan cache fail dalam klien dan memberikannya setelah pemasangan. Ini juga bermaksud jika aplikasi perlu dikemas kini, anda hanya menukar fail di pelayan dan logik pekerja perkhidmatan akan bertanggungjawab untuk memperbaruinya pada peranti pengguna tanpa campur tangan pengguna atau kedai aplikasi.
Dari segi pengedaran, kaedah yang paling biasa adalah penyemak imbas. Pengguna memasang aplikasi dari penyemak imbas dengan menggunakan item menu Tambah ke Skrin Utama atau Pasang, dengan menerima undangan untuk memasang atau menggunakan antarmuka pengguna aplikasi web khusus pada platform yang serasi. Perlu diperhatikan bahawa Apple menolak PWA tulen yang diterbitkan di App Store dan mendorong pembangun web untuk menyebarkannya melalui Safari.
Antara muka pengguna dikendalikan sepenuhnya oleh runtime web, yang bermaksud pereka web bertanggungjawab untuk memberikan setiap kawalan di layar. Sekiranya anda menggunakan rangka kerja UI, seperti Ionic, atau perpustakaan Reka Bentuk Bahan, HTML dan CSS akan meniru antara muka asli pada Android atau iOS tetapi tidak wajib.Semasa melakukan PWA, menerapkan teknik prestasi web adalah wajib untuk mengekalkan pengalaman pengguna yang baik.
Dari segi kebolehan, PWA akan mempunyai akses hanya ke API yang tersedia di enjin penyemak imbas di platform itu dan tidak dapat diperluas dengan kod asli - kecuali pengedaran PWA kedai aplikasi. Dalam hal ini, iOS dan iPadOS adalah platform yang lebih terhad untuk PWA, sementara Chrome (untuk OS Android dan desktop) mempunyai lebih banyak ketersediaan dan berusaha keras untuk menambahkan setiap API yang mungkin ada pada JavaScript dengan projek Fugu.
- Storan awan terbaik: Pilih pilihan yang tepat untuk anda.
React Native
Kekuatan React Native
- Corak yang sama dengan React.js
- Beberapa API web terdedah
- Sokongan web dan desktop
Kelemahan React Native
- Tidak dapat menggunakan semula komponen UI web
- Jambatan asli memerlukan sedikit kerja
- Pengalaman reaksi diperlukan
React Native adalah kerangka komponen berasaskan sumber terbuka JavaScript, yang ditaja oleh Facebook, yang menggunakan corak reka bentuk React, serta bahasa JavaScript untuk menyusun aplikasi asli untuk iOS, iPadOS dan Android dari satu kod sumber.
Tetapi tidak ada unsur HTML yang diterima untuk rendering; hanya komponen asli lain yang sah. Oleh itu, bukannya memberikan a div> dengan p> dan a input> elemen dengan JSX, anda akan memberikan a Lihat> dengan Teks> dan a Input Teks>. Untuk komponen gaya, anda masih menggunakan CSS dan susun aturnya ditentukan melalui Flexbox.
Antara muka pengguna tidak akan diberikan dalam DOM penyemak imbas tetapi menggunakan perpustakaan antara muka pengguna asli pada Android dan iOS. Oleh itu, a Butang> di ReactNative akan menjadi contoh UIButton pada iOS dan android.widget.Button kelas pada Android; tidak ada runtime web yang terlibat dalam React Native.
Namun, semua kod JavaScript akan dieksekusi dalam mesin virtual JavaScript di perangkat, jadi tidak ada penukaran JavaScript ke kod asli ketika menyusun aplikasi. Terdapat sekumpulan API terkenal untuk pembangun web, seperti Fetch API, WebSockets dan pemasa penyemak imbas: setInterval dan requestAnimationFrame. Kebolehan lain digunakan di platform melalui API khusus, seperti animasi.
Anda boleh memulakan projek React Native cepat dengan dua CLI percuma: Expo atau ReactNative CLI yang lebih maju dan rasmi. Sekiranya anda menggunakan CLI rasmi, anda juga memerlukan Android Studio untuk menyusun dan menguji aplikasi Android dan Xcode untuk melakukan perkara yang sama pada iOS dan iPadOS, jadi anda memerlukan komputer macOS untuk platform tersebut.
React Native menyusun aplikasi asli untuk iOS dan Android, yang bermaksud pengedaran aplikasi anda akan mengikuti peraturan yang sama dengan aplikasi asli lain: kedai aplikasi untuk aplikasi awam, pengedaran perusahaan dan pengujian alpha / beta. Biasanya, anda tidak dapat menyebarkan aplikasi melalui penyemak imbas, walaupun React Native for Web dan platform Microsoft React Native for Windows dapat membantu.
NativeScript
Kekuatan NativeScript
- Alat yang baik untuk pengekodan dan ujian
- Galeri aplikasi yang luas siap dimainkan
- Semua API Android dan iOS terdedah di JS
Kelemahan NativeScript
- Masyarakat kecil
- Tidak dapat menggunakan semula komponen UI web
- Tidak ada sokongan web, desktop atau React
NativeScript tidak begitu terkenal dengan React Native tetapi bersaing dalam bidang yang sama: aplikasi iOS dan Android asli dari JavaScript dan kerangka web. Ini memungkinkan anda menggunakan JavaScript atau TypeScript dan fail antara muka pengguna XML untuk membuat aplikasi asli. Ia juga menyokong Angular dan Vue langsung dari kotak, jadi ini adalah penyelesaian yang baik untuk pembangun yang biasa menggunakan kerangka kerja ini.
Kelebihan NativeScript lebih jelas apabila anda menggunakan Angular atau Vue. Untuk Angular, anda membuat komponen yang sama yang biasa anda gunakan tetapi menggunakan XML dan bukannya HTML untuk templat, termasuk semua pengikatan data. Dalam XML, bukannya a div> dengan p> dan sebuah img>, anda akan meletakkan a StackLayout> dengan Label> dan sebuah Gambar> komponen.
CSS dan Sass disokong dengan gaya yang serupa dengan CSS di penyemak imbas. Perutean dan pengurusan rangkaian dilakukan melalui pelaksanaan perkhidmatan Sudut standard. Bagi Vue, ia serupa; anda menulis templat dalam XML dan bukannya menggunakan HTML yang sama templat> elemen dalam fail .vue anda.
NativeScript merangkumi koleksi komponen yang kemudian dipetakan ke kontrol asli Android atau iOS, jadi apabila anda membuat senarai atau pemilih, itu akan menjadi aplikasi asli, menggunakan idea yang sama seperti dalam React Native.
Kod JavaScript atau TypeScript anda (ditranspilasi) dijalankan dalam mesin maya JavaScript pada peranti dengan jembatan ke / dari lingkungan asli. Di jambatan itu, seluruh API asli dari Android atau iOS / iPadOS terpapar sehingga meskipun memiliki akses ke API lintas platform, kami dapat membuat instansi atau memanggil mana-mana kod Java atau Objektif-C dari JavaScript / TypeScript dan NativeScript akan mengumpulkan jenis data.
NativeScript mempunyai sokongan hebat untuk perkakas, termasuk pemalam kod VS, CLI, sistem ujian tambah nilai panas dan aplikasi taman permainan NativeScript, jadi anda tidak perlu memasang semua pergantungan semasa menguji, serta beberapa perkhidmatan tambahan seperti dalam talian taman permainan.
Akhirnya, NativeScript hanya menyusun aplikasi untuk Android dan iOS yang dapat dipasang dari saluran pengedaran rasmi dan gedung aplikasi jika anda mematuhi peraturan mereka, pengedaran perusahaan dan pengujian alpha / beta. Biasanya tidak akan ada cara untuk menyebarkan aplikasi dari penyemak imbas dan tidak ada penyelesaian untuk aplikasi desktop untuk platform ini.
Artikel ini pada mulanya diterbitkan dalam terbitan 325 of net, majalah terlaris di dunia untuk pereka dan pembangun web. Beli terbitan 325 atau melanggan ke jaring.
Sertailah kami pada bulan April 2020 dengan barisan superstar JavaScript kami di GenerateJS - persidangan yang membantu anda membina JavaScript yang lebih baik. Tempah sekarang digenerateconf.comÂ
