Haziran ayında web platformunda yeni kullanıma sunulanlar

Haziran 2024'te kararlı ve beta web tarayıcılarında kullanıma sunulan bazı ilginç özellikleri keşfedin.

Haziran 2024'te Firefox 127 ve Chrome 126 kararlı sürüm olarak kullanıma sunuldu. Bu yayında, web platformuna eklenen yeni özellikler ele alınmaktadır.

JavaScript Set yöntemleri

Kümeler, her programlama dilinde temel bir veri yapısıdır. Artık ayarlanmış işlemleri gerçekleştirmek için JavaScript'in yerleşik yöntemlerini kullanabilirsiniz. Aşağıdaki yöntemler artık Firefox 127'de kullanılabilmektedir ve Yeni Kullanılabilir Temel metriğinin bir parçası haline gelmiştir:

Tarayıcı desteği

  • Chrome: 122.
  • Kenar: 122.
  • Firefox: 127.
  • Safari: 17.

Kaynak

Daha fazla bilgi edinmek için JavaScript Set yöntemleri artık temel düzeyde başlıklı makaleyi inceleyin.

Async Clipboard API

Clipboard API artık Firefox 127'den itibaren tam olarak desteklenmektedir. Firefox artık ClipboardItem arayüzünün yanı sıra Clipboard arayüzünün read() ve write() yöntemlerini de destekliyor. Clipboard API hakkında daha fazla bilgi için Pano erişiminin engellemesini kaldırma bölümüne bakın.

Tarayıcı Desteği

  • Chrome: 76.
  • Edge: 79.
  • Firefox: 127.
  • Safari: 13.1.

Kaynak

CSS gradyanlarında renk interpolasyonu

CSS renk geçişleri, <color-interpolation-method> değerini kabul edecek şekilde belirtilir ve bu özellik artık Firefox'ta desteklenmektedir. Bu da özelliği tüm büyük motorlarda birlikte çalışabilir hale getirir. Artık örneğin, hsl renk sistemini ve daha uzun bir enterpolasyonu kullanarak bir linear-gradient() belirtebilirsiniz.

.longer {
 
background: linear-gradient(90deg in hsl longer hue, red, blue);
}

Tarayıcı desteği

  • Chrome: 111.
  • Kenar: 111.
  • Firefox: 127.
  • Safari: 16.2.

Doküman arası görüntü geçişleri

Daha önce, View Transitions API'yi kullanmak için web sitenizi bir SPA olarak yeniden tasarlamanız gerekiyordu. Bu durum artık geçerli değil. Chrome 126'dan itibaren, görüntü geçişleri aynı kaynaktaki gezinme işlemleri için varsayılan olarak etkinleştirildi. Aynı kaynaktaki iki farklı doküman arasında görünüm geçişi oluşturabilirsiniz.

Belgeler arası görünüm geçişini etkinleştirmek için her iki tarafın da etkinleştirmesi gerekir. Bunu yapmak için @view-transition at-kuralını kullanın ve gezinme tanımlayıcısını auto olarak ayarlayın.

@view-transition {
 
navigation: auto;
}

Tarayıcı Desteği

  • Chrome: 126.
  • Kenar: 126.
  • Firefox: Desteklenmez.
  • Safari Technology Preview: desteklenir.

Doküman arası görüntü geçişleri dokümanında daha fazla bilgi edinin.

Gamepad API trigger-rumble uzantısı

Chrome 126, GamepadHapticActuator arayüzünün kapsamını genişleterek uyumlu oyun kumandaları için trigger-rumble özelliğini web'de kullanıma sunuyor. Bu uzantı, Gamepad API'den yararlanan web uygulamalarının bu işlevle donatılmış gamepad cihazlarının tetikleyicilerini de titreştirmesine olanak tanır.

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ümleri Firefox 128, Chrome 127, Safari 18 ve Safari 17.6'dır. Bu sürümler platforma birçok harika özellik getiriyor. Tüm ayrıntılar için sürüm notlarına göz atın. Aşağıda bunlardan birkaçını bulabilirsiniz.

Safari 17.6, mevcut özelliklerde yapılan düzeltmeleri içeren bir sürümdür. Safari 18'de stil kapsayıcı sorguları, tek sayfalık uygulamalar için görüntü geçişi API'si ve flexbox özelliklerinde safe anahtar kelimesi desteği gibi birçok heyecan verici yeni özellik bulunuyor.

Chrome 127, font-size-adjust CSS özelliğini, oluşturulan içerikte alt metni keyfi sayıda öğe olarak belirtme özelliğini ve MediaMetaData'da bölüm bilgilerini tek tek ekleme özelliğini içerir.

Firefox 128, CSS Özellikleri ve Değerleri'ni içerdiğinden bu özellik, Temel Yeni Kullanılabilir olarak sınıflandırılmıştır. type tanımlamak ve CSS özel mülkleri için yedek değer ayarlamak üzere @property kullanın.