Interop 2022: yıl sonu güncellemesi

2022'de birlikte çalışabilir hale gelen özelliklerden sadece bazılarını keşfedin.

Bir yılın daha sonuna geldik. Web platformunun birlikte çalışabilirliğini iyileştirmek üzere birlikte çalışırken tarayıcıların yaptığı iyileştirmelere göz atmanın zamanı geldi. Girişimin lansmanını yaparken bu yılın Mart ayındaki yayınımızda işlerin nasıl başladığına göz atabilirsiniz.

71'de Chrome ve Edge Dev'i, 74'te Firefox Nightly, 73'te Safari Technology Preview'u gösteren skorlar.
Deneysel tarayıcıların Mart 2022'deki puanları.

Yıl sonundaki genel puanlar tüm motorlarda büyük bir iyileşme olduğunu gösteriyor.

90'ta Chrome ve Edge Dev'i, 89'da Firefox Gecelik, 94'te Safari Teknoloji Önizlemesi'ni gösteren skorlar.
Deneysel tarayıcıların Aralık 2022'deki puanları.

Bu yayında, 2022'de kaydedilen ilerleme hakkında bilgi edinebilirsiniz. Bu başlık özelliklerine ek olarak, tüm motorlar tarafından birçok küçük iyileştirme yapıldı. Motorlar arasında tutarsızlıklara neden olabilecek ve geliştirme sırasında sizi engelleyebilecek küçük sorunlar düzeltildi. Tarayıcılar arası kullanılabilen büyük özellikleri görmek kesinlikle heyecan verici olsa da bazen en çok soruna neden olan küçük şeyler olabiliyor ve nelerin iyileştirildiğini görmek güzel.

Katmanları basamakla

Basamaklı katmanlar, seçicileri katmanlar halinde gruplandırarak basamakları yönetmenize olanak tanır. Bu, yalnızca her yerde desteklendiğinde kullanışlı hale gelen bir özelliktir. Tüm büyük motorlar artık basamaklı katmanları desteklemektedir ve tüm tarayıcılardaki puanlar özelliğin ne kadar birlikte çalışabileceğini yansıtır. Firefox için yalnızca birkaç test kaldı.

Tarayıcı Desteği

  • 99
  • 99
  • 97
  • 15,4

Kaynak

İletişim öğesi

İletişim kutusu öğesi kalıcı ve modal olmayan iletişim kutuları oluşturulmasına olanak tanır. Bu, web'de yaygın olarak kullanılan bir kalıptır. Bu öğeyi kullanmanız, kendi bileşenlerinizi oluştururken geliştirmek ve test etmek zorunda kalacağınız kullanılabilirliği ve erişilebilirliği sağlar. Adam Argyle, Diyalog bileşeni oluşturma adlı makalede farklı diyalog türleri oluşturmak için bu unsurun nasıl temel alınacağını açıklıyor.

Tarayıcı Desteği

  • 37
  • 79
  • 98
  • 15,4

Kaynak

Alt ızgara

2022'nin başlarında grid-template-rows ve grid-template-columns için subgrid değerini destekleyen tek tarayıcı Firefox'tu. Safari, 2022 yılında destek sunmaya başladı ve bu özellik Chrome'da geliştirilme aşamasındadır. Birlikte çalışabilirlik için yıl sonu son tarihi kaçırılacak ama çok yakında.

Tarayıcı Desteği

  • 117
  • 117
  • 71
  • 16

Kaynak

Görüntü alanı birimleri

Görüntü alanı birimleri, tüm motorlarda yapılan testlerin% 100'ünü geçen tek özelliktir. Küçük ve büyük görüntü alanı kavramları da buna dahildir. Bu kavramlar, cihazın kullanıcı arayüzü öğeleri göründükten ve kayboldukça mobil cihazlarda görüntü alanı boyutunun değişmesine neden olur. Büyük, küçük ve dinamik görüntü alanı birimleri başlıklı gönderide, bu birimler hakkında daha fazla bilgi edinebilirsiniz.

Tarayıcı Desteği

  • 108
  • 108
  • 101
  • 15,4

Renk 4

Renk çalışmalarından oluşan bu koleksiyon, CSS'nin yalnızca daha yüksek tanımlı gamlarda (örneğin, display p3, rec2020) renkleri belirtmesini sağlamakla kalmaz, aynı zamanda her biri renklerle çalışmak için benzersiz yardımcı programlara sahip olan yeni renk işlevleri sağlar. Yeni renk alanları şunlardır: lch(), oklch(), lab(), oklab(), display-p3, rec2020, a98-rgb, prophoto-rgb, xyz, xyz-d50, xzy-d65: Bunları hemen bu bayrağı etkinleştirerek Canary'de deneyin. Bu değişiklikler renk geçişlerine de uygulanır. Böylece yazarlar renk geçişlerinin kullanacağı renk alanını belirtebilir. Aynı işaret, color-mix() desteğini de etkinleştirerek iki rengi istediğiniz bir alanda karıştırmanıza olanak tanır. color-mix() işlevi de Safari ve Firefox'ta bir bayrağın arkasındadır. Daha fazla renk, daha iyi renkler, daha iyi renk geçişleri ve daha iyi araçlar.

Birlikte Çalışabilirlik 2023

Birlikte 2023'ü 2022'nin sonunda durdurmak istemediğimizi ve şimdiden planlama aşamasının şimdiden çoktan geçtiğini umuyorum. Yeni yılda, seçilen özellikleri duyurabileceğiz. Web'in geliştirilmesini kolaylaştıracak bir yılı daha umut edeceğiz.

Ian Schneider'in lokomotif resmi.