Eylül ayında web platformunda yeni kullanıma sunulanlar

Kararlı ve beta sürümünde sunulan bazı ilgi çekici özellikleri keşfedin web tarayıcılarında gösterilecek.

Rachel Andrew

Kararlı tarayıcı sürümleri

Eylül 2024'te Firefox 130, Safari 18 ve Chrome 129 kararlı hale geldi. Bu gönderide, web platformuna eklenen yeni özellikler ele alınmaktadır.

<details> için name özelliğine sahip özel akordeonlar

Firefox 130, <details> öğesinin name özelliğini destekler. Bu gruplar <details> öğeleri; burada grup içindeki tek bir öğe aynı anda açık olabilir gerekir. Bu sayede, JavaScript kullanmadan özel bir akordeon oluşturabilirsiniz.

Tarayıcı Desteği

  • Chrome: 120.
  • Kenar: 120.
  • Firefox: 130.
  • Safari: 17.2.

Animasyonu otomatik olarak (ve daha fazlasını) oynatın

Chrome 129, CSS interpolate-size özelliğini ve calc-size() işlevini ekler.

CSS interpolate-size özelliği, bir sayfanın animasyonları etkinleştirmesine ve auto, min-content ve gibi CSS içsel boyutlandırma anahtar kelimelerinin geçişleri fit-content, bu anahtar kelimelerin animasyonlu olabileceği durumlarda.

Tarayıcı Desteği

  • Chrome: 129.
  • Edge: Desteklenmez.
  • Firefox: Desteklenmez.
  • Safari: Desteklenmez.

Kaynak

CSS calc-size() işlevi, calc() işlevine benzer ancak tam olarak bir desteklenen boyutlandırma anahtar kelimesiyle ilgili işlemleri de destekler. Desteklenen boyutlandırma anahtar kelimeleri auto, min-content, max-content ve fit-content şeklindedir.

Tarayıcı desteği

  • Chrome: 129.
  • Kenar: 129.
  • Firefox: Desteklenmez.
  • Safari: Desteklenmez.

Kaynak

CSS'de height: auto; (ve diğer doğal boyutlandırma anahtar kelimeleri) için animasyon başlıklı makalede daha fazla bilgi edinin.

JavaScript'te süreleri biçimlendirme

Chrome 129'da ayrıca Intl.DurationFormat işlevi de yer alır. Bu işlev, süreleri biçimlendirmek için birden fazla yerel ayarı destekleyen bir yöntem (ör. "1 saat 40 dakika 30 saniye") sağlar.

Tarayıcı desteği

  • Chrome: 129.
  • Kenar: 129.
  • Firefox: Desteklenmez.
  • Safari: 16.4

Kaynak

WebCodecs API

İlgili içeriği oluşturmak için kullanılan Web Codecs API'si artık Firefox 130'da masaüstünde desteklenmektedir. geliştiricilerin bir video akışının ayrı karelerine alt düzey erişimi ve ses parçalarından oluşur. Yeni arayüzler şunlardır: VideoEncoder, VideoDecoder, EncodedVideoChunk, VideoFrame ve VideoColorSpace. Bu API, henüz Firefox Android'de desteklenmediği için Baseline Yeni'yi tam olarak kullanıma sunmuyor ancak Android için Firefox Nightly desteği mevcut.

Tarayıcı Desteği

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 130.
  • Safari: 16.4.

Kaynak

Özel özellikler için CSS stili sorguları

Safari 18, CSS Stil Sorguları dahil olmak üzere çeşitli yeni özellikleri destekler. Stil sorguları, yeniden kullanılabilir stiller oluşturma ve bunları grubu. Örneğin, birden fazla varyantı olan yeniden kullanılabilir bir bileşeniniz varsa.

Tarayıcı desteği

  • Chrome: 111.
  • Kenar: 111.
  • Firefox: Desteklenmez.
  • Safari: 18.

Kaynak

CSS stil sorguları hakkında daha fazla bilgi edinin.

Aynı doküman görünümü geçişleri

Safari 18, SPA'lar için de aynı doküman görünümü geçişlerini destekler. Bu, bir uygulamanın farklı durumları arasında görsel geçişler oluşturmanıza olanak tanır.

Tarayıcı Desteği

  • Chrome: 111.
  • Edge: 111.
  • Firefox: Desteklenmez.
  • Safari: 18.

Kaynak

Daha fazla bilgi: aynı doküman görüntüleme geçişleri

Beta tarayıcı sürümleri

Beta tarayıcı sürümleri, tarayıcının bir sonraki kararlı sürümünde yer alacak özelliklerin önizlemesini sunar. Bu, sitenizi etkileyebilecek yeni özellikleri veya kaldırma işlemlerini, herkese sunulmadan önce test etmenin tam zamanı. Yeni beta sürümler Firefox 131, Chrome 130 ve Safari 18.1'dir. Bu sürümler, platforma pek çok muhteşem özellik katıyor. Tüm ayrıntılar için sürüm notlarına göz atın. Bazı nedenler öne çıkanlar.

Firefox 131, yeni JavaScript iteratör yardımcıları içeriyor ve Bağımsız Bölümlendirme Durumuna Sahip Çerezler (CHIPS) artık etkin.

Chrome 130, hem satır içi parçalandırma (satır düzeni) hem de blok parçalandırma (baskı ve çok sütunlu için oluşturulan parçalar) için box-decoration-break: clone desteği içerir. IndexedDB'de daha iyi hata raporlaması da vardır. ve Web Serial SerialPort arayüzü için yeni bir connected özelliği içeriyor.

Safari 18.1, mevcut özelliklerde yapılan hata düzeltmelerini içeren bir sürümdür.