Chrome 125

Tanggal rilis stabil: 14 Mei 2024

Kecuali jika dinyatakan lain, perubahan berikut berlaku untuk Chrome 125 versi stabil untuk Android, ChromeOS, Linux, macOS, dan Windows.

HTML dan DOM

Serialisasi shadow DOM deklaratif

Sebuah fitur yang memungkinkan pengembang melakukan serialisasi pohon DOM yang berisi akar bayangan, baru distandarisasi dalam standar HTML.

Bug pelacakan #41490936 | Entri ChromeStatus.com | Spesifikasi

CSS

Pemosisian Anchor CSS

Pemosisian anchor CSS memungkinkan developer menambatkan elemen yang benar-benar diposisikan ke satu atau beberapa elemen lain pada halaman (anchor), dengan cara deklaratif, tanpa menggunakan JavaScript. Pemosisian anchor berfungsi dengan baik saat anchor dapat di-scroll. Kasus penggunaan yang umum adalah memosisikan popover seperti tooltip di samping elemen yang memanggilnya, atau menu pilih dan popover-nya daftar opsi. Sebelum fitur pemosisian anchor, kasus penggunaan ini diperlukan untuk memosisikan pop-up secara dinamis, dan membuatnya tetap ditambatkan sebagai elemen pemanggilan di-scroll, yang merupakan Footgun performa dan sulit untuk benar. Dengan penempatan anchor, kasus penggunaan ini dapat diterapkan secara performa dan deklaratif.

Fitur pemosisian anchor terdiri dari sejumlah besar properti CSS. J beberapa properti utama adalah sebagai berikut:

  • anchor-name: menyiapkan elemen yang akan menjadi anchor bagi elemen lain.
  • position-anchor: mendeskripsikan "default" menunjukkan bahwa elemen anchor yang harus digunakan untuk penempatan anchor.
  • Fungsi anchor(): digunakan untuk merujuk pada posisi anchor , dalam memosisikan elemen yang ditambatkan.
  • inset-area: singkatan untuk pemosisian, untuk posisi relatif umum.

Memperkenalkan API pemosisian anchor CSS | Bug pelacakan #40059176 | Entri ChromeStatus.com | Spesifikasi

Fungsi nilai langkah CSS—round(), mod(), dan rem()

{i>Stepped-value function<i}, round(), mod(), dan rem(), semua transformasi nilai sesuai dengan “nilai langkah” lainnya.

Fungsi CSS round() menampilkan angka yang dibulatkan berdasarkan pembulatan yang dipilih strategi.

Fungsi CSS mod() menampilkan modulus yang tersisa saat parameter pertama dibagi dengan parameter kedua, mirip dengan operator sisa JavaScript (%). Modulus adalah nilai yang tersisa ketika satu operand, yang dividen, dibagi dengan operand kedua, yakni pembagi. Fungsi ini selalu mencatat pembagi.

Fungsi CSS rem() menampilkan sisa yang tersisa saat parameter pertama dibagi dengan parameter kedua, mirip dengan operator sisa JavaScript (%). Sisanya adalah nilai yang tersisa saat satu operand, yakni dividen, dibagi dengan operand kedua, yakni pembagi. Fungsi ini selalu mencatat dividen.

Bug pelacakan #40253179 | Entri ChromeStatus.com | Spesifikasi

Sintaksis baru untuk :state() kustom CSS

Status kustom CSS memungkinkan elemen kustom mengekspos class semunya sendiri. Tujuan yang baru kini telah ditentukan di CSSWG, dan Chrome 125 kini mendukung sintaksis :state(foo). Perubahan ini akan membuka jendela tempat Chrome akan mendukung sintaksis lama (:--foo) dan sintaksis baru sehingga situs dapat beralih ke yang baru.

Entri ChromeStatus.com | Spesifikasi

Menghapus diskontinuitas untuk warna Oklab dan Oklch dengan kecerahan hampir 100% atau 0

Sebelum perubahan ini, semua warna Lab, LCH, Oklab, dan Oklch dengan nilai kecerahan 100% dirender sebagai putih, terlepas dari dua parameter lainnya. Semua warna di ruang ini dengan nilai kecerahan 0 dirender sebagai hitam. Ini dua pemetaan menyebabkan diskontinuitas dalam gradien dan tidak terduga di developer.

Dengan rollback ini, warna-warna ini tidak lagi dipetakan secara artifisial dan warna yang ditampilkan akan kontinu dengan warna di sekitarnya dan tergantung pada pemetaan gamut (gamut) tampilan.

Entri ChromeStatus.com | Spesifikasi

Scrollbar root skema warna yang digunakan

Membuat browser menggunakan skema warna pilihan pengguna untuk merender area pandang scrollbar jika nilai "skema warna yang didukung halaman" adalah 'normal' atau tidak dan nilai yang dihitung dari color-scheme untuk elemen root adalah normal. Scrollbar area pandang dapat dianggap di luar konten web. Oleh karena itu, agen pengguna harus menghormati skema warna yang disukai saat merender scrollbar area tampilan jika developer memiliki tidak secara eksplisit menentukan dukungan untuk skema warna.

Perubahan ini tidak mencegah developer mengontrol skema warna untuk scrollbar. Perilaku baru membuat browser menggunakan preferensi pengguna color-skema untuk merender scrollbar non-overlay area pandang hanya jika developer belum menentukan skema warna untuk elemen {i>root<i}.

title [judul] | Bug pelacakan #40259909 | Entri ChromeStatus.com | Spesifikasi

Class view-transitions

Ada properti CSS baru view-transition-class yang memungkinkan Anda untuk menentukan satu atau beberapa class transisi tampilan. Anda kemudian dapat memilih ViewTransition elemen pseudo yang menggunakan class ini, misalnya ::view-transition-group(*.class).

Ini adalah ekstensi untuk ViewTransition API yang menyederhanakan penataan gaya elemen pseudo transisi tampilan dengan cara yang sama kelas CSS menyederhanakan penataan gaya elemen DOM reguler.

Bug pelacakan #41492972 | Entri ChromeStatus.com | Spesifikasi

Memuat

Menerima URL HTTP dan HTTPS saat membuat WebSocket

Pembaruan ini memungkinkan skema HTTP dan HTTPS di konstruktor WebSocket, oleh karena itu juga memungkinkan pengembang menggunakan URL relatif. Hal ini dinormalisasi menjadi skema internal ws: dan wss:.

Bug pelacakan #325979102 | Entri ChromeStatus.com | Spesifikasi

Web API

Penambahan ke Attribution Reporting API

Fitur telah ditambahkan ke Attribution Reporting API untuk membuat kemampuan proses debug dengan mendukung penguraian laporan debug kegagalan, meningkatkan kualitas API ergonomi yang mendukung bidang untuk menentukan platform pendaftaran pilihan, dan meningkatkan privasi.

Entri ChromeStatus.com

Compute Pressure API

Penawaran Compute Pressure API status tingkat tinggi yang mewakili beban CPU pada sistem. Hal ini memungkinkan penerapan metrik perangkat keras dasar yang tepat untuk memastikan bahwa pengguna dapat memanfaatkan semua kekuatan pemrosesan yang tersedia bagi mereka selama tidak dalam keadaan tertekan.

Intel memimpin pekerjaan desain dan implementasi untuk API ini, yang memungkinkan aplikasi konferensi video menyeimbangkan fitur dan tingkat tinggi.

Compute Pressure API | Bug pelacakan #40683064 | Entri ChromeStatus.com | Spesifikasi

Tindakan ini akan meluncurkan ekstensi Storage Access API yang diusulkan (versi mundur kompatibel dan masih dalam uji coba origin) untuk mengizinkan akses ke cookie yang tidak dipartisi dan penyimpanan non-cookie dalam konteks pihak ketiga. API saat ini hanya menyediakan akses ke cookie, yang memiliki kasus penggunaan berbeda dengan penyimpanan non-cookie.

Bug pelacakan #40282415 | Entri ChromeStatus.com | Spesifikasi

Persyaratan CORS FedCM pada endpoint pernyataan ID

Pengambilan di FedCM API sulit untuk dipertimbangkan karena propertinya mereka butuhkan. Saat diskusi masih berlangsung mengenai akun titik akhir, ada juga banyak konsensus bahwa endpoint pernyataan ID harus menggunakan CORS. Update ini menyelaraskan properti keamanan pengambilan ini secara lebih dekat dengan pengambilan lainnya di platform web.

Update FedCM: Uji coba origin Button Mode API, CORS dan SameSite | Bug pelacakan #40284123 | Entri ChromeStatus.com

FedCM kini mengirimkan permintaan pernyataan ID dengan CORS. Perubahan itu berarti bahwa Chrome tidak lagi mengirim cookie SameSite=Strict ke endpoint pernyataan ID, Chrome diam mengirim SameSite=None. Karena tidak masuk akal untuk mengirim kumpulan cookie yang berbeda ke endpoint akun dan pernyataan ID endpoint, perubahan ini membuatnya konsisten.

Tidak mengirim cookie SameSite=Strict juga konsisten dengan Perilaku requestStorageAccess dan permintaan lintas situs secara umum.

Bug pelacakan #329145816 | Entri ChromeStatus.com | Spesifikasi

Tindakan default mousemove yang dapat dioperasikan

Chrome memungkinkan pembatalan peristiwa mousemove untuk mencegah API lain seperti teks pilihan (dan bahkan seret dan lepas di masa lalu). Ini tidak sesuai dengan perusahaan besar lainnya browser; juga tidak sesuai dengan spesifikasi Peristiwa UI. Sekarang pemilihan teks tidak akan lagi menjadi tindakan {i>default<i} mousemove. Pemilihan teks dan tarik lalu lepas dapat tetap dicegah dengan membatalkan acara selectstart dan dragstart secara berurutan.

Fitur ini akan diluncurkan secara bertahap mulai Chrome 125, dan diperkirakan akan tersedia bagi semua pengguna mulai Chrome 126.

Demo | Bug pelacakan #40078978 | Entri ChromeStatus.com | Spesifikasi

Pengubah ekspresi reguler

Pengubah ekspresi reguler menambahkan kemampuan untuk mengubah i, m, dan dan s' penanda di dalam suatu pola.

Guna mengaktifkan tanda untuk subekspresi, gunakan (?X:subexpr) dengan X sebagai salah satu i, m, atau s. Guna menonaktifkan tanda untuk subekspresi, gunakan (-X:subexpr).

Misalnya, untuk tanda i yang tidak peka huruf besar/kecil:

const re1 = /^[a-z](?-i:[a-z])$/i;
re1.test("ab"); // true
re1.test("Ab"); // true
re1.test("aB"); // false

const re2 = /^(?i:[a-z])[a-z]$/;
re2.test("ab"); // true
re2.test("Ab"); // true
re2.test("aB"); // false

Entri ChromeStatus.com | Spesifikasi

Duplikat ekspresi reguler bernama grup tangkapan

Grup tangkapan bernama duplikat memungkinkan Anda menggunakan nama grup tangkapan yang sama di semua alternatif. Contoh:

const re = /(?<year>[0-9]{4})-[0-9]{2}|[0-9]{2}-(?<year>[0-9]{4})/;

Dalam hal ini, year valid untuk alternatif pertama ((?<year>[0-9]{4})-[0-9]{2}), atau alternatif kedua ([0-9]{2}-(?<year>[0-9]{4})).

Entri ChromeStatus.com | Spesifikasi

Aplikasi Chrome

Direct Sockets API di Aplikasi Chrome

Pembaruan ini membantu memudahkan transisi aplikasi khusus dari Aplikasi Chrome ke Aplikasi Web Terisolasi dengan mengaktifkan Direct Sockets di Aplikasi Chrome, memungkinkan aplikasi web menetapkan protokol kontrol transmisi langsung (TCP) dan protokol datagram pengguna (UDP) berkomunikasi dengan perangkat dan sistem jaringan.

Entri ChromeStatus.com | Spesifikasi

Uji coba origin baru

FedCM Button Mode API dan Use Other Account API

Uji coba origin ini mencakup dua API FedCM berikut.

Button Mode API memungkinkan situs web memanggil FedCM di dalam klik tombol, seperti mengklik tombol Sign-in to IdP. Hal ini memerlukan FedCM untuk menjaminnya selalu merespons dengan antarmuka pengguna yang terlihat, bukan mode widget, yang tidak menampilkan UI saat pengguna {i>log out<i}. Memanggil FedCM API dalam mode tombol mengarahkan pengguna untuk login ke IdP (di jendela dialog), saat pengguna sedang logout.

Selain itu, karena mode tombol dipanggil dalam pengguna eksplisit , UI juga mungkin lebih terlihat (misalnya, di tengah dan modal) dibandingkan dengan UI dari mode widget (yang tidak memiliki ). Pelajari lebih lanjut cara kerja Button Mode API di Update FedCM: Uji coba origin Button Mode API, CORS dan SameSite

Use Other Account API memungkinkan Penyedia Identitas memungkinkan pengguna untuk login akun lain.

Uji Coba Origin | Demo | Bug pelacakan #40284792 | Entri ChromeStatus.com | Spesifikasi

API Foldable

Uji coba origin ini mencakup Device Posture API dan Segmen Area Pandang Enumeration API. API ini didesain untuk membantu developer menargetkan perangkat foldable perangkat.

Uji Coba Origin | Uji coba origin untuk API Foldable | Entri ChromeStatus.com | Spesifikasi

Uji coba penghentian penggunaan untuk properti dan metode Layar Penuh HTMLVideoElement berawalan

Uji coba penghentian penggunaan ini memungkinkan Anda memilih kembali dukungan untuk awalan Properti dan metode HTMLVideoElement jika Anda memerlukan lebih banyak waktu untuk menyesuaikan pada kode sumber.

Uji Coba Origin | Entri ChromeStatus.com

Lewati pemindaian pramuat

Melewati pemindai pramuat untuk mempelajari akan ada kompromi performa untuk halaman yang tidak memiliki pengambilan sub-resource.

Langkah pemindai pramuat meningkatkan performa halaman yang memiliki sub-resource pengambilan, melalui penerapan pengambilan data spekulatif. Namun, untuk halaman yang tidak memperoleh manfaat dari langkah ini, yaitu untuk halaman tanpa sub-resource, ini adalah overhead pemrosesan tambahan dengan sedikit manfaat.

Untuk pengguna web tingkat lanjut yang ingin memperoleh manfaat dengan mengurangi beban kerja ini, menyediakan kontrol tingkat halaman untuk menonaktifkan pemindai pramuat. Data yang dikumpulkan dari eksperimen ini dapat mengevaluasi apakah API yang dimodifikasi atau implementasi pemindai pra-pemuatan HTML akan sangat membantu.

Uji Coba Origin | Bug pelacakan #330802493 | Entri ChromeStatus.com | Spesifikasi

Penghentian penggunaan dan penghapusan

Menghapus "window-placement" alias untuk kebijakan izin dan izin "window-management"

Menghapus "window-placement" alias untuk kebijakan izin dan izin "pengelolaan-jendela". Ini adalah bagian dari upaya yang lebih besar untuk mengganti nama {i>string<i} dengan akhirnya menghentikan dan menghapus "window-placement". Perubahan terminologi ini meningkatkan umur deskriptor sebagai Window Management API berkembang dari waktu ke waktu.

title [judul] | Bug pelacakan #40842072 | Entri ChromeStatus.com | Spesifikasi

Penghapusan kebijakan Perusahaan: NewBaseUrlInheritanceBehaviorAllowed

Perubahan kode yang mendasarinya (mengaktifkan perilaku pewarisan URL dasar baru) yang penggantian kebijakan perusahaan telah diaktifkan dalam rilis stabil sejak bulan Agustus 2023 (Chrome 118). Karena masalah umum telah tertangani, perusahaan ini kebijakan ini telah dihapus di Chrome 125.

Entri ChromeStatus.com

Penghapusan properti dan metode Layar Penuh HTMLVideoElement berawalan

API layar penuh HTMLVideoElement berawalan tidak digunakan lagi sejak Chrome 38. Objek tersebut diganti dengan Element.requestFullscreen(), yang pertama kali dikirim tanpa awalan pada tahun 2018 di Chrome 71.

Properti dan metode berikut akan dihapus dari HTMLVideoElement:

  • webkitSupportsFullscreen
  • webkitDisplayingFullscreen
  • webkitEnterFullscreen()
  • webkitExitFullscreen()
  • webkitEnterFullScreen() (perhatikan penggunaan huruf besar "S" yang berbeda di FullScreen)
  • webkitExitFullScreen()

Daftar ke uji coba penghentian penggunaan yang tercantum dalam postingan ini, jika situs Anda masih mengandalkan hal ini dan Anda membutuhkan lebih banyak waktu untuk memperbarui kode.

Entri ChromeStatus.com

Bacaan lebih lanjut

Ingin lebih banyak? Lihat referensi tambahan ini.

Download Google Chrome

Download Chrome untuk Android, Desktop, atau iOS.