Temukan beberapa fitur menarik yang tersedia di browser web stabil dan beta selama Maret 2023.
Rilis browser stabil
Pada Maret 2023, Firefox 111, Chrome 111, dan Safari 16.4 menjadi stabil. Mari kita lihat apa artinya ini untuk platform web.
Atribut HTML global
Firefox 111 menambahkan dukungan untuk beberapa atribut HTML global yang berguna. Atribut autocapitalize
mengontrol apakah teks dapat secara otomatis dikapitalisasi saat pengguna mengetik di keyboard virtual.
Atribut translate
menunjukkan apakah suatu elemen harus diterjemahkan saat halaman dilokalkan.
Sistem File Pribadi Origin (OPFS)
Firefox menambahkan dukungan untuk Origin Private File System (OPFS) saat menggunakan File System Access API. Pelajari OPFS lebih lanjut.
View Transitions API
Chrome 111 menambahkan View Transitions API, sehingga pembuatan transisi yang bagus di Aplikasi Web Satu Halaman (SPA) menjadi lebih sederhana dengan membuat snapshot tampilan dan memungkinkan DOM berubah tanpa tumpang tindih di antara status.
Cari tahu selengkapnya di postingan peluncuran Transisi tampilan SPA hadir di Chrome 111.
Ruang dan fungsi warna CSS baru
Selain itu, Chrome 111 menyertakan serangkaian cara baru untuk menggunakan warna di web. Chrome kini mendukung ruang warna yang mengakses warna di luar gamut RGB, beserta fungsi color()
dan color-mix()
. Pelajari lebih lanjut di Panduan warna CSS definisi tinggi dan postingan blog di color-mix()
.
Rilis Chrome juga mencakup DevTools baru untuk membantu Anda bekerja dengan fungsi warna baru ini.
Kontrol lebih besar atas :nth-child()
pilihan
Chrome 111 menambahkan kemampuan untuk meneruskan daftar pemilih ke :nth-child()
dan nth-last-child()
. Pelajari hal ini lebih lanjut, dan lihat contohnya dalam postingan Kontrol lebih besar atas pilihan :nth-child() dengan sintaksis S.
Dukungan Browser
- 111
- 111
- 113
- 9
Dukungan untuk slide sebelumnya dan berikutnya di Media Session API
Terakhir dalam daftar penambahan Chrome 111 ini adalah Mempresentasikan slide actions untuk API sesi media—"previousslide"
dan "nextslide"
.
Dukungan Browser
- 111
- 111
- x
- x
Dukungan kelas semu di Safari
Safari 16.4 adalah rilis yang luar biasa untuk platform web. Artikel ini tidak akan mencakup semua penambahan tersebut, jadi lihat daftar lengkap fitur di catatan rilis Safari 16.4.
Ada banyak pseudo-class CSS tambahan yang didukung dalam rilis ini: :user-invalid
, :user-valid
, :dir()
, :modal
, dan :fullscreen
.
Sintaksis rentang baru untuk kueri media
Rilis Safari ini membuat sintaks rentang yang jauh lebih elegan dan berguna untuk kueri media dapat dioperasikan bersama di ketiga mesin. Lihat contoh sintaksis ini di postingan ini, yang dipublikasikan saat sintaksis dikirimkan di Chrome.
Properti dan Nilai CSS
Safari 16.4 menambahkan dukungan untuk @property
, yang memungkinkan pendaftaran properti khusus CSS langsung di stylesheet. Pelajari hal ini lebih lanjut di @property: memberikan kekuatan super pada variabel CSS.
Dukungan CSS API
Penambahan hebat untuk CSS akan terus hadir, dengan dukungan untuk OM Berjenis CSS. API ini mengekspos nilai CSS sebagai objek JavaScript yang diketik, bukan string. Ini membuat penggunaan CSS dari JavaScript lebih mudah, dan berperforma lebih baik daripada metode yang ada.
Ada juga dukungan untuk stylesheet yang dapat dibuat dengan CSSStyleSheet()
. Ini akan memungkinkan berbagi stylesheet antara dokumen dan subhierarki shadow DOM-nya. Dengan versi Safari ini, stylesheet yang dapat dibuat kini didukung di ketiga mesin telusur.
Web Push dan Badging API
Safari kini mendukung Web Push, bersama dengan Badging API, yang merupakan kabar baik bagi developer aplikasi. Secara khusus, versi ini berarti notifikasi push didukung di semua mesin telusur utama.
Mengimpor peta
Penambahan lain yang membuat fitur memiliki status interoperabilitas adalah penambahan Peta impor JavaScript, sehingga mempermudah pengimporan modul ES.
Dukungan Browser
- 89
- 89
- 108
- 16,4
Rilis browser beta
Versi browser beta memberikan pratinjau dari hal-hal yang akan ada dalam versi browser stabil berikutnya. Ini adalah waktu yang tepat untuk menguji fitur baru, atau penghapusan, yang dapat memengaruhi situs Anda sebelum dunia merilisnya. Versi beta baru adalah Firefox 112, Safari 16.5, dan Chrome 112. Rilis ini menghadirkan banyak fitur hebat ke platform ini. Lihat catatan rilis untuk semua detailnya, berikut beberapa sorotan.
Firefox 112 menambahkan dukungan untuk atribut inert
, yang akan membuat atribut yang berguna ini tersedia di semua mesin telusur. Anda dapat mempelajari inert lebih lanjut di Memperkenalkan inert. Firefox juga akan mengaktifkan dukungan untuk fungsi easing linear()
.
Chrome 112 dan Safari 16.5 menambahkan dukungan untuk Penyebaran CSS, fitur yang sangat dinantikan oleh banyak developer.
Chrome 112 juga mencakup dukungan untuk animation-composition
. Pelajari cara kerja properti ini di Menentukan bagaimana beberapa efek animasi harus digabungkan dengan komposisi animasi.
Jika Anda menggunakan mode Headless Chrome, misalnya dengan Puppeteer, 112 akan menghadirkan mode Headless yang baru. Pelajari fitur ini di Mode Headless Chrome mendapatkan upgrade.
Bagian dari serial Baru di web