Pengantar teknologi yang tersedia.
Mengapa kecepatan pemuatan halaman itu penting?
Sebagian besar pengguna secara rutin mengidentifikasi pemuatan halaman yang lambat sebagai sumber frustrasi utama (54% dalam studi pengguna yang dilakukan oleh Google). Jadi, tidaklah mengherankan bahwa pemuatan halaman yang lebih cepat memberikan hasil yang lebih baik bagi bisnis. Sebenarnya, jika pengunjung merasa frustrasi bahkan sebelum mereka berinteraksi dengan situs web, kecil kemungkinan mereka akan bertahan cukup lama untuk menghargai nilainya. Faktanya, studi Google lainnya di 254 situs e-commerce, keuangan, dan perjalanan menunjukkan bahwa situs yang dimuat dalam waktu dua detik atau kurang memiliki rasio konversi 15% lebih tinggi.
Mempercepat Largest Contentful Paint (LCP)
Seperti kata pepatah, Anda tidak dapat meningkatkan apa yang tidak Anda ukur. Untuk pengalaman pengguna di web, kami percaya bahwa Data Web Inti merupakan kumpulan metrik solid yang berfokus pada pengguna yang dirancang untuk mencatat aspek dasar pengalaman pengguna. Secara khusus, Largest Contentful Paint (LCP) mengukur performa pemuatan halaman Anda dengan melaporkan waktu yang diperlukan untuk menampilkan blok teks atau gambar terbesar yang dilihat pengguna. Untuk memberikan pengalaman pengguna yang baik, LCP akan muncul dalam waktu 2,5 detik sejak halaman pertama kali mulai dimuat (yaitu, nilai minimum LCP yang baik).
Mari kita lihat apa yang berkontribusi pada LCP halaman biasa.
Saat pengguna mengunjungi halaman, browser meminta HTML dari server. Server merespons dengan HTML, yang memberi browser lebih banyak petunjuk tentang apa yang harus diambil berikutnya, termasuk CSS, JavaScript, font, dan gambar. Saat respons ini muncul kembali, browser juga harus mengevaluasinya, dan akhirnya menata letak dan menggambar komponen pada halaman. Namun, sebagian besar waktu dihabiskan untuk menunggu paket tersebut berpindah dari perangkat ke server dan kemudian kembali ke perangkat. Faktanya, data kami (Chrome untuk Android; median) menunjukkan bahwa sekitar 40% latensi yang terlihat oleh pengguna biasanya dihabiskan oleh browser untuk menunggu byte pertama kembali dari server.
Kekuatan pengambilan data
Jika seseorang dapat mengambil data semua file ini—yaitu, mengambilnya sebelum pengguna mengunjungi halaman—maka ini akan memberikan peningkatan kecepatan yang sangat besar, hanya menyisakan beberapa tugas sebelum menampilkan halaman: mengevaluasi, menghitung tata letak, dan menggambar.
Mengingat data yang dibagikan sebelumnya, pengguna juga dapat mengambil data resource utama dan tetap mencapai pemuatan halaman yang jauh lebih cepat. Dalam kasus situs yang sama, jenis teknik ini sudah tersedia dengan primitif seperti rel=prefetch. Namun, dengan skenario lintas situs, hal ini tidak sesederhana itu.
Navigasi lintas situs
Meskipun pengambilan data telah dilakukan beberapa waktu, pertimbangan tambahan diperlukan saat mengambil data halaman dari satu situs saat pengguna berada di situs lain.
Misalkan situs perujuk menginstruksikan browser untuk mengambil data halaman dari situs yang berbeda. Tentu saja, saat pengguna mengklik link ke halaman pengambilan data ini, mereka akan menikmati pengalaman pengguna yang lebih baik dengan pemuatan halaman yang jauh lebih cepat. Namun, bagaimana jika pengguna tidak pernah mengklik link ini? Mereka tidak berharap situs tertaut mengetahui bahwa mereka mungkin tertarik dengan suatu topik saat menelusurinya di situs perujuk. Namun, ini merupakan risiko besar karena permintaan pengambilan data akan membawa alamat IP pengguna, dan cookie jika ada, seperti permintaan reguler lainnya.
Solusi
Untuk mengaktifkan pengambilan data lintas situs yang menjaga privasi, kami telah mengembangkan dua solusi selama 3 tahun terakhir: Proxy Pengambilan Data Pribadi dan Bursa Bertanda Tangan (SXG). Kami juga menjalankan eksperimen berskala besar untuk mengonfirmasi bahwa pengambilan data lintas origin memberikan manfaat kecepatan yang signifikan. Konsekuensinya, saat melihat contoh di mana Google dapat mengambil data HTML utama dengan aman untuk navigasi pengguna berikutnya, kami melihat bahwa bagian pemuatan halaman dengan LCP "baik" meningkat sebesar 14 poin persentase.
Pertimbangan utama
Meskipun Private Prefetch Proxy dan Signed Exchange menyelesaikan kasus penggunaan yang sama, setiap teknologi menghadirkan serangkaian konsekuensi yang berbeda. Jadi, pilihan terbaik sangat bergantung pada kebutuhan spesifik situs Anda. Untuk membantu Anda memahami kompromi yang terlibat, bagian berikut membahas dua pertimbangan utama untuk memungkinkan pengambilan data lintas situs dan memilih di antara dua teknologi yang tersedia. Anda juga akan menemukan detail lebih lanjut di artikel pembahasan mendalam untuk setiap teknologi.
Pengunjung berulang
Pengambilan data lintas situs mudah diaktifkan bagi pengguna yang mengunjungi situs Anda untuk pertama kalinya. Untuk pengunjung berulang, hal ini bergantung pada seberapa banyak personalisasi yang dilakukan di situs Anda. Hal ini bermuara pada fakta bahwa permintaan pengambilan data lintas situs tidak dapat menyertakan cookie karena alasan privasi.
- Untuk pengunjung baru, pembatasan ini tidak menyebabkan tantangan apa pun karena pengunjung ini tidak memiliki cookie untuk memulai. Oleh karena itu, Anda dapat mengaktifkan pengambilan data lintas situs untuk pengguna ini tanpa mengubah situs Anda.
- Jika ingin mengaktifkan pengambilan data lintas situs untuk pengunjung berulang dan situs Anda dipersonalisasi berdasarkan cookie, Anda harus memuat lambat elemen yang dipersonalisasi ini setelah pengguna melakukan navigasi. Cara ini berhasil karena saat navigasi, pembatasan cookie tidak lagi diperlukan karena pengguna secara eksplisit memilih untuk mengunjungi situs Anda. Jadi, pada waktu navigasi, situs Anda memiliki akses ke cookie seperti biasa. Untuk panduan konkret, lihat praktik terbaik untuk pemuatan lambat ini.
- Jika saat ini Anda mengenkode personalisasi langsung ke HTML, Anda masih dapat terus melakukannya saat cookie ada, dan menggunakan pemuatan lambat sebagai strategi penggantian untuk halaman yang diambil terlebih dahulu.
- Jika situs Anda tidak dipersonalisasi berdasarkan cookie, atau jika personalisasi tidak penting, Anda dapat memilih untuk menyajikan konten yang sama kepada pengunjung berulang seperti yang Anda lakukan kepada pengunjung kali pertama.
Saat ini, Proxy Pengambilan Data Pribadi hanya diaktifkan untuk pengunjung baru (link tanpa cookie) dengan pekerjaan berkelanjutan untuk memperluas cakupan bagi pengunjung berulang (link dengan cookie). Di sisi lain, Signed HTTP Exchange sudah mendukung pengambilan data lintas situs untuk pengunjung baru dan berulang (dengan pendekatan yang diuraikan di atas).
Penyajian data tambahan dari pengambilan data
Mengaktifkan pengambilan data lintas situs dapat menyebabkan penayangan data tambahan. Faktanya, jika perujuk mengambil data halaman Anda, tetapi pengguna tidak mengklik link, hal ini akan mewakili traffic tambahan untuk Anda.
- Untuk mengurangi hal ini, seseorang dapat meminta agar perujuk tidak terlalu agresif dengan permintaan pengambilan data. Demikian pula, perujuk atau browser dapat mengurangi masalah ini dengan berfokus pada resource yang relatif ringan namun penting (misalnya, resource utama, CSS penting, atau sub-resource JavaScript). Ini pada dasarnya merupakan konsekuensi antara manfaat kecepatan dan lalu lintas tambahan.
- Atau, seseorang dapat mengimbangi traffic ini dengan memilih untuk menggunakan penyimpanan dalam cache tambahan (lihat bagian ini tentang Signed Exchange untuk detail selengkapnya). Kelemahannya adalah konten yang disimpan dalam cache terlalu lama dapat menyebabkan informasi lama ditampilkan kepada pengguna. Hal ini pada dasarnya merupakan konsekuensi antara penayangan data tambahan dan keaktualan konten.
Untuk membuat keputusan terbaik di sini, tanyakan pada diri Anda sendiri di mana situs Anda berada pada skala geser antara keaktualan maksimum dan permintaan tambahan minimal. Jawaban atas pertanyaan ini pada akhirnya bergantung pada kebutuhan spesifik bisnis dan pengguna Anda.
Memulai
Teknologi ini telah diintegrasikan di Google Penelusuran sehingga situs dapat segera mulai meningkatkan LCP-nya. Kami berharap hal ini juga akan mendorong perujuk populer lainnya untuk mengikutinya dan membantu membuat web lebih cepat secara keseluruhan!
Meskipun kedua teknologi ini memecahkan kasus penggunaan yang sama, keduanya menawarkan konsekuensi yang berbeda pada pertimbangan utama yang dijelaskan sebelumnya. Anda bahkan dapat memutuskan untuk mulai dengan satu teknologi dan beralih ke teknologi lain seiring berkembangnya kebutuhan Anda atau pengetahuan tentang manfaatnya. Lihat pendalaman ini untuk mengetahui teknologi mana yang merupakan jalur ke depan terbaik untuk situasi Anda: