Pinterest PWA: Meningkatkan Kinerja Seluler Dengan Cara yang Benar
Diterbitkan: 2022-06-18Jika Anda mencari solusi untuk mempercepat pertumbuhan bisnis e-niaga Anda, Anda harus melihat postingan yang menyarankan Anda berinvestasi di M-commerce dan PWA. Saran ini didasarkan pada angka aktual, yang dapat Anda andalkan. Dari meningkatkan konversi berbasis seluler hingga meningkatkan kinerja situs yang mengarah ke pengalaman pengguna yang lebih baik, mengembangkan PWA adalah pilihan yang cocok untuk strategi M-commerce Anda. Untuk mengetahui lebih lanjut tentangnya, kami mengundang Anda untuk mengunjungi studi kasus Pinterest PWA hari ini: Cara memanfaatkan aplikasi web masa depan-berikutnya ini untuk meningkatkan kinerja seluler dan memperbesar ROI Anda seiring waktu.
Isi
Gambaran Umum Pinterest
Sebagai platform sosial bagi pecinta gambar, pencari inspirasi, dan pencari ide untuk hang out, Pinterest memungkinkan semua orang untuk bergabung dan menjelajah melalui kumpulan ide untuk resep, ide dekorasi rumah, ide pakaian, kutipan yang memberdayakan, dan hewan lucu, dan masih banyak lagi.
Setiap posting di Pinterest disebut pin. Ada miliaran pin di Pinterest, dan platform ini bertindak sebagai mesin penemuan visual karena pin mengharuskan Anda mengunggah dalam bentuk jpg atau png daripada teks. Anda dapat menyimpan pin ke papan pribadi atau publik Anda dan menjaga inspirasi Anda tetap teratur di satu tempat, sehingga lain kali, Anda dapat dengan mudah mengambil apa yang Anda cari.
Pinterest didirikan oleh Paul Sciarra, Evan Sharp, dan Ben Silbermann 12 tahun yang lalu. Pinterest menyebut dirinya sebagai "katalog ide dunia". Berkat Pinterest, orang memiliki cara yang jauh lebih mudah untuk menemukan ide bahkan ketika ide tersebut belum disebutkan namanya.
Dengan mengurangi langkah-langkah dari penemuan ke konversi, Pinterest lebih mungkin mengubah browser menjadi prospek dan prospek menjadi penjualan lebih cepat daripada kebanyakan situs media sosial. Lebih dari 433 juta orang aktif di Pinterest per bulan, dengan sekitar 10 juta pengunjung unik, menjadikannya salah satu platform dengan pertumbuhan tercepat.
Mengapa Pinterest Dan PWA Bersatu?
Semuanya dimulai karena Pinterest memiliki audiens internasional yang harus diperhatikan. Oleh karena itu mereka beralih ke web seluler. Pinterest menyadari bahwa aplikasi dan situs webnya tidak dalam performa optimal terbaiknya. Dengan lanskap online yang tumbuh dalam momentum, mereka perlu melakukan sesuatu untuk melepaskan diri dari persaingan.
Penelitian terhadap pengguna web seluler non-autentik memungkinkan mereka melihat daya konversi yang buruk sebesar 1% dari pengalaman web lama dan lambat mereka menjadi pendaftaran, login, atau pemasangan aplikasi. Teknologi aplikasi web berkembang pesat pada saat itu, membawa mereka ke celah yang cukup besar dalam meningkatkan tingkat konversi situs mereka.
Pada tahun 2015, Google memperkenalkan PWA sebagai solusi untuk memberikan nilai terbaik bagi penjual dan pengguna akhir. Itu telah meringankan Pinterest ide di mana untuk berinvestasi untuk pengalaman web seluler baru.
Inilah cara PWA dapat memberikan:
- Untuk pengguna: PWA berupaya meningkatkan pengalaman pengguna dalam skala global, artinya situs seluler Anda akan menghemat bandwidth dan memuat dengan cepat dan responsif meskipun tinggal di tempat dengan koneksi internet rendah atau pemrosesan data terbatas. Interaksi situs yang cepat, mulus, dan mulus membuat semua perbedaan, mendorong perjalanan yang menyenangkan.
- Untuk pedagang: menghemat biaya pengembangan aplikasi yang digandakan karena PWA berjalan melalui browser untuk bekerja di seluruh sistem operasi. PWA dapat bertindak seperti aplikasi asli, tetapi juga dapat menawarkan peluang kepada pedagang untuk menampilkan situs seluler merek mereka di halaman hasil mesin telusur, bahkan tempat teratas dengan pengalaman pengguna yang baik.
Tantangan Pinterest yang Mendorong Integrasi PWA
Data menunjukkan bahwa 80% pengguna Pinterest menggunakan situs di browser seluler alih-alih aplikasi asli. Meskipun tingkat pemasangan aplikasi meningkat dari waktu ke waktu, itu datang dengan cacat: banyak ulasan negatif, tidak puas, frustrasi yang berkaitan langsung dengan web seluler mereka.
Dengan lebih dari setengah pengguna non-AS, membangun web seluler yang sangat baik dengan bandwidth terbatas dan kecepatan pemuatan yang cepat dapat membantu pengguna global mengakses Pinterest dengan lebih mudah. Juga, ada rasio kecil dari pengguna yang tidak diautentikasi yang beralih ke aplikasi seluler, yang tidak memiliki pengalaman yang menyenangkan di aplikasi asli.
Namun, aplikasi masih menghasilkan audiens yang lebih besar dengan interaksi yang lebih besar daripada web seluler. Mengonversi pengguna aplikasi asli ke web seluler bukanlah tugas yang mudah. Tapi Pinterest lebih ambisius dari itu.
Hal lain adalah web seluler Pinterest sebelumnya membutuhkan minimal 23 detik untuk mulai berinteraksi. Pengguna meninjau kehadiran seluler Pinterest sebelum transformasi 2017 sebagai "kutukan jahat ke web seluler." Secara khusus, lebih dari 2.5MB JavaScript dikirim ke bawah untuk waktu yang cukup untuk diurai dan dikompilasi sebelum penyelesaian akhir dari utas utama untuk berdiri interaktif.
Hasil PWA Pinterest
Tentang Fungsi
Untuk mengatasi waktu interaksi yang melelahkan, PWA Pinterest baru mencukur ratusan JavaScript mereka, mengecilkan bundel inti mereka menjadi 150KB dari 650KB awal. Selain itu, mereka berhasil meningkatkan metrik kinerja kritis. Waktu interaktif membutuhkan kurang dari 6 detik, dan cat pertama muncul setelah 1,8 detik, berkurang dari 4,2 detik.
Secara umum, web seluler sekarang lebih ringan dan responsif. Platform dipenuhi dengan gambar, tetapi semua elemen disejajarkan dengan singkat dan jelas. Transisi halaman juga bekerja dengan baik sesuai harapan mereka.
Hasil
Transformasi 2017 menghasilkan peningkatan 103% dalam pengguna aktif mingguan di web seluler baru dari tahun ke tahun.
Perbandingan PWA Pinterest dengan web seluler lama:
- 40% lebih tinggi dalam waktu yang dihabiskan di tempat selama 5 menit
- Peningkatan 44% pada iklan yang dibuat pengguna
- 50% peningkatan rasio klik-tayang iklan
- 60% lebih tinggi dalam keterlibatan inti
Perbandingan PWA Pinterest dengan aplikasi asli:
- 5% lebih tinggi dalam waktu yang dihabiskan di tempat selama 5 menit
- 2% peningkatan iklan yang dibuat pengguna
- Rasio klik-tayang iklan tetap
- Sekitar 2-3% lebih tinggi dalam keterlibatan inti
Hasilnya mengungkapkan rahasia terbesar untuk meningkatkan keuntungan dari membangun kehadiran online dan menegaskan keyakinan kami bahwa pengalaman pengguna yang sangat baik mendorong tingkat interaksi pengguna yang mengesankan, meningkatkan konversi dari waktu ke waktu.
Pinterest PWA semakin dekat untuk meniru aplikasi asli. Oleh karena itu tidak ada perubahan yang layak dalam fungsionalitas. Namun, penggunaan penyimpanan meminta pengguna iOS 56MB dan pengguna Android 9.6MB untuk memberikan pengalaman yang sama seperti yang disediakan PWA, dengan lebih sedikit beban pada unduhan 150KB yang diperkecil & di-zip. Semua berkat fitur add-to-home-screen yang fantastis.
Apa yang Dapat Anda Pelajari dari Perubahan Aplikasi Seluler Pinterest?
Nama itu "Project Duplo," yang berasal dari inspirasi kesederhanaan dan aksesibilitas pada musim panas 2017 ketika tim pengembang platform web dan insinyur pertumbuhan lahir. Ketika mereka memeriksa kinerja situs lama untuk pengukuran, web seluler mereka dapat menangani kurang dari 10% pendaftaran sementara web desktop menghasilkan lima kali lipat dari jumlah tersebut.
Yang istimewa dari proyek ini adalah hanya membutuhkan waktu 3 bulan bagi para insinyur Pinterest untuk membangun, mengintegrasikan, dan meluncurkan situs seluler baru, juga PWA terbesar di dunia. Jadi bagaimana mereka melakukannya? Dalam retrospeksi, mereka berbagi kekhawatiran yang sama menjadi pengadopsi awal dalam sudut pandang 2 tahun setelah merilis istilah Progressive Web App.
Mengungkap Kerangka
Menghitung waktu singkat pembuatan dan pengiriman proses penulisan ulang lengkap di fitur Pinterest adalah Gestalt. Pustaka UI sumber terbuka ini membantu mereka menyelesaikan proyek dalam waktu seperempat. Rangkaian komponen dari Gestalt memungkinkan mereka membangun bahasa desain yang unik untuk secara konsisten dan mudah membuat halaman yang menakjubkan tanpa menyentuh CSS.
Kemudian suite lain dibuat hanya untuk web seluler, dengan komponen tata letak khusus untuk halaman dengan spasi tertentu. Untuk menghasilkan pengembangan UI yang cepat dan tahan bug, batas default PageContainer harus mengecualikan FullWidth, tidak termasuk batas FixedHeader. Dan React 16 digunakan untuk setiap pengembangan web yang dilakukan di Pinterest.
Mereka memperhatikan Service Worker karena PWA mendapatkan ketenarannya dari memanfaatkan penggunaan konvensional dengan perpustakaan Workbox untuk menghasilkan dan mengelola. Pinterest hari ini memprioritaskan strategi cache-first untuk mengubah semua JavaScript atau CSS bundel dan UI shell aplikasi mereka.
Bagaimana Mereka Mempercepat Kecepatan
Performa dan kecepatan terutama merupakan episentrum tingkat atas dalam transformasi Pinterest. Setelah pengoptimalan, Pinterest telah mengecilkan file JavaScript dari 490KB menjadi 190KB, melakukan dari tingkat default pemecahan kode di rute, kemudian mendorong penggunaan komponen <Loader> dengan pemecahan kode dari tingkat komponen.
Mengandalkan sistem pramuat di sisi server-klien juga berfungsi karena membantu mempercepat pemuatan dengan meningkatkan pemuatan halaman awal dan perubahan di rute sisi klien.
Untuk memastikan pengalaman yang cepat namun sangat mirip asli, Pinterest mengandalkan toko redux yang dinormalisasi, yang bertanggung jawab untuk mengubah rute dalam waktu dekat dengan memiliki satu sumber model kebenaran seperti Pin atau tindakan pengguna.
Dalam tampilan konkret, Anda hanya melihat Pin dengan konten terbatas. Anda akan membacanya terlebih dahulu sampai memutuskan untuk mengklik untuk informasi lebih lanjut. Dengan begitu, cukup waktu untuk mengambil detail dari server. Semua ini dimungkinkan karena data Pin dinormalisasi untuk massa.
Takeaways Kunci
Pinterest PWA memimpin dalam adopsi PWA dan sangat berhasil. Mereka mendengar keluhan penggunanya dan mengambil tanggung jawab yang sesuai, mengembangkan web seluler baru yang melakukan dan mengonversi hampir menyerupai apa yang dapat dibawa oleh aplikasi asli.
Semoga, melalui studi kasus yang menginspirasi ini, Anda akan berpikiran terbuka untuk belajar lebih banyak tentang PWA dan mencoba melihat bagaimana hal itu dapat membantu Anda tetap kuat dan berbahaya. Jika Anda sedang mencari seorang ahli selama satu dekade dalam pengembangan PWA untuk Magento, platform e-niaga dengan hasil teratas saat ini, jangan lupa untuk memeriksa Tigren.
Untuk mengetahui lebih lanjut tentang solusi PWA Magento premium kami, hubungi Tigren dan beri tahu kami di mana Anda mengalami masalah.