Mengenal Progressive Web Apps (PWA)

 Kita tentunya sudah sangat sering mendengar istilah Web. Google.com, Youtube.com, Facebook.com, dll adalah contoh situs web yang mungkin sudah tidak asing bagi kita semua atau bahkan sangat sering kita kunjungi. Lantas apakah pengertian dari web? Web merupakan kependekan dari website yang memiliki definisi sebagai kumpulan halaman yang tersimpan di dalam web server dan dibuat dengan tujuan tertentu seperti untuk menyampaikan informasi berupa video, gambar maupun musik atau untuk tujuan bisnis yang nantinya dapat diakses secara luas melalui jaringan internet dengan mengetikkan URL pada web browser. Seiring perkembangan zaman teknologi web menjadi semakin canggih karena mampu mengikuti kemampuan perangkat yang sedang populer saat ini yaitu perangkat android. 

Progressive Web Apps merupakan gabungan dari Web Apps dan Mobile Apps. Progressive Web Apps atau bisa disingkat sebagai PWA adalah bentuk pengembangan web yang bekerja layaknya aplikasi mobile android. PWA memberikan pengalaman bagi pengguna seperti mengakses aplikasi native di web. Secara garis besar kelebihan yang dimiliki dari PWA ialah FIRE(Fast, Integrated, Reliable, and Engaging) cepat, terintegrasi, dapat diandalkan, dan menarik. Salah satu aplikasi PWA buatan Indonesia yang cukup populer adalah JalanTikus.

Dalam membangun PWA kita juga perlu mempelajari komponen-komponen penyusunnya salah satunya adalah service worker. Service worker merupakan skrip yang dijalankan browser di latar belakang, terpisah dari halaman web, yang membuka pintu ke berbagai fitur yang tidak memerlukan halaman web atau interaksi pengguna.. Service worker merupakan salah satu komponen PWA yang dapat meringankan lalu lintas transaksi data hingga 84% pada website.

Terdapat beberapa hal yang perlu diperhatikan dalam service worker:

1. Service worker adalah JavaScript Worker, jadi tidak dapat mengakses DOM secara langsung.

2. Service worker adalah proxy jaringan yang dapat diprogram, yang memungkinkan Anda mengontrol cara menangani permintaan jaringan dari halaman.

3. Service worker akan dihentikan jika tidak sedang digunakan, dan dimulai lagi saat diperlukan, jadi Anda tidak dapat mengandalkan keadaan global dalam pengendali onfetch dan onmessage service worker.

4. Service worker menggunakan promise secara luas.

Untuk informasi lebih lengkap mengenai service worker dapat kalian akses pada laman berikut:

https://developers.google.com/web/fundamentals/primers/service-workers?hl=id 

 

Bagaimana Cara Mendistribusikan PWA ke dalam Google Play Store?

Caranya dengan memanfaat fitur Trusted Web Activities yang memungkinkan para web developer untuk mendistribusikan PWA mereka melalui Google Play Store. Sebelum membahas mengenai Trusted Web Activities, kita perlu mengetahui protokol yang bisa digunakan untuk menampilkan konten web melalui android app:

1. WebView

Kelebihan
1. Mendukung full-screen
2. Memungkinkan menggabungkan web dan komponen native

Keterbatasan
1. Tidak menyediakan akses lengkap ke fitur platform web modern
2. Tidak bisa sharing cookies, storage, dan sharing saved password.
 
2. Custom Tab
Kelebihan
1. Mendukung full-screen
2. Bisa sharing cookies, storage, dan sharing saved password
3. Selalu up-to-date
 
Keterbatasan
1. Terdapat URL bar di bagian atas halaman.
 
Setelah mengenal kedua protokol yang digunakan dalam menampilkan konten web melalui android app, mari kita bahas Trusted Web Activity. Trusted Web Activity adalah cara baru untuk mengintegrasikan konten aplikasi web seperti Progressive Web App (PWA) di dalam aplikasi android menggunakan protokol yang didasarkan pada Custom Tab.
Kelebihan
1. Mendukung full-screen
2. Dapat mengakses semua fitur web
3. Selalu up-to-date
4. Bisa sharing cookies, storage dan saved password
5. Mudah diimplementasikan

Keterbatasan
1. Tidak bisa dikombinasikan dengan component aplikasi native
 
Demikian artikel ini semoga dapat memberikan manfaat bagi pembaca semua, saya masih dalam tahap belajar juga apabila ada kritik dan saran yang membangun silahkan tulis di kolom komentar.
 

Post a Comment

0 Comments