Progressive Web App

Progressive Web App (PWA) adalah aplikasi web yang menggunakan progressive enhancement untuk memberikan pengalaman yang lebih andal kepada pengguna, menggunakan kemampuan baru untuk memberikan pengalaman yang lebih terintegrasi, dan dapat diinstal. Dan, karena ini adalah aplikasi web, itu bisa menjangkau siapa saja, di mana saja, di perangkat apa saja, semua dengan satu codebase. Setelah diinstal, PWA akan terlihat seperti aplikasi lainnya, khususnya:

  • Aplikasi ini memiliki ikon di layar utama, peluncur aplikasi, launchpad, atau menu start.
  • Tombol ini muncul saat Anda menelusuri aplikasi di perangkat.
  • Browser akan terbuka di jendela mandiri, yang sepenuhnya terpisah dari antarmuka pengguna browser.
  • Aplikasi ini memiliki akses ke tingkat integrasi yang lebih tinggi dengan OS, misalnya, penanganan URL atau penyesuaian bilah judul.
  • Berfungsi secara offline.

Platform web

Web adalah platform yang luar biasa. Perpaduan universalitasnya di seluruh perangkat dan sistem operasi, model keamanannya yang berfokus pada pengguna, dan fakta bahwa tidak ada satu perusahaan yang mengontrol spesifikasi atau implementasinya, menjadikannya platform yang andal untuk mengirimkan software.

Dengan kemampuan tautan yang melekat pada web, Anda dapat menelusurinya dan berbagi apa yang Anda temukan dengan siapa pun, di mana pun. Setiap kali Anda membuka situs, ini adalah versi terbaru yang di-deploy oleh penayang, dan pengalaman Anda dengan situs tersebut dapat bersifat sementara atau permanen sesuai keinginan Anda.

Aplikasi web dapat menjangkau siapa saja, di mana saja, di perangkat apa saja dengan satu codebase. Bagi developer, web juga menawarkan mekanisme deployment yang transparan dan mudah. Tidak perlu paket, tidak ada peninjauan konten tambahan, atau penundaan pembaruan. Pengguna selalu mendapatkan versi terbaru saat mengunjungi aplikasi Anda. Dengan kemampuan dan teknik baru, aplikasi web kini dapat memungkinkan Anda berinteraksi atau melihat konten bahkan saat offline, suatu rintangan yang tidak mungkin diatasi beberapa tahun lalu.

Aplikasi khusus platform

Aplikasi khusus platform, di perangkat seluler dan desktop, dikenal sebagai aplikasi yang kaya dan andal. Iklan ini selalu ada, di layar utama, dok, dan taskbar. Mereka berfungsi terlepas dari koneksi jaringan, dan diluncurkan dengan pengalaman mandiri mereka sendiri. Aplikasi dapat membaca dan menulis file dari sistem file lokal, mengakses hardware yang terhubung melalui USB, serial, atau Bluetooth, dan berinteraksi dengan data yang disimpan di perangkat Anda, seperti kontak dan acara kalender. Pada aplikasi khusus platform, Anda dapat mengambil gambar, memutar lagu yang tercantum di layar utama, atau mengontrol pemutaran media saat berada di aplikasi lain. Aplikasi ini terasa seperti bagian dari perangkat yang digunakan.

Tantangan untuk aplikasi khusus platform adalah aplikasi tersebut tidak kompatibel dengan beberapa platform dan perangkat, sehingga tidak mudah, jika memungkinkan, memindahkan aplikasi Android ke iOS atau iOS ke Windows atau ChromeOS tanpa membuat aplikasi baru dari awal.

Menghadirkan yang terbaik dari keduanya

Jika Anda mempertimbangkan aplikasi platform dan aplikasi web dalam hal kemampuan dan jangkauan, aplikasi platform mewakili kemampuan terbaik, sedangkan aplikasi web mewakili jangkauan terbaik. Progressive Web App berada di titik temu antara kemampuan aplikasi platform dan jangkauan aplikasi web. Progressive Web App menyertakan fitur dari kedua dunia tersebut.

Web

  • Penautan
  • Dapat diakses secara default
  • Di mana-mana
  • Mudah Di-deploy
  • Mudah Diperbarui
  • Siapa saja dapat memublikasikan

Aplikasi platform

  • Dapat digunakan saat offline
  • Performa tinggi
  • Integrasi Perangkat
  • Pengalaman mandiri
  • Ikon Diinstal
  • Kaya dan andal

Adopsi memiliki keuntungan

Hulu, layanan streaming video di AS, membuat versi Progressive Web App dari pengalaman mereka untuk menggantikan aplikasi desktop yang mendapatkan ulasan pengguna dan penggunaan yang buruk. Seperti yang disampaikan di Google I/O 2019, seorang developer dapat melakukan riset dan menerapkan pengalaman ini dari aplikasi web yang sudah ada dalam dua minggu.

Dalam waktu lima bulan, 96% pengguna aplikasi lama mereka telah mengadopsi PWA, dengan peningkatan kunjungan kembali sebesar 27% dan peningkatan engagement sebesar 5,5%. Karena ada di peluncur dan di taskbar, PWA lebih mudah ditampilkan kembali dibandingkan jika PWA hanya ada di tab.

JD.ID, platform e-commerce di Indonesia yang menyediakan layanan pengiriman untuk banyak produk, ingin memperluas kehadiran di internet dengan berfokus pada performa dan pengalaman solid yang tidak bergantung pada jaringan untuk PWA mereka. Dengan pengalaman yang ditingkatkan ini, mereka meningkatkan rasio konversi seluler secara keseluruhan sebesar 53%, 200% untuk pengguna yang menginstal, dan meningkatkan pengguna aktif harian sebesar 26%.

Clipchamp adalah editor video online untuk kelas desktop dalam browser yang memungkinkan siapa saja menceritakan kisah yang layak dibagikan melalui video. Mereka mendapati retensi pengguna 9% lebih tinggi pada PWA dibandingkan dengan pengguna aplikasi desktop standar, dan mendapati penginstalan PWA mereka meningkat dengan rasio 97% setiap bulan dalam lima bulan pertama peluncurannya.

Gravit Designer milik Corel Corporation adalah alat desain vektor kelas desktop yang canggih dan melayani puluhan ribu pengguna aktif harian yang membutuhkan software ilustrasi vektor yang kaya, terjangkau, dan mudah diakses. Sejak menambahkan PWA sebagai opsi penginstalan untuk pengguna, mereka melihat pengguna PWA 24% lebih aktif, 31% lebih banyak pengguna berulang, dan pengguna PWA 2,5 kali lebih cenderung membeli Gravit Designer PRO, dibandingkan dengan platform dan opsi penginstalan mereka lainnya.

Inovasi terbaru game streaming

Contoh bagus manfaat Progressive Web App adalah industri platform streaming, termasuk game cloud dan komputasi jarak jauh. Sejak 2021, sebagian besar penyedia game cloud telah meluncurkan Progressive Web App, yang memungkinkan Anda bermain game konsol dari perangkat apa pun, dan hanya browser atau penginstalan PWA: iPhone, Android, iPad, laptop, Mac, atau PC. Amazon Luna, Microsoft Xbox Cloud Gaming, Facebook Gaming, Google Stadia, Nvidia GeForce Now, dan BlueStacks X menawarkan solusi game cloud melalui browser sebagai PWA. Semuanya memberikan pengalaman luar biasa dengan performa yang mendekati native di semua platform berkat teknologi web seperti WebRTC, WebAssembly, dan GamePad API.

Tantangan

Setelah membahas keuntungan menggunakan platform web untuk memublikasikan PWA, penting juga untuk mengetahui tantangan yang mungkin Anda hadapi.

Kompatibilitas lintas browser

Apple adalah perusahaan penting untuk dunia multi-perangkat, yang memiliki iOS, iPadOS, macOS, dan Safari. Meskipun Apple tidak pernah menggunakan istilah PWA di publik, mereka telah mendukung teknologi untuk membuat PWA dapat diinstal dan dapat digunakan secara offline sejak tahun 2018 di Safari untuk iPhone dan iPad.

Namun, penerapan spesifikasi PWA Apple melewatkan banyak fitur yang dimiliki browser lain, khususnya browser yang didukung oleh mesin Chromium.

Di tengah, kami juga memiliki Firefox dan mesin Gecko-nya dengan implementasi yang mencakup lebih banyak spesifikasi PWA di Android, dan lebih sedikit kemampuan penginstalan di desktop.

Batasannya meliputi kurangnya notifikasi push, API integrasi (seperti Web Bluetooth atau WebNFC), dan teknik promosi penginstalan yang membantu pengguna mengetahui bahwa mereka dapat menginstal situs saat ini untuk mendapatkan pengalaman aplikasi. Selain itu, ada beberapa bug pada fitur yang diterapkan.

Seperti halnya semua pengembangan web, pengujian pengalaman Anda di setiap platform bersifat wajib saat merilis PWA, dan saat browser atau versi OS baru yang besar dirilis. Anda harus selalu memberikan solusi penggantian atau pengalaman alternatif saat fitur tidak tersedia.

Pengetahuan tentang PWA

Sebagai developer PWA, Anda mungkin akan menghadapi masalah awareness, baik di sisi bisnis maupun pengguna. Beberapa pemilik bisnis tidak akan tahu tentang PWA atau akan memiliki kesalahpahaman tentang kekuatan dan tantangan Progressive Web App.

Saat Anda memublikasikan PWA, tantangan Anda berikutnya adalah memastikan pengguna memahami bahwa situs dapat diinstal, yang mengarah ke pengalaman aplikasi terinstal.

Tantangan penginstalan lebih signifikan di beberapa platform, seperti iOS dan iPadOS, dan terkadang desainer UX menyertakan layar yang menjelaskan kepada pengguna cara menginstal aplikasi.

Kompatibilitas

Perlu diingat bahwa Progressive Web App hanyalah aplikasi web, jadi konten dan layanan berjalan di atas spesifikasi dan protokol standar. Oleh karena itu, PWA secara teknis berjalan di mana pun web berjalan; Anda tidak memerlukan platform tersebut agar kompatibel dengan "spesifikasi PWA" apa pun.

Namun, ketika kita berbicara tentang PWA dan kompatibilitas, biasanya, kita memikirkan kemampuan untuk melewati batas browser dan konteks khusus online: penginstalan ikon dan dukungan offline.

Selain dukungan platform web klasik, mari kita periksa dukungan untuk fungsi aplikasi dasar, seperti penginstalan ikon dan kemampuan offline.

    97 %

    Browser yang siap digunakan untuk offline

    88 %

    Pengguna web dapat menginstal PWA

Data yang bersumber dari StatCounter dan Dapatkah Saya Gunakan.

Desktop dan laptop

Di dunia perangkat multifaktor, sulit untuk mengetahui apa lagi perangkat {i>desktop<i}. Namun, setidaknya dari sudut pandang sistem operasi, browser dan toko ini kompatibel dengan penginstalan PWA dan kemampuan offline:

Windows 10 dan 11
Google Chrome (dari versi 73), Microsoft Edge (dari versi 79), Microsoft Store
ChromeOS
browser Chrome bawaan (dari versi 72), Play Store (dari versi 85)
macOS, Linux, dan Windows 7 serta 8.x
Google Chrome (dari versi 73), Microsoft Edge

Pada video berikut, pengguna menginstal PWA dari browser di komputer desktop, lalu mengaksesnya seperti aplikasi lain dengan jendela mandiri.

Perangkat seluler

Berbicara tentang ponsel dan tablet, Progressive Web App dapat diinstal dengan kemampuan offline menggunakan browser dan app store berikut:

iOS dan iPadOS
Safari (sejak iOS 11.3), AppStore (sejak iOS/iPadOS 14, dengan beberapa batasan), konfigurasi seluler untuk distribusi perusahaan.
Android
Firefox, Google Chrome, Samsung Internet, Microsoft Edge, Opera, Brave, Browser Huawei, Baidu, UCWeb, Play Store (dari versi 72 dengan menginstal Google Chrome, atau browser yang kompatibel dengan TWA), Galaxy Store, iframe Play Terkelola untuk distribusi perusahaan.

Pada video berikut, pengguna menginstal PWA dari browser di perangkat seluler menggunakan dialog browser, dan juga menggunakan menu Tambahkan ke Layar utama.

Perangkat lainnya

Beberapa perangkat kecil lainnya mendukung PWA, seperti konsol game (Xbox dengan Microsoft Store) atau perangkat XR (Microsoft Hololens, rencana untuk Oculus Facebook). Namun, perangkat lain yang memiliki browser biasanya tidak menerima PWA, termasuk:

  • Konsol game
  • Smart TV
  • Smartwatch
  • Mobil

PWA Anda akan selalu berfungsi di browser semua perangkat dengan batasan khususnya. Kemampuan untuk bekerja di banyak perangkat ini memungkinkan Anda membuat perjalanan multi-perangkat, yang memungkinkan pengguna memulai tugas di satu perangkat dan menyelesaikannya di perangkat lain, dengan data yang disinkronkan di seluruh perangkat, dengan aplikasi yang sama persis.

Referensi