{"id":32334,"date":"2018-04-30T09:32:06","date_gmt":"2018-04-30T02:32:06","guid":{"rendered":"https:\/\/dipstrategy.com\/blog\/?p=32334"},"modified":"2021-12-08T12:54:32","modified_gmt":"2021-12-08T05:54:32","slug":"apa-itu-progressive-web-apps-pwa","status":"publish","type":"post","link":"https:\/\/dipstrategy.co.id\/blog\/apa-itu-progressive-web-apps-pwa\/","title":{"rendered":"Apa itu Progressive Web Apps (PWA)"},"content":{"rendered":"

Progressive web apps dapat menjadi solusi saat kita usai membuat sebuah aplikasi mobile<\/a>, karena masalah yang kemudian muncul adalah bagaimana cara mendistribusikan aplikasi tersebut ke smartphone calon pengguna. Berbeda dengan aplikasi web, aplikasi mobile memang harus diinstal di smartphone pengguna. Karena itulah hadir Google Playstore atau Apple Appstore yang menjadi pusat distribusi aplikasi mobile sesuai platform masing-masing. Sebenarnya cukup mudah, namun tetap saja harus diinstal terlebih dahulu ke smartphone pengguna.<\/p>\n

Di sisi lain, aplikasi web tidak perlu diinstal di smartphone. Cukup akses saja URL aplikasi dari browser favorit. Dengan teknologi responsive design<\/a>, tampilan pun sudah dapat dibuat menjadi mobile friendly. Namun kekurangan utamanya adalah ketergantungannya terhadap koneksi internet. Koneksi yang buruk akan sangat berpengaruh pada user experience dari aplikasi web.\"Progressive<\/a><\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

Karena itulah muncul konsep Progresive Web Apps (PWA). Konsep yang memanfaatkan teknologi terkini dari web guna menghadirkan user experience terbaik dari aplikasi web dan mobile.<\/p>\n

Secara sederhana PWA dapat dijelaskan sebagai aplikasi web yang menggunakan fitur-fitur terkini dari teknologi web sehingga mampu menghadirkan user experience yang nyaris serupa dengan mobile apps.<\/p><\/blockquote>\n

Fitur-fitur Progressive Web Apps<\/h2>\n

Offline Experience<\/strong><\/h3>\n

Dengan teknologi Cache API<\/a> dan IndexedDB<\/a>, data dan layout dapat disimpan di cache sehingga membuka aplikasi PWA dapat dilakukan dengan cepat bahkan dalam keadaan koneksi internet offline.<\/p>\n

Background Sync<\/strong><\/h3>\n

Ini satu keunggulan yang selama ini hanya dimiliki Mobile Native Apps. Namun dengan teknologi Service Worker<\/a> kini aplikasi web juga dapat melakukan sinkronisasi data walaupun aplikasi tidak sedang dibuka.<\/p>\n

Baca juga: <\/strong>Website Trend 2021: Pahami Caranya Jualan via Website <\/a><\/p>\n

Push Notification<\/strong><\/h3>\n

Serupa dengan Background Sync, pada konsep PWA notifikasi dapat di-push ke browser. Sehingga informasi dapat disampaikan tanpa user harus membuka aplikasi yang bersangkutan.<\/p>\n

AppStore dan PlayStore<\/strong><\/h3>\n

Jika dibutuhkan PWA juga dapat didistribusikan melalui Appstore dan Playstore seperti layaknya mobile apps biasa.<\/p>\n

Dengan segala keunggulan PWA, ada beberapa hal yang perlu diperhatikan.<\/p>\n

PWA bukanlah pengganti Responsive Design<\/strong><\/h3>\n

Pada konsep Responsive Design, website mampu menyesuaikan layout sesuai ukuran layar, sehingga tidak perlu membuat banyak versi website untuk ukuran layar yang berbeda. Sementara PWA, user experiencenya yang dibuat menyerupai mobile apps. Sehingga pada dasarnya Responsive Design dan PWA adalah dua hal yang berbeda.<\/p>\n

URL Friendly<\/strong><\/h3>\n

Karena konsep PWA memungkinkan untuk melakukan pengambilan data melalui background process, maka sebenarnya tidak ada kebutuhan untuk melakukan loading halaman. Hal ini berpotensi mencederai upaya SEO, terutama karena jumlah halaman terindex yang jauh berkurang.<\/p>\n

Browser Compatibility<\/strong><\/h3>\n

Karena ini adalah teknologi baru maka issue compatibility browser masih cukup besar.<\/p>\n

Bukan Native<\/strong><\/h3>\n

Bagaimana pun juga, PWA adalah web application. Masih ada fitur-fitur Native Apps yang belum disupport, misalnya Fingerprint Scanner.<\/p>\n

Sejauh ini konsep PWA masih terus dikembangkan, dan semakin banyak yang mengadopsi konsep ini. Untuk mendapatkan gambaran yang lebih baik, kumpulan dari PWA yang sudah ada dapat dilihat di https:\/\/pwa.rocks\/<\/p>\n

Cheers!<\/p>\n

Salam anak Digital Agency Jakarta<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Progressive web apps dapat menjadi solusi saat kita usai membuat sebuah aplikasi mobile, karena masalah yang kemudian muncul adalah bagaimana cara mendistribusikan aplikasi tersebut ke smartphone calon pengguna. Berbeda dengan aplikasi web, aplikasi mobile memang harus diinstal di smartphone pengguna. Karena itulah hadir Google Playstore…<\/p>\n

Read the postApa itu Progressive Web Apps (PWA)<\/span><\/a><\/div>\n","protected":false},"author":1,"featured_media":32336,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9857],"tags":[],"class_list":["post-32334","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-development","excerpt","zoom","full-without-featured","even","excerpt-0"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/posts\/32334","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/comments?post=32334"}],"version-history":[{"count":23,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/posts\/32334\/revisions"}],"predecessor-version":[{"id":33498,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/posts\/32334\/revisions\/33498"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/media\/32336"}],"wp:attachment":[{"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/media?parent=32334"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/categories?post=32334"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dipstrategy.co.id\/blog\/wp-json\/wp\/v2\/tags?post=32334"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}