Temukan beberapa fitur menarik yang tersedia di browser web stabil dan beta selama Mei 2023.
Rilis browser stabil
Pada Mei 2023, Firefox 113, Chrome 113, Chrome 114, dan Safari 16.5 menjadi stabil. Mari kita lihat apa artinya ini untuk platform web.
WebGPU
Chrome 113 menyertakan WebGPU, penerus API grafis WebGL dan WebGL 2 untuk web. Vertex menyediakan fitur modern seperti komputasi GPU, akses overhead yang lebih rendah ke hardware GPU, kemampuan untuk merender ke beberapa kanvas dari satu perangkat grafis, serta performa yang lebih baik dan lebih dapat diprediksi.
Set Pihak Pertama
Set Pihak Pertama (FPS) adalah bagian dari Privacy Sandbox. Ini adalah cara bagi organisasi untuk mendeklarasikan hubungan antar-situs, sehingga browser dapat memutuskan kapan akan mengizinkan akses cookie pihak ketiga yang terbatas untuk situs dalam satu set. FPS memulai peluncuran bertahap di Chrome 113.
Fitur media CSS dan lainnya
Untuk CSS, Chrome 113 menyertakan fitur media overflow-inline dan overflow-block.
Serta fitur media update.
Selain itu, terdapat fungsi easing linear(), yang dapat Anda pelajari lebih lanjut dalam artikel Membuat kurva animasi kompleks di CSS dengan fungsi easing linear().
Dukungan Browser
- 113
- 113
- 112
- 17,2
Fitur CSS Color Level 4
Firefox 113 menyertakan notasi fungsional color(), lab(), lch(), oklab(), oklch(), dan color-mix(), bersama dengan properti penyesuaian warna paksa. Artinya, ruang dan fungsi warna baru kini didukung di ketiga mesin utama. Anda dapat mempelajari ruang dan fungsi warna ini lebih lanjut di Panduan warna CSS definisi tinggi.
Kontrol lebih besar atas :nth-child() pilihan
Firefox 113 juga 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
Compressions Streams API
Kini didukung di ketiga mesin utama karena disertakan dalam Firefox 113, Compressions Streams API memungkinkan kompresi dan dekompresi aliran. Artinya, aplikasi JavaScript tidak perlu lagi memaketkan library kompresi.
Penyusunan bertingkat CSS
Safari 16.5 sebagian besar telah menyelesaikan masalah, tetapi juga menambahkan dukungan untuk CSS Nesting, dengan pemilih penyusunan bertingkat baru >, yang digunakan untuk menyusun bertingkat aturan gaya terkait, dengan cara yang tidak asing bagi developer yang telah menggunakan pra-prosesor:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
Menyeimbangkan judul dengan text-wrap: balance
Mulai Chrome 114, Anda dapat menggunakan text-wrap: balance. Hal ini memungkinkan Anda menyeimbangkan judul, sehingga tidak perlu lagi memiliki satu kata di baris terakhir, sehingga memberikan hasil yang lebih menyenangkan dan mudah dibaca. Anda dapat mengetahui informasi selengkapnya di Penggabungan teks CSS: keseimbangan.
CHIPS: Cookie Memiliki Status Terpartisi Independen
Sebagai bagian dari upaya untuk menghentikan cookie pihak ketiga, CHIPS memungkinkan keikutsertaan dalam cookie pihak ketiga yang dipartisi oleh situs tingkat atas menggunakan atribut cookie baru Partitioned. CHIPS tersedia di Chrome 114.
Popover API
Selain itu, di Chrome 114 terdapat Popover API yang mempermudah pembuatan elemen antarmuka pengguna (UI) sementara yang ditampilkan di atas semua UI aplikasi web lainnya.
Hal ini mencakup elemen interaktif pengguna seperti menu tindakan, saran elemen formulir, penentu konten, dan UI pengajaran.
Atribut popover baru memungkinkan elemen apa pun ditampilkan di lapisan atas secara otomatis. Ini berarti tidak perlu lagi mengkhawatirkan pemosisian, elemen penumpukan, fokus, atau interaksi keyboard bagi developer.
Pelajari lebih lanjut dalam Memperkenalkan API popover.
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 114, Chrome 115, dan Safari 16.6. Rilis ini menghadirkan banyak fitur hebat ke platform ini. Lihat catatan rilis untuk semua detailnya, berikut beberapa sorotan.
Chrome 115 menyertakan beberapa nilai untuk properti display CSS. Ini berarti display: flex menjadi display: block flex dan display: block menjadi display: block flow. Nilai tunggal dipertahankan sebagai kata kunci lama, dan setelah di Chrome Stabil, beberapa nilai akan tersedia di semua mesin telusur.
Selain itu, di Chrome 115 terdapat ekstensi ScrollTimeline dan ViewTimeline untuk spesifikasi Animasi Web. Ini mengaktifkan animasi berbasis scroll melalui CSS dan JavaScript.
Firefox 114 menyertakan WebTransport API, update modern untuk WebSockets yang menyediakan dukungan untuk beberapa aliran, aliran searah, dan pengiriman yang tidak sesuai urutan.
Bagian dari serial Baru di web