Local blog for Indonesian speaking developers
The Mobile Modern Web: Laporan Tahunan
02 June 2017
Ditulis oleh Rahul Roy-chowdhury, VP Product Management, Chrome
Apa kemajuan yang didapat dalam setahun. Tahun lalu di Google I/O,
kami menginformasikan
bahwa mobile web sangat mendukung kegiatan bisnis. Berbagai teknologi baru seperti AMP dan Progressive Web App (PWA) telah mengusung berbagai kemampuan baru, kinerja yang lebih baik, dan workflow yang lebih efisien untuk mobile web.
Setahun telah berlalu: lebih dari dua miliar laman AMP telah dibuat dan "PWA" telah terbukti lebih dari sekadar jargon—kini ia telah menjadi cara bagi banyak bisnis di seluruh dunia dalam membangun perangkat mobile. Untuk detail selengkapnya, lihatlah video Google I/O tentang
laporan tahunan mobile web
, atau bacalah tulisan di bawah tentang bagaimana semua teknologi ini membuat mobile web modern dipakai oleh banyak orang.
Momentum
Merangkum semua
kisah sukses
hebat dari seluruh dunia dalam satu entri blog merupakan pekerjaan berat, namun inilah beberapa garis besarnya.
Untuk meningkatkan kinerja situs mobile web Wego, mereka membangun laman AMP menggunakan
amp-install-serviceworker
untuk transisi ke pengalaman PWA yang cepat. Rata-rata waktu pemuatan laman berkurang dari 12 detik menjadi kurang dari satu detik, dan conversion rates bertambah sebanyak 95%.
Ketika Forbes membangun ulang mobile website-nya sebagai PWA, mereka memulai dengan memikirkan kembali pengalaman seperti apa yang didapat pengguna pada ponsel. Daripada memperbarui situs utama mereka sedikit demi sedikit, Forbes mengintegrasikan teknologi PWA untuk menyediakan pengalaman seperti dalam aplikasi. Mereka melihat peningkatan seketika dan interaction rate meningkat lebih dari dua kali lipat sejak diluncurkan.
Ola
, rental mobil terkemuka di India, membangun PWA dan melihat bahwa 20% pengguna yang memesan menggunakan PWA, telah menguinstall aplikasi mereka sebelumnya. Dengan mengurangi jumlah ruang penyimpanan yang dibutuhkan, PWA memungkinkan mereka re-engage para pengguna secara efektif.
Kisah sukses lainnya adalah
Twitter Lite
, PWA yang meminimalkan penggunaan data, lebih fleksibel pada jaringan mobile yang tidak dapat diandalkan, dan menggunakan ruang penyimpanan pada perangkat kurang dari 1 MB. Pengalaman mobile web baru dari Twitter juga dioptimalkan untuk kecepatan, launch time lebih cepat hingga 30% serta navigasi yang lebih cepat dalam situs. Mereka menemukan bahwa pengguna menghabiskan waktu 2,7x lebih banyak di situs, dan hasilnya terlihat dari peningkatan tweets 76% di PWA daripada situs mobile web mereka sebelumnya. Twitter melihat interaksi yang luar biasa pada 1 juta sesi yang dimulai dalam sehari dari ikon yang ditambahkan ke homescreen Android.
Pengalaman yang Disempurnakan
Pengguna berharap banyak dari perangkat mobile mereka, dan kami telah menambahkan segudang API dalam setahun terakhir ini untuk memenuhi permintaan itu. Web seluler bisa mendukung kasus penggunaan lebih banyak dan melakukan hal yang lebih banyak daripada sebelumnya. Beberapa fitur unggulan:
Add to Homescreen yang Ditingkatkan:
Di awal tahun ini kami telah memperkenalkan
Add to Homescreen yang Ditingkatkan
, yang mengintegrasikan PWA jauh lebih dalam ke sistem operasi Android. Kini, selain ditampilkan di layar utama, PWA juga ditampilkan di launcher dan settings Android bersama aplikasi native, dan juga bisa dibuka sebagai respons terhadap pengguna yang mengeklik tautan di Chrome atau aplikasi lain.
Pembayaran:
Checkout bisa menjadi proses yang rumit. Untuk meningkatkan alur pembayaran di web, kami telah meluncurkan API pembayaran one-tap yang disebut
Payment Request
. Penggunaan API ini memungkinkan aplikasi web mendukung mekanisme pembayaran kartu kredit dan Google seperti Android Pay. Kami juga baru saja mengumumkan bahwa sekarang integrasi API ini sudah bisa dilakukan dengan
aplikasi pembayaran tambahan
.
Konsumsi Media:
Lebih dari 70% lalu lintas internet berupa video. Agar mendapat pengalaman media web seluler yang hebat, kami memberi pengguna kontrol pemutaran yang lebih banyak dengan Media Session API, pemutaran layar penuh yang ditingkatkan dengan Screen Orientation API, dan menyempurnakan fitur untuk offline dengan Background Fetch. Untuk mengetahui selengkapnya, lihat
praktik terbaik media web seluler
kami dan lihat bagaimana API tersebut bisa bergabung dalam
demo PWA untuk Media
.
Tools
Kami juga telah bekerja keras untuk meningkatkan dan memperluas rangkaian alat yang memungkinkan Anda membangun pengalaman memikat di web.
Lighthouse
adalah alat bantu otomatis baru untuk mengukur kualitas pengalaman web. Alat ini menjalankan hampir 100 audit terhadap aplikasi web Anda, memeriksa semua hal mulai dari kinerja laman hingga efisiensi byte, hingga aksesibilitas, dan memberi Anda skor rangkuman. Integrasi baru dengan DevTools di Chrome memungkinkan Anda untuk menjalankan audit Lighthouse tanpa meninggalkan browser.
Polymer 2.0
adalah rilis utama berikutnya dari library Polymer, yang dibangun ulang dari nol untuk memanfaatkan fitur baru yang terbaik dari platform web modern. Rilis ini menggunakan Web Component API baru yang disertakan dalam Chrome dan Safari. Semuanya bersifat modular dan yang paling penting - kini 10% lebih cepat dan 80% lebih kecil.
Chrome berkomitmen untuk memastikan Anda bisa mengembangkan dengan mudah, berinteraksi dengan pengguna, dan membangun bisnis yang semakin berkembang di seputar web. Untuk berita terbaru,
langgan
saluran YouTube kami dan ikuti kami di Twitter
@ChromiumDev
.
1 comment :
Robert Welain
08 August, 2018 06:33
Thank you for sharing
this tutorial
with us, guys! You are doing a great thing! Keep it up!
Reply
Delete
Add comment
Load more...
Subscribe
Labels
actions on google
admob
agency
amp
android
assistant
augmented reality
chrome
dialogflow
documentation
domains
doubleclick
firebase
flutter
gmail
google bisnisku
google cloud
google code-in
google design
google font
google for entrepreneurs
google io
google maps
google partners
google play
google sign-in
gsuite
ios
launchpad
launchpad accelerator
machine learning
material design
pagespeed
progressive web app
python
tensorflow
vr
web
Archive
2018
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2017
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2016
Dec
Nov
Google
on
Follow @googledevsid
Thank you for sharing this tutorial with us, guys! You are doing a great thing! Keep it up!
ReplyDelete