Mempercepat Largest Contentful Paint (LCP) dengan pengambilan data lintas situs.
Mulai Chrome 103 untuk Android, Chrome akan secara bertahap meluncurkan fitur proxy pengambilan data pribadi untuk mempercepat navigasi keluar dari Google Penelusuran dan situs lainnya yang berpartisipasi sebesar 30% di median. Fitur proxy pengambilan data pribadi ini memungkinkan pengambilan data konten lintas asal tanpa mengekspos informasi pengguna ke situs tujuan hingga pengguna menavigasi.
Lanjutkan membaca untuk mempelajari cara kerja fitur ini, cara fitur ini dapat membantu meningkatkan Largest Contentful Paint (LCP) situs Anda secara signifikan, atau bagaimana situs perujuk dapat membantu pengguna mereka mencapai sasarannya dengan mempercepat navigasi lintas situs.
Cara kerja Proxy Pengambilan Data Pribadi
Saluran komunikasi yang aman
Fitur ini menggunakan proxy CONNECT untuk membuat saluran komunikasi yang aman antara Chrome dan server yang menghosting konten yang akan diambil data-nya. Saluran komunikasi aman ini mencegah proxy agar tidak memeriksa transfer data apa pun. Secara khusus, meskipun Proxy Pengambilan Data Pribadi selalu melihat nama host untuk membangun saluran komunikasi yang aman, proxy tidak akan melihat URL lengkap atau sumber daya itu sendiri.
CONNECT akan mencegah kebocoran informasi pengguna.Selain itu, karena saluran komunikasi aman dienkripsi end-to-end, perantara tidak dapat mengamati nama host, maupun konten situs yang diambil terlebih dahulu. Terakhir, {i>proxy<i} secara inheren mencegah server tujuan melihat alamat IP pengguna.
Mencegah identifikasi pengguna
Di luar aspek jaringan yang dijelaskan sebelumnya, kita juga perlu mencegah server mengidentifikasi pengguna pada waktu pengambilan data, melalui informasi yang sebelumnya disimpan di perangkat mereka. Untuk itu, Chrome saat ini membatasi penggunaan Proxy Pengambilan Data Pribadi untuk situs yang tidak memiliki cookie atau status lokal lainnya oleh pengguna. Berikut adalah batasan untuk permintaan pengambilan data yang dibuat melalui Proxy Pengambilan Data Pribadi:
- Cookie: Permintaan pengambilan data tidak diizinkan untuk membawa cookie.
- Jika ada cookie untuk resource, Chrome akan melakukan pengambilan tanpa kredensial, tetapi tidak akan menggunakan responsnya (lihat bagian Menyimpan ke cache nanti).
- Meskipun respons terhadap permintaan pengambilan data dapat menyertakan cookie, cookie ini hanya akan disimpan jika pengguna membuka halaman pengambilan data.
- Pelacakan sidik jari: Platform lain yang dapat digunakan untuk pelacakan sidik jari juga akan disesuaikan. Misalnya, header
User-Agentyang dikirim oleh proxy pengambilan data hanya membawa informasi terbatas.
Di masa mendatang, kami berharap dapat memperluas Proxy Pengambilan Data Pribadi untuk menautkan dengan cookie atau status lokal dengan tetap mempertahankan karakteristik privasi yang sama. Lihat bagian Langkah berikutnya untuk mengetahui detail selengkapnya.
Menyimpan ke cache
Chrome akan mengambil data resource meskipun sudah ada di cache, tetapi resource tersebut tidak akan menggunakan header bersyarat seperti ETag atau If-Modified-Since (resource ini berisi nilai yang ditetapkan server yang dapat digunakan untuk melacak meskipun tanpa cookie). Pengambilan data ini dilakukan untuk mencegah kebocoran status cache klien ke situs yang diambil datanya. Selain itu, Chrome hanya akan melakukan commit resource yang diambil terlebih dahulu ke cache jika pengguna memutuskan untuk membuka situs yang diambil terlebih dahulu.
Memulai proxy pengambilan data pribadi
Untuk pemilik situs
Tidak ada tindakan yang diperlukan dari pemilik situs untuk mulai mendapatkan manfaat dari proxy pengambilan data pribadi pada link yang tidak memiliki cookie atau status lokal bagi pengguna. Berdasarkan eksperimen kami, ini merupakan peluang penting bagi sebagian besar situs. Selain itu, ada baiknya untuk membuat pengunjung baru terkesan atau pengunjung jarang dengan pengalaman pemuatan yang super cepat. Dari eksperimen sebelumnya, hasil Largest Contentful Paint ini 20% hingga 30% lebih cepat pada navigasi yang diambil terlebih dahulu.
Ke depannya, kami berharap dapat memperluas fitur ini untuk ditautkan dengan cookie atau status lokal dengan tetap mempertahankan karakteristik privasinya. Tantangan cookie adalah bahwa cookie dapat digunakan untuk mengubah pengalaman pengguna dengan cara yang sulit diprediksi. Jadi, pemilik situs kemungkinan besar harus memilih untuk menggunakan atau menyesuaikan situs mereka untuk memanfaatkan Proxy Pengambilan Data Pribadi untuk link dengan cookie.
Konkretnya, meskipun permintaan pengambilan data akan tetap tanpa kredensial, halaman web akan mendapatkan akses ke cookie, dan status lokal lainnya, saat pengguna membukanya. Developer dapat memanfaatkan hal ini untuk menambahkan kembali personalisasi dan perubahan berdasarkan cookie atau status lokal. Atau mungkin, developer mungkin juga tertarik untuk mendeklarasikan resource tertentu yang boleh diambil terlebih dahulu dan digunakan sebagaimana adanya, tanpa cookie (yaitu, resource yang tidak bergantung pada cookie apa pun). Lihat bagian Langkah berikutnya untuk mempelajari lebih lanjut dan menginformasikan rencana kami.
Konten atau layanan yang bergantung secara geografis
Jika perilaku situs web Anda berbeda (misalnya, konten berbeda, atau akses selektif) di seluruh pasar berdasarkan alamat IP pengguna, Anda mungkin bertanya-tanya bagaimana cara menangani permintaan pengambilan data Proxy Pengambilan Data Pribadi. Penting untuk diketahui bahwa Proxy Pengambilan Data Pribadi didukung oleh beberapa server yang tersebar di seluruh dunia, dan bahwa IP proxy akan menunjukkan geolokasi ke negara tempat pengguna memulai pengambilan data.
Jadi, dengan mengingat hal itu, berikut saran kami:
- Identifikasi permintaan pengambilan data dari Proxy Pengambilan Data Pribadi dengan adanya header HTTP
Sec-Purpose: Prefetch; anonymous-client-ip. - Cari geolokasi Proxy Pengambilan Data Pribadi yang mengeluarkan permintaan melalui alamat IP-nya. Baca referensi ini untuk mengetahui daftar terbaru geografi yang diluncurkan dan alamat IP yang sesuai.
- Sajikan resource sesuai dengan pasar yang terkait dengan geolokasi khusus ini.
Pemandu lalu lintas
Dari eksperimen sebelumnya, kami tahu bahwa fitur ini biasanya menghasilkan permintaan tambahan kurang dari 2% untuk resource utama (misalnya dokumen HTML). Meskipun demikian, jika Anda berhati-hati, Anda dapat menggunakan bidang fraksi saran lalu lintas untuk mengontrol seberapa banyak lalu lintas yang harus diizinkan oleh Proxy Pengambilan Data Pribadi. Anda dapat memulai dengan fraksi kecil seperti 0, 3 (yaitu 30%), dan secara bertahap meningkatkannya menjadi 1, 0 (yaitu 100%) dengan menambahkan JSON berikut ke file /.well-known/traffic-advice, yang perlu ditayangkan dengan jenis MIME application/trafficadvice+json:
[{
"user_agent": "prefetch-proxy",
"fraction": 0.3
}]
Kolom fraction adalah float antara 0.0 (tanpa pengambilan data sama sekali) dan 1.0 (100% permintaan pengambilan data berhasil).
Anda juga dapat menonaktifkan fitur ini sepenuhnya dengan konfigurasi berikut:
[{
"user_agent": "prefetch-proxy",
"disallow": true
}]
File /.well-known/traffic-advice diambil oleh proxy, bukan klien, dan di-cache di proxy sesuai semantik cache HTTP biasa. Untuk fleksibilitas yang lebih baik—misalnya, akses berat yang tiba-tiba muncul—Anda mungkin perlu menolak permintaan pengambilan data (Sec-Purpose: prefetch;anonymous-client-ip) dengan kode status 503 untuk sementara, dan dengan menyetel header Cache-Control: no-store di respons. Anda juga dapat menambahkan header Retry-After untuk memberi tahu Chrome lamanya waktu tunggu sebelum mencoba kembali permintaan pengambilan data.
Untuk pemilik situs perujuk
Jika Anda mengoperasikan situs dengan banyak link ke situs lain, Anda mungkin tertarik menggunakan fitur Proxy Pengambilan Data Pribadi untuk mempercepat navigasi lintas asal ini. Anda harus menambahkan aturan spekulasi ke halaman agar Chrome dapat mengetahui halaman mana yang Anda yakini harus pengambilan data melalui Proxy Pengambilan Data Pribadi. Berikut adalah contoh sederhana:
<script type="speculationrules">
{
"prefetch": [
"source": "list",
"urls": ["https://example.com/index.html"],
"requires": ["anonymous-client-ip-when-cross-origin"]
]
}
</script>
Apa langkah selanjutnya?
Peluncuran ini hanyalah langkah pertama. Kami berharap dapat memperluas dan meningkatkan fitur ini berdasarkan minat dan masukan komunitas. Misalnya, kami ingin mendapatkan masukan tentang cara memperluas ke link dengan cookie dan status lokal dengan cara yang meminimalkan hambatan developer, atau cara untuk membuat fitur ini lebih berguna bagi situs perujuk.