Baru menggunakan platform web pada bulan November

Temukan beberapa fitur menarik yang diluncurkan di browser web stabil dan beta selama November 2022.

Rachel Andrew

Rilis browser stabil

Pada bulan November, Firefox 107 dan Chrome 108 menjadi stabil. Mari kita lihat apa artinya ini bagi platform web.

Perubahan pada perilaku Area Pandang Tata Letak di Chrome pada Android

Terdapat perubahan pada perilaku Area Pandang Tata Letak dari Chrome 108 di Android saat keyboard virtual ditampilkan. Baca Bersiaplah untuk perubahan perilaku pengubahan ukuran area pandang yang akan hadir di Chrome di Android untuk mempelajari lebih lanjut.

Unit area pandang baru

Di Chrome 108 juga terdapat Unit Viewport CSS baru. Ini mencakup unit kecil (svw, svh, svi, svb, svmin, svmax), besar (lvw, lvh, lvi, lvb, lvmin, lvmax), dinamis (dvw, dvh, dvi, dvb, dvmin, dvmax), dan logis (vi, vb). Unit ini sudah diimplementasikan di Firefox dan Safari, yang berarti kita sekarang memiliki interop di tiga mesin browser utama untuk unit ini.

Baca Unit area pandang besar, kecil, dan dinamis.

Properti CSS singkatan contain-intrinsic-size didukung di Firefox 107, bersama dengan contain-intrinsic-width, contain-intrinsic-height panjang dan properti logis contain-intrinsic-block-size dan contain-intrinsic-inline-size.

Ini diterapkan untuk menentukan ukuran elemen UI yang tunduk pada pembatasan ukuran. Hal ini memungkinkan agen pengguna menentukan ukuran elemen tanpa perlu merender elemen turunannya. Fungsi ini berguna saat elemen tunduk pada pembatasan ukuran.

Dukungan untuk kata kunci avoid fragmentasi CSS

Chrome 108 menyertakan dukungan untuk nilai avoid dari properti fragmentasi CSS break-before, break-after, dan break-inside saat mencetak. Nilai ini memberi tahu browser untuk menghindari pemutusan sebelum, sesudah, atau di dalam elemen tempatnya diterapkan. Misalnya, CSS berikut menghindari gambar yang terputus pada batas halaman.

figure {
    break-inside: avoid;
}

Penambahan ini disebabkan oleh disertakannya dukungan cetak menggunakan LayoutNG, yang menghadirkan pengalaman modern dan minim bug. Pelajari LayoutNG lebih lanjut.

Federated Credential Management API

Federated Credential Management API (FedCM) menyediakan abstraksi untuk alur identitas gabungan di web. API ini mengekspos dialog yang dimediasi browser yang memungkinkan pengguna memilih akun dari penyedia identitas untuk login ke situs. FedCM dikirimkan di Chrome 108. Cari tahu selengkapnya di postingan blog pengumuman FedCM.

Rilis browser beta

Versi browser Beta memberi Anda pratinjau hal-hal yang akan ada di versi stabil browser berikutnya. Ini adalah waktu yang tepat untuk menguji fitur baru, atau penghapusan, yang dapat memengaruhi situs Anda sebelum seluruh dunia mendapatkan rilis tersebut. Karena tanggal rilis jatuh, satu-satunya versi beta baru bulan ini adalah Firefox 108, dengan Safari 16.2 beta masih berlangsung.

Firefox 108 mendukung atribut height dan width untuk elemen <source>, jika merupakan turunan dari elemen <picture>. Atribut ini menerima tinggi atau lebar gambar, dalam piksel, sebagai bilangan bulat tanpa unit.

Implementasi kueri penampung sedang berlangsung di Firefox. Di balik flag layout.css.container-queries.enabled di Firefox 108 beta, Anda akan menemukan unit panjang kueri container—cqw, cqh, cqi, cqb, cqmin, cqmax. Ini adalah satuan panjang yang relatif terhadap ukuran penampung kueri.

Bagian dari serial New to the web