Apa itu Aplikasi Web Progresif dan Bagaimana Cara Menginstalnya?

Apa itu Aplikasi Web Progresif dan Bagaimana Cara Menginstalnya?

Aplikasi mendominasi ponsel Anda. Untuk waktu yang lama, aplikasi tidak memengaruhi desktop atau browser Anda dengan cara yang sama. Itu telah berubah dalam beberapa tahun terakhir. Progressive Web Apps (PWA) berkembang pesat dan mengubah interaksi kita dengan segala macam situs web.





Tapi apa sebenarnya Aplikasi Web Progresif itu? Apa yang dilakukan PWA yang tidak dilakukan situs web? Inilah yang perlu Anda ketahui tentang Aplikasi Web Progresif.



Apa itu Aplikasi Web Progresif?

Progressive Web Apps adalah aplikasi web yang menawarkan situs reguler kepada pengguna tetapi muncul sebagai aplikasi seluler asli. PWA berusaha untuk membawa kegunaan aplikasi seluler asli ke set fitur browser modern, mengambil keuntungan penuh dari kemajuan di kedua area pengembangan.





Lalu, apa yang mendefinisikan PWA?

  • Universal : PWA harus bekerja dengan mulus (hampir) untuk setiap pengguna, apa pun browsernya.
  • Responsif : PWA harus bekerja dengan perangkat apa pun, seperti laptop, tablet, ponsel cerdas, dan sebagainya.
  • Desain : desain harus meniru aplikasi seluler asli, yang berarti menu yang disederhanakan dan mudah ditemukan, dengan interaktivitas sederhana untuk fitur-fitur canggih.
  • Aman : PWA harus menggunakan HTTPS untuk menjaga keamanan data pengguna.
  • Dapat ditemukan: pengguna dapat menemukan PWA, dan mereka mudah diidentifikasi sebagai aplikasi (bukan 'situs').
  • Keterikatan: PWA harus memiliki akses ke fitur keterlibatan asli seperti pemberitahuan push.
  • Pembaruan: PWA tetap up to date, melayani versi terbaru dari layanan atau situs.
  • Instalasi: memungkinkan pengguna untuk dengan mudah 'memasang' PWA ke layar beranda mereka tanpa memerlukan toko aplikasi.
  • Membagikan: PWA hanya memerlukan satu URL untuk dibagikan, tanpa instalasi apa pun.

Seperti yang Anda lihat, PWA bertujuan untuk memberikan pengalaman situs web lengkap kepada pengguna dengan fitur yang disederhanakan dan desain antarmuka aplikasi asli.



Bagaimana Cara Kerja Aplikasi Web Progresif?

Kunci untuk Aplikasi Web Progresif adalah pekerja layanan browser.

Service worker adalah skrip yang berjalan di latar belakang browser Anda, 'terpisah dari halaman web, membuka pintu ke fitur yang tidak memerlukan halaman web atau interaksi pengguna.' Anda mungkin menggunakan pekerja layanan seperti pemberitahuan push dan sinkronisasi latar belakang saat ini, tetapi masa depan PWA yang segera memberikan skrip ini kekuatan yang lebih besar.



Dengan demikian, pekerja layanan membentuk dasar standar PWA, menggunakan cache web untuk hasil yang hampir seketika.

Sebelum service worker, skrip cache browser masuk adalah Application Cache (atau App Cache). Fitur App Cache dalam berbagai layanan offline-pertama tetapi agak rawan kesalahan. Selain itu, App Cache memiliki beberapa batasan yang terkenal, seperti Sebuah Daftar Terpisah menjelaskan.



Tetapi masalah utama bagi pengembang adalah kurangnya interaksi langsung dengan persis bagaimana AppCache bekerja, menghentikan pengembang secara akurat memperbaiki masalah yang muncul. Pada gilirannya, situs web dan layanan dengan fungsionalitas offline penuh adalah pilihan yang berisiko.

Namun, pekerja layanan hanya bertahan selama tindakan mereka diperlukan. Di PWA, saat Anda mengklik sesuatu atau menggunakan fitur, pekerja layanan akan beraksi. Pekerja layanan (ingat, ini adalah skrip) memproses acara, memutuskan apakah cache offline dapat menyelesaikan permintaan. Idenya adalah bahwa ada beberapa cache offline untuk dipilih oleh PWA, memberikan jangkauan fungsionalitas offline yang jauh lebih luas.

Selain itu, cache tidak hanya untuk meningkatkan kecepatan offline. Misalnya, Anda menuju ke PWA, tetapi koneksi Anda sangat tidak merata. Pekerja layanan menyajikan cache sebelumnya, berfungsi penuh, tanpa mengganggu pengalaman Anda.

Dukungan Browser Aplikasi Web Progresif

Ada dua persyaratan untuk menggunakan Progressive Web App: browser yang kompatibel dan layanan yang mendukung PWA.

Pertama, mari kita lihat browser. Anda memiliki dua opsi untuk memeriksa dukungan browser PWA. Yang pertama adalah milik Jake Archibald Apakah Pekerja Layanan Siap? ? yang dengan mudah menampilkan status siap-PWA dari browser utama, ditambah internet Samsung.

Untuk gambaran lebih rinci tentang dukungan browser PWA, Anda harus memeriksa Dapatkah saya menggunakan? , sebuah situs web yang mengkhususkan diri dalam daftar implementasi berbagai teknologi web dan browser berdasarkan versi browser. Misalnya, jika Anda memasukkan 'pekerja layanan' di bilah pencarian, Anda akan menemukan tabel yang menampilkan nomor versi yang digunakan oleh setiap browser untuk mengimplementasikan pekerja layanan PWA.

Tabel Can I Use Service Worker mengonfirmasi bahwa semua browser utama mendukung PWA. Ini juga menggambarkan dukungan PWA untuk beberapa browser desktop dan browser seluler alternatif.

Memecahnya sedikit lagi:

  • Peramban desktop (Dukungan Penuh): Chrome, Firefox, Opera, Edge, Safari
  • Peramban desktop (Dukungan Sebagian/Versi Kedaluwarsa): Peramban QQ, Peramban Baidu
  • Peramban seluler (Dukungan Penuh): Chrome, Firefox, Safari, UC Browser, Samsung internet, Mint Browser, WeChat
  • Browser seluler (Dukungan Sebagian/Versi Kedaluwarsa): Peramban QQ, Peramban Android, Opera Mobile

Jadi, semua browser utama mendukung PWA. Microsoft Edge dan Safari adalah tambahan terbaru untuk daftar dukungan penuh. Sebaliknya, baik QQ Browser dan Baidu Browser sekarang menggunakan versi lama dan dengan demikian telah turun ke tingkat kedua.

Cara Menemukan dan Memasang Aplikasi Web Progresif

Sekarang setelah Anda mengetahui browser mana yang akan digunakan, Anda dapat memikirkan untuk mencari dan menginstal PWA. Untuk contoh ini, saya akan menggunakan Samsung Galaxy S8 dengan Google Chrome.

Aplikasi Web Progresif ada di mana-mana. Banyak perusahaan telah mengadaptasi situs dan layanan mereka untuk menawarkan versi Progressive Web App. Dalam banyak kasus, Anda pertama kali akan menemukan PWA saat membuka beranda atau situs layanan seluler, yang memicu Tambahkan ke Layar Utama kotak dialog.

Lihat video di bawah ini untuk melihat apa yang terjadi ketika Anda mengunjungi Situs seluler Twitter .

Tentu saja, mengunjungi situs yang tak terhitung jumlahnya dan berharap melihat pemicu layar beranda tidak berguna. Bahkan, itu benar-benar memakan waktu. Untungnya, Anda tidak perlu melakukan itu karena ada beberapa situs yang didedikasikan untuk membuat katalog PWA.

Percobaan pertama jaring luar . Ini mencantumkan rentang PWA yang cukup baik, dengan opsi baru yang sering muncul. Selanjutnya, coba pwa.rocks. Ini memiliki pilihan yang lebih kecil, tetapi beberapa PWA berguna yang ingin Anda tambahkan ke perangkat Anda.

Selanjutnya, pada Januari 2019, Chrome 72 untuk Android dikirimkan dengan Trusted Web Activity (TWA). TWA memungkinkan tab Chrome dibuka dalam mode mandiri. Pada gilirannya, ini memungkinkan PWA untuk ditampilkan di toko aplikasi Google Play. Beberapa PWA pertama yang muncul di Google Play adalah Twitter Lite , Instagram Lite, dan Google Maps Go , dengan lebih banyak set untuk muncul dari waktu ke waktu.

Galeri Gambar (2 Gambar) Mengembangkan Mengembangkan Menutup

Akankah Aplikasi Web Progresif Menggantikan Aplikasi Asli?

Aplikasi Web Progresif adalah langkah hibrida yang sangat baik antara browser Anda dan aplikasi seluler asli. Akankah PWA menggantikan aplikasi asli sepenuhnya? Itu tidak keras dari saya. PWA sangat bagus sebagai penawaran yang ringan, tetapi mengingat bahwa mereka saat ini sebagian besar berfokus pada mereplikasi situs dan layanan yang ada, mereka tidak akan menggantikan aplikasi asli.

Setidaknya, tidak untuk saat ini.

cara membuat vektor logo di ilustrator

PWA memang bekerja. Data yang tersedia di PWA Stats juga mendukung hal ini. Berikut adalah beberapa angka menarik yang menggambarkan bagaimana PWA mengubah interaksi kita dengan situs web yang umum digunakan:

  • Trivago melihat peningkatan keterlibatan 150 persen bagi pengguna yang menambahkan PWA mereka ke layar beranda.
  • Beranda PWA 'Forbes sepenuhnya dimuat hanya dalam 0,8 detik,' sementara tayangan per kunjungan naik 10 persen. PWA Forbes juga melihat durasi sesi pengguna berlipat ganda.
  • Twitter Lite mengalami peningkatan 65 persen di halaman per sesi, dengan peningkatan 75 persen dalam tweet. Ini juga interaktif 'dalam waktu kurang dari 5 detik melalui 3G.'
  • Alibaba melihat peningkatan 76 persen dalam konversi seluler.

PWA belum mainstream. Namun dengan berbagai manfaat yang mereka berikan, seperti menghemat ruang di perangkat Anda , Anda akan mendengarnya lebih banyak di masa mendatang.

Membagikan Membagikan Menciak Surel Panduan Pemula untuk Menganimasikan Pidato

Menganimasikan pidato bisa menjadi tantangan. Jika Anda siap untuk mulai menambahkan dialog ke proyek Anda, kami akan merinci prosesnya untuk Anda.

Baca Selanjutnya Topik-topik yang berkaitan Tentang Penulis Gavin Phillips(945 Artikel Diterbitkan)

Gavin adalah Editor Junior untuk Windows dan Penjelasan Teknologi, kontributor tetap untuk Podcast yang Sangat Berguna, dan peninjau produk reguler. Dia memiliki BA (Hons) Penulisan Kontemporer dengan Praktik Seni Digital yang dijarah dari perbukitan Devon, serta lebih dari satu dekade pengalaman menulis profesional. Dia menikmati banyak teh, permainan papan, dan sepak bola.

More From Gavin Phillips

Berlangganan newsletter kami

Bergabunglah dengan buletin kami untuk kiat teknologi, ulasan, ebook gratis, dan penawaran eksklusif!

Klik di sini untuk berlangganan