Insight Teratas dari Chrome Dev Summit 2021

Chrome Dev Summit adalah acara tahunan di mana para ahli dari Chrome berbagi sorotan tentang produk terbaru mereka dan visi mereka untuk masa depan Chrome dan web.

Artikel ini berisi wawasan teratas dari Chrome Dev Summit 2021.

Perubahan paling menarik yang diumumkan oleh tim Chrome meliputi:

• Berencana untuk membatasi jumlah informasi dalam string User-Agents,
• Pengumuman dukungan baru untuk Alur Pengguna di Lighthouse dan DevTools,
• Memperkenalkan dua metrik kinerja baru (kandidat untuk Data Web Inti), dan
• Fitur Desain Responsif Baru.

Menghapus cookie pihak ketiga secara bertahap – Petunjuk Klien Agen Pengguna

Privacy Sandbox terus menjadi salah satu elemen kunci dari upaya Google yang terus berkembang untuk membuat web yang lebih berfokus pada privasi.

Peramban tidak memiliki cara untuk mengetahui apakah Anda menggunakan cookie pihak ketiga untuk sesuatu yang bermanfaat seperti memberikan pengalaman yang disesuaikan atau membuat pengguna tetap masuk, atau untuk pelacakan lintas situs.

sumber: Barb Smith

Itulah sebabnya Chrome bertujuan untuk membuat API yang dibuat khusus yang memungkinkan Anda untuk mempertahankan fungsionalitas (seperti periklanan, deteksi penipuan, atau pengiriman konten yang disesuaikan) tanpa memerlukan cookie pihak ketiga.

Setelah memastikan pengembang memiliki waktu untuk mengadopsi API, Chrome akan secara aman menghapus dukungan untuk cookie pihak ketiga.

Teknologi baru dan tahapan pengembangannya dapat dilihat di Privacy Sandbox Timeline.

Salah satu solusi baru yang diluncurkan tahun ini adalah User-Agent Client Hints (UA-CH).

String User-Agent berisi banyak informasi tentang perangkat dan browser pengguna, yang dapat digunakan untuk sidik jari browser.

Chrome bertujuan untuk melawan sidik jari browser dengan mengurangi jumlah default informasi dalam string User-Agent dan mempersulit untuk mengidentifikasi pengguna individu. Informasi dalam string hanya akan berisi:

• Merek dan versi peramban,
• Informasi apakah itu desktop atau seluler, dan
• Platform tempat ia berjalan.

String Agen-Pengguna akan memberi Anda beberapa informasi secara default, yang mungkin mencakup sebagian besar kasus penggunaan Anda, tetapi informasi yang lebih detail hanya tersedia berdasarkan permintaan dalam format langsung.

sumber: Pengembang Chrome

Mulai April 2022, Chrome akan secara bertahap mengurangi string User-Agent.

Anda masih bisa mendapatkan data tambahan tentang pengguna Anda menggunakan User-Agent Client Hints API, tetapi pengguna akan dapat memutuskan seberapa banyak informasi yang ingin mereka bagikan.

Pembaruan alat kinerja

Chrome mengumumkan beberapa perubahan menarik dan fitur baru untuk mengukur dan menganalisis kinerja web. Itu termasuk:

• Meningkatkan UI di PageSpeed ​​Insights,
• Menambahkan dukungan untuk Alur Pengguna di Lighthouse dan DevTools,
• Memperkenalkan dua metrik eksperimental baru.

Perubahan di Antarmuka Wawasan PageSpeed

Ada pembaruan di UI PageSpeed ​​Insights yang membuatnya lebih intuitif dan meningkatkan presentasi data.

Antarmuka baru mencakup perbedaan yang jelas antara "Data Lab" berdasarkan laporan Lighthouse dan "Data Lapangan" berdasarkan pengalaman pengguna yang sebenarnya.

Selain itu, fitur baru yang disebut "Perluas Tampilan" menambahkan fungsi ke bagian Data Bidang. Anda dapat menggunakannya untuk melihat detail terperinci untuk Data Web Inti.

Google juga memindahkan Ringkasan Asal di bawah Data Bidang. Setelah mengkliknya, Anda dapat melihat skor agregat semua halaman dari asal yang sama.

Di bawah bagian data lapangan dan lab, Anda dapat menemukan informasi tambahan yang berguna, termasuk:

• periode pengumpulan data,
• Durasi kunjungan,
• Perangkat,
• Koneksi jaringan,
• Ukuran sampel,
• versi Chrome.

Perubahan juga terjadi pada penilaian Core Web Vitals. Alih-alih satu kata "lulus" atau "gagal", itu akan tersedia di subbagian terpisah.

Terakhir, gambar halaman pemuatan akan dihapus dari bagian bidang. Anda akan menemukan gambar dan thumbnail yang menampilkan urutan pemuatan di bagian data lab.

Dukungan untuk Alur Pengguna di Mercusuar

Lighthouse API yang baru memungkinkan Anda menganalisis alur pengguna dengan mensimulasikan klik tautan, menggulir, dan memuat halaman tambahan alih-alih menganalisis kinerja setiap halaman secara terpisah.

Lighthouse akan dapat membedakan dan memberikan laporan terpisah untuk navigasi halaman, interaksi pengguna apa pun yang terjadi selama rentang waktu tertentu, dan cuplikan untuk mewakili status halaman yang diambil.

sumber: Houssein Djirdeh

Dengan fitur baru, Anda dapat lebih memahami pengalaman pengguna dan menemukan masalah kinerja sepanjang perjalanan pengguna di situs web Anda.

Panel Rekam Baru di DevTools

Dukungan untuk menganalisis alur pengguna juga telah ditambahkan langsung di DevTools.

Dengan Panel Rekam yang baru diluncurkan di DevTools , kini Anda dapat menganalisis, merekam, dan mengekspor seluruh perjalanan pengguna di situs web Anda.

Alat baru ini memungkinkan Anda melihat semua tindakan yang dilakukan pengguna di situs web Anda, seperti penekanan tombol atau klik tautan, langsung di panel Kinerja. Fitur ini bertujuan untuk membantu Anda memahami dan men-debug interaksi yang kompleks dengan mudah.

Dua metrik kinerja baru

Chrome mengumumkan dua metrik kinerja baru sebagai kandidat potensial untuk Data Web Inti.

Daya tanggap

Responsiveness dimaksudkan untuk menangkap respon keseluruhan halaman.

Saat ini kami menggunakan First Input Delay untuk mengukur seberapa responsif halaman saat memuat. FID adalah metrik yang berguna karena responsivitas sangat mudah berubah ketika browser perlu memuat banyak sumber daya dan waktu utas utama sangat dibutuhkan.

Tetapi semua tindakan FID adalah seberapa cepat browser siap memproses permintaan pengguna. Itu tidak memungkinkan Anda untuk mengukur latensi input sepanjang siklus hidup halaman tertentu.

Tim Chrome masih membuat konsep metrik Responsif yang baru. Anda dapat mengetahui lebih lanjut tentang tantangan mengukur latensi input di seluruh siklus hidup halaman di sini.

Kelancaran

Kelancaran bertujuan untuk mengatasi pengukuran "gagap" atau "beku" selama animasi atau pengguliran. Metrik baru ini bertujuan untuk lebih memahami seberapa sering bingkai animasi dijatuhkan dan seberapa besar pengaruhnya terhadap pengguna.

Metrik Persen Bingkai yang Dijatuhkan yang diusulkan akan menghitung jumlah bingkai yang dijatuhkan dan menyajikan skor rata-rata yang seharusnya mencerminkan seberapa halus animasi dari sudut pandang pengguna.

Yang penting adalah: proporsi waktu menunggu pembaruan penting. Kami pikir ini cocok dengan cara alami pengguna merasakan kelancaran konten web dalam praktiknya. Sejauh ini, kami telah menggunakan yang berikut ini sebagai kumpulan metrik awal :

• Persentase Rata-Rata Turun: untuk semua bingkai animasi non-idle di seluruh linimasa
• Kasus Terburuk dari Persen Bingkai yang Dijatuhkan: sebagaimana diukur selama 1 detik jendela geser waktu.
• Persentil ke-95 dari Persen Bingkai yang Dijatuhkan: sebagaimana diukur selama 1 detik jendela geser waktu.

sumber: web.dev

Responsif Baru

Desain Responsif tidak lagi hanya tentang menyesuaikan situs web Anda agar berfungsi dengan baik di ponsel dan desktop. Ini lebih dari itu, dan pengembang perlu memberikan pengalaman yang disesuaikan untuk semua orang dan menyertakan preferensi pengguna seperti mode gelap atau perangkat yang dapat dilipat.

Perubahan pada Desain Responsif menyangkut fitur CSS. Beberapa fitur baru termasuk spesifikasi kueri container baru, Scroll Timeline, dan properti Accent Color.

Properti penyesuaian ukuran untuk tipografi

Salah satu fitur yang sangat menarik adalah properti penyesuaian ukuran untuk tipografi. Anda dapat menggunakan penyesuaian ukuran untuk menyesuaikan font default agar sesuai dengan font web yang akan dimuat.

Ini sangat penting karena dapat membantu Anda mencegah Pergeseran Tata Letak Kumulatif dengan mengurangi pergeseran yang disebabkan oleh pemuatan font web Anda.

Mode Gelap

Selain itu, Chrome sedang mengerjakan fitur algoritme gelap otomatis berbantuan pembelajaran mesin. Ini berarti bahwa browser dapat secara otomatis menghasilkan tema gelap, dengan kemungkinan untuk keluar dari fungsi ini.

Kunjungi laman Pengembang Chrome untuk mempelajari lebih lanjut tentang fitur gelap otomatis baru Chrome dan mengujinya di perangkat Anda.