Coding

Mengenal Progressive Web Apps (PWA) dalam Pengembangan Web

Beberapa tahun belakangan, Progressive Web Apps (PWA) menjadi lebih sering diperbincangkan di kalangan pengembang aplikasi dan web. Awalnya istilah PWA dicetuskan oleh desainer/freelancer Frances Berriman dan pengembang Google Chrome, Alex Russel.

Dalam blognya, Berriman mengatakan bahwa dia tidak terlalu suka dengan konsep AMP (Accelarated Mobile Pages) buatan Google yang tujuannya untuk mempercepat loading halaman sebuah situsweb pada tampilan mobile. Dia memandang bahwa PWA lebih potensial untuk mengatasi loading website yang lemot pada perangkat mobile.

Alex Russel sendiri pernah mempresentasikan konsep PWA di acara Chrome Dev Summit 2015. Lalu dilanjutkan oleh presentasi Jake Archibald pada Google I/O 2016 dengan materi Instant Loading: Building offline-first Progressive Web Apps. Setahun kemudian , Google I/O 2017 mengangkat beberapa topik soal PWA, diantaranya Production Progressive Web Apps With JavaScript Frameworks, Progressive Web Apps: Great Experiences Everywhere, dan Creating UX that “Just Feels Right” with Progressive Web Apps.

Istilah PWA digunakan untuk menjelaskan kemampuan peramban (browser) modern yang dapat mengelola service workers dan web app manifest. Dua hal tersebut yang menjadikan konsep PWA bisa diterima dan bisa diterapkan layaknya sebuah native apps. Bahkan, sebuah PWA juga mendukung akses ke perangkat keras sebuah smartphone.

Google sendiri menjelaskan bahwa PWA bukan merupakan API maupun jenis teknologi, tetapi adalah pendekatan pengembangan web yang menggunakan kombinasi alat (tools) dan teknologi yang sudah tersedia untuk membangun pengalaman pengguna yang ideal dan tertarget. Hal tersebut dilakukan dengan memanfaatkan service workers, API dan arsitektur shell aplikasi untuk pengalaman akses offline yang lebih berarti, loading pertama yang super cepat, dan mengelola keterikatan pengguna setelah kunjungan pertama.

Gampangnya, PWA adalah aplikasi web yang berupa situsweb pada umumnya, tetapi bisa ditampilkan seperti layaknya sebuah aplikasi mobile. Bedanya, pengguna tidak perlu mengunduh dan menginstal aplikasi tersebut, tetapi cukup melempar icon situsweb ke tampilan Home Screen.

Ketika icon tersebut diklik, maka akan membuka sebuah tampilan mirip web, tetapi tanpa kolom URL. Konsep semacam ini tentu akan menguntungkan pengguna smartphone karena memorinya tidak bakal terkuras untuk menyimpan file-file aplikasi.

Contoh ilustrasi penerapan PWA dalam aplikasi mobile

Kecepatan mobile web memang selalu menjadi perhatian serius selama bertahun-tahun. Beberapa konsep lain yang ditawarkan seperti tampilan web adaptif dan responsif semakin ke sini tidak cukup untuk memberikan pengalaman pengguna yang lebih baik.

Facebook membuat Instant Article, sementara Google mengembangkan AMP. Keduanya dikembangkan untuk memberikan kenyamanan akses melalui konsep instant loading. Sebuah konsep yang merepresentasikan sebuah halaman web bisa diakses dengan lebih cepat dan instan pada perangkat mobile.

Salah satu fitur menarik dari PWA adalah dukungan untuk push notification. Fitur tersebut pada dasarnya adalah fitur notifikasi dalam gajet pengguna ketika ada sebuah konten baru muncul pada PWA. Fitur ini banyak ditemui pada aplikasi mobile dalam berbagai bentuk misal notifikasi email yang baru masuk, notifikasi chat yang baru masuk pada aplikasi messenger, atau notifikasi yang dimunculkan oleh aplikasi pembaca berita setiap kali ada berita baru.

PWA awalnya diujicobakan pada browser Google Chrome. Mulai bulan April 2018, PWA sudah bisa diterapkan ke banyak browser, termasuk Google Chrome, Microsoft Edge, Firefox, dan Safari. Beberapa web yang sudah menerapkan konsep PWA ini bisa dilihat pada tautan ini.

Sepertinya menarik untuk terus mengikuti perkembangan PWA ini. Sementara itu, beberapa CMS seperti WordPress sudah lebih dulu memberi dukungan plugin untuk PWA, sebut saja Progressive Web Apps dan Super Progressive Web Apps.

Tertarik untuk mencoba? 🙂

 

Referensi:

  • https://en.wikipedia.org/wiki/Progressive_Web_Apps
  • https://www.quora.com/Are-progressive-web-apps-going-to-kill-native-apps?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa
  • https://developers.google.com/web/ilt/pwa/