Kenalan dengan Progressive Web Apps(PWA)

10:16 AM
Kenalan dengan Progressive Web Apps(PWA)
Di Posting Oleh : wandi
Kategori : javascript news coding Pemprograman web react

Kepanjangan dari PWA adalah Progressive Web Apps. lantar apa itu pengertian dari Progressive Web Apps ??

Apa itu Progressive Web Apps(PWA)  ?


Progressive Web Apps adalah sebuah metode untuk membuat sebuah webiste berjalan,terlihat, dan terasa seperti aplikasi native pada umumnya, tetapi merupakan situs web yang sudah di optimized untuk dijalankan dimobile. meskipun seperti aplikasi native kita tidak perlu mendownload di app store, cukup dengan membuka webiste yang sudah teroptimized beberapa  detik nanti akan muncul pop-up untuk mengijinkan apakah web tersebut diizinkan dipasang di HOME. meskipun sudah terpasang dihome pwa tetap berjalan di atas browser dan pwa yang baik harus bisa berjalan meskipun di jaringan 3G dan offline, juga memiliki fitur offline caching,background syncing dan push notifications dengan menggunakan service worker. apa itu service worker ? service worker adalah sebuah aplikasi file javascript yang berjalan di background dan tidak dapat berintarksi langsung dengan halaman website maupun tidak bisa mengakses DOM Secara langsung tetapi dapat berkomunikasi melalui messages (Post Messages). pwa harus menggunakan service worker karena service worker bertindak sebagai proxy server diantara web app, browser dan jaringan(bila tersedia). pada load pertama kali service worker akan mendownload content webiste tersebut dan di simpan dicache browser. dengan demikian jika mengakses lagi dapat memuat website tersebut lebih cepat karena tinggal mengambil data dari cache browser yang disimpan tadi. Dengan cara ini website akan bisa diakses secara offline atau sedang mengalami sinyal yang buruk. Perusahan yang sudah menerapkan pwa pada website mereka
alibaba pwa
Alibaba
trivago pwa
trivago
Instagram pwa
Instagram
twiter pwa
Twitter
dan masi banyak lagi website keren yang sudah menggunakan pwa. dengan menggunakan pwa akan memberikan pengalam kepada user yang membuka website kita sebagai berikut : => Reliable  proses load website akan lebih cepat user tidak lagi melihat downasaur bahkan dalam jaringan yang sangat buruk sekalipun. => fast dengan respon yang cepat dapat mencegah user meninggalkan website kita karena 53% user akan meninggakan webiste kita jika dalam 3 menit webiste kita tidak memberikan respon apapun atau malah muncul downasaur. => Engaging karena pwa terlihat seperti aplikasi native pada umunya maka akan memberikan user  experience yang sangat mendalam. hal yang perlu di perhatikan dalam pembuatan pwa: Service Worker service worker bertindak sebagai proxy server diantara web app, browser dan jaringan(bila tersedia). pada load pertama kali service worker akan mendownload content webiste tersebut dan di simpan dicache browser. dengan demikian jika mengakses lagi dapat memuat website tersebut lebih cepat karena tinggal mengambil data dari cache browser yang disimpan tadi. Dengan cara ini website akan bisa diakses secara offline atau sedang mengalami sinyal yang buruk. Manifest File manifest File adalah file JSON config yang mencakup tentang informasi dari aplikasi seperti jenis icon yang akan disimpan dilayar ketika diisntall, tema,dan nama pendek dari aplikasi. HTTPS service worker memerlukan https untuk tujuan keamanan.karena service worker memiliki kemampuan untuk memodifikasi respon disisi client dan dapat mencegah request jaringan, semua komunikasi antara browser dan jaringan perlu di dienkripsi.
alat yang dibutuhkan untuk membuat pwa:
  1. Chrome 52 atau di atasnya
  2. Web Server for Chrome, atau server web pilihan Anda
  3. Text Editor
  4. Pengetahuan dasar tentang HTML, CSS, JavaScript, dan Chrome DevTools
setelah pwa selesai di bagun jangan lupa testing dengan developer tools => audits semoga bermanfaat

Mau liat atau download source code aplikasi premium bisa disini.
Previous
Next Post »
0 Komentar