Baru di Chrome 100

Pete LePage

Berikut hal yang perlu Anda ketahui:

Saya Pete LePage. Mari selami dan lihat apa yang baru untuk pengembang di Chrome 100.

Chrome 100

Saat browser pertama kali mencapai versi 10, ada beberapa masalah karena nomor versi utama berubah dari satu digit menjadi dua digit. Mudah-mudahan, kita mempelajari beberapa hal yang akan memudahkan transisi dari dua digit ke tiga.

Logo Chrome dan Firefox

Chrome 100 kini tersedia, dan Firefox 100 akan segera diluncurkan. Tiga digit nomor versi ini berpotensi menyebabkan masalah pada situs yang mengandalkan identifikasi versi browser dalam beberapa cara. Selama beberapa bulan terakhir, tim Firefox dan tim Chrome menjalankan eksperimen dengan browser yang melaporkan nomor versi 100, meskipun sebenarnya tidak.

Hal ini menyebabkan beberapa masalah yang dilaporkan, banyak di antaranya telah diperbaiki. Tapi, kami masih membutuhkan bantuan Anda.

  • Jika Anda adalah pengelola situs, uji situs Anda dengan Chrome dan Firefox 100.
  • Jika Anda mengembangkan library penguraian Agen Pengguna, tambahkan pengujian untuk mengurai versi yang lebih besar dari dan sama dengan 100.

Lihat Chrome dan Firefox yang akan segera mencapai versi utama 100 di web.dev untuk mengetahui detail selengkapnya.

100 Momen Web Keren

Gambar promo 100 Cool Web Moments

Sangat menyenangkan melihat web berkembang dan melihat semua hal menakjubkan yang telah Anda bangun selama 100 rilis Chrome terakhir. Menurut kami, akan menyenangkan untuk mencoba kembali cara untuk mengingat kembali dan merayakan #100CoolWebMoments yang telah terjadi dalam 14 tahun terakhir.

Beri tahu kami momen yang paling Anda sukai. Jika kami melewatkan sesuatu (dan kami yakin telah melakukannya), kirim tweet kepada kami di @Chromiumdev dengan menyertakan #100CoolWebMoments. Selamat menikmati!

String Agen Pengguna dikurangi

Terkait agen pengguna, Chrome 100 akan menjadi versi terakhir yang mendukung string Agen Pengguna yang tidak dikurangi secara default. Ini adalah bagian dari strategi untuk mengganti penggunaan string Agen Pengguna, dengan User-Agent Client Hints API yang baru.

Mulai Chrome 101, agen pengguna akan dikurangi secara bertahap.

Lihat Uji Coba dan Tanggal Asal Pengurangan Agen Pengguna di [blog Chromium][crblog], untuk mempelajari lebih lanjut apa saja yang akan dihapus, dan kapan.

API penempatan jendela multilayar

Untuk beberapa aplikasi, membuka jendela baru dan menempatkannya di tempat tertentu, atau tampilan tertentu merupakan fitur yang penting. Misalnya, saat menggunakan Slide untuk presentasi, saya ingin slide muncul dalam layar penuh di layar utama, dan catatan pembicara muncul di layar lain.

Multi-Screen Window Placement API memungkinkan untuk menghitung tampilan yang terhubung ke komputer pengguna, dan menempatkan jendela di layar tertentu.

Anda dapat dengan cepat memeriksa apakah ada lebih dari satu layar yang terhubung ke perangkat dengan window.screen.isExtended.

const isExtended = window.screen.isExtended;
// returns true/false

Namun, fungsi utamanya berada di window.getScreenDetails(), yang memberikan detail tentang layar yang terpasang.

const x = await window.getScreenDetails();
// returns
// {
//    currentScreen: {...}
//    oncurrentscreenchange: null
//    onscreenschange: null
//    screens: [{...}, {...}]
// }

Misalnya, Anda dapat menentukan layar utama, lalu menggunakan requestFullscreen() untuk membuat elemen menjadi layar penuh di tampilan tersebut.

try {
  const screens = await window.getScreenDetails();
  const primary = screens
         .filter((screen) => screen.primary)[0]
  await elem.requestFullscreen({ screen: primary });
} catch (err) {
  console.error(err);
}

Selain itu, layanan ini juga memberikan cara untuk memproses perubahan, misalnya jika layar baru dicolokkan atau dilepas, resolusinya berubah, dan sebagainya.

const screens = await window.getScreenDetails();
let numScreens = screens.screens.length;
screens.addEventListener('screenschange', (event) => {
  if (screens.screens.length !== numScreens) {
    console.log('Screen count changed');
    numScreens = screens.screens.length;
  }
});

Lihat artikel Tom yang diperbarui Mengelola beberapa tampilan dengan Multi-Screen Window Placement API di web.dev untuk mempelajari lebih lanjut.

Dan banyak lagi!

Tentu saja masih banyak lagi.

Ada metode forget() baru untuk Perangkat HID yang memungkinkan Anda mencabut izin ke Perangkat HID yang diberikan oleh pengguna.

// Request an HID device.
const [device] = await navigator.hid.requestDevice(opts);


// Then later, revoke permission to the device.
await device.forget();

Dan untuk WebNFC, metode makeReadOnly() memungkinkan Anda membuat tag NFC hanya baca secara permanen.

const ndef = new NDEFReader();
await ndef.makeReadOnly();

Bacaan lebih lanjut

Artikel ini hanya mencakup beberapa sorotan utama. Periksa link di bawah untuk melihat perubahan tambahan di Chrome 100.

Langganan

Untuk terus mengikuti info terbaru, subscribe ke channel YouTube Chrome Developers, dan Anda akan mendapatkan notifikasi email setiap kali kami meluncurkan video baru.

Saya Pete LePage, dan segera setelah Chrome 101 dirilis, saya akan ada di sini untuk memberi tahu Anda apa yang baru di Chrome!