← Radar

Konu: Web3 dk okuma

Interop 2026: Tarayıcılar bu yıl hangi 20 özellikte aynı davranmaya söz verdi?

Bu neden önemli?

Bir CSS özelliği bir tarayıcıda çalışıp diğerinde bozuluyorsa, onu projende kullanamazsın. Interop listesi, hangi özelliklerin yakında her yerde güvenle kullanılabileceğini önceden gösteriyor. Neyi öğrenmeye değer olduğunu seçmek için iyi bir pusula.

Interop nedir?

Web’in eski bir derdi var: Standart yazılmış, tarayıcılar özelliği eklemiş, ama her biri biraz farklı davranıyor. Sen de kodu bir tarayıcıda deneyip diğerinde bozulduğunu görüyorsun. Interop, bu farkları kapatmak için tarayıcı yapan şirketlerin her yıl yürüttüğü ortak bir proje. Apple, Google, Microsoft, Mozilla ve tarayıcı motorlarına katkı veren danışmanlık şirketi Igalia birlikte çalışıyor. WebKit’e göre 2026 projenin beşinci yılı.

Yöntem basit. Her yıl bir odak alanı listesi seçiliyor. Her alan için Web Platform Tests (WPT) içinden bir test seti belirleniyor. WPT, tarayıcıların standarda uyup uymadığını ölçen ortak test paketi. Testler her gün otomatik çalışıyor ve sonuçlar wpt.fyi’deki panoda yayınlanıyor. Her tarayıcı kendi puanını görüyor. Bir de Interop puanı var: Bir testin sayılması için dört tarayıcıda birden geçmesi gerekiyor. Asıl önemli olan bu sayı, çünkü senin için anlamlı olan “her yerde çalışıyor mu?” sorusu.

Liste nasıl seçiliyor?

Mozilla’nın yazısına göre 2026 için 150’den fazla öneri geldi. Bunlardan 20 odak alanı ve 4 inceleme alanı çıktı. Bir önerinin seçilmesi için özelliğin olgun bir standarda dayanması ve iyi test kapsamı olması gerekiyor. Geliştirici talebi de hesaba katılıyor. Seçilen alanların çoğu, State of CSS ve State of HTML anketlerinde en çok şikâyet edilen uyumsuzluklar arasında.

İşe yaradığına dair bir sayı: Interop 2025’te ortak puan yılın başında 25’ti, sonunda 95 oldu. Tek tek tarayıcılar 98–99 arasında bitirdi.

2026 listesinde neler var?

Beş alan geçen yıldan devam ediyor: anchor positioning (bir öğeyi başka bir öğeye göre konumlamak, mesela tooltip’i butonun yanına koymak), CSS zoom, Navigation API, view transitions (bu yıl sayfalar arası geçişler de eklendi) ve WebRTC. Yenilerden öne çıkanlar:

  • Gelişmiş attr(): HTML’deki bir öznitelik değerini CSS’te renk ya da uzunluk gibi tipli bir değer olarak kullanmak.
  • Container style queries: Bir öğeyi, kapsayıcısındaki bir CSS değişkeninin değerine göre biçimlendirmek.
  • contrast-color(): Verdiğin arka plan rengine göre okunaklı kalan rengi (siyah ya da beyaz) tarayıcının seçmesi.
  • Dialog ve popover eklemeleri: closedby, :open ve tooltip tarzı popover="hint".
  • Scroll-driven animations ve scroll snap: Kaydırmaya bağlı animasyonları JavaScript’siz yapmak ve kaydırmanın belli noktalara oturması.
  • Media pseudo-class’ları: :playing, :paused, :muted gibi seçicilerle video ve ses durumuna göre stil vermek.
  • Scoped custom element registries: Aynı sayfada iki ayrı bileşen kütüphanesinin aynı etiket adını kullanabilmesi.
  • Web compat: Gerçek sitelerin bozulduğu küçük ama can sıkıcı farklar, örneğin ES modüllerinin yüklenme sırası ya da user-select’in -webkit- öneki olmadan çalışması.
  • IndexedDB getAllRecords(), fetch ile akışlı yükleme ve Range, Wasm için JSPI, WebTransport: Daha çok uygulama ve altyapı tarafını ilgilendiren API’ler.

İnceleme alanları puana girmiyor. Bunlar ileride odak alanı olabilmek için önce test edilebilir hâle getirilecek konular: erişilebilirlik testleri, JPEG XL görsel formatı, mobil test altyapısı ve WebVTT altyazıları. Standartların nasıl yazılıp tarayıcılara girdiğini web standartları yazımızda anlattık.

Bu senin için ne demek?

Listedeki bir özellik bugün bir tarayıcıda eksikse bile, yıl sonunda büyük ihtimalle hepsinde çalışıyor olacak. Yani yeni bir projede “bunu öğrenmeye değer mi?” diye düşünüyorsan, Interop listesi iyi bir işaret. Panoya bakıp tarayıcı bazında nerede olunduğunu da görebilirsin.

Sonra ne oldu?

Panodaki verilere göre, kararlı sürümlerde ortak Interop puanı 1 Ocak’ta yaklaşık 23’tü, 6 Ekim 2026’da yaklaşık 62’ye çıktı. Tarayıcı bazında ortalamalar Chrome ve Edge’de 92, Firefox’ta 86, Safari’de 79 civarında. Deneysel (önizleme) sürümlerde ise tablo neredeyse tamam: Ekim ortasında dört tarayıcı da 98–99,6 arasında, ortak puan 97 civarında. Fark, özelliklerin önce önizleme sürümlerine girip birkaç ay sonra herkese ulaşmasından kaynaklanıyor. Önizlemede de en geride kalan alanlar view transitions (Firefox’ta yaklaşık yüzde 80) ve WebRTC. Bu yılın özelliklerinden bazılarını yeni web özellikleri yazımızda da bulabilirsin.

Düşün

  • Son projende “Safari’de bozuluyor” diye kullanmaktan vazgeçtiğin bir CSS özelliği var mı? Bu listede mi?
  • Bir özelliği ne zaman kullanmaya başlarsın: Tüm tarayıcılar destekleyince mi, yoksa önizlemede görünce mi?

Videoyu izle

Tıklayınca video YouTube'dan yüklenir; o ana kadar bu sayfa YouTube'a hiçbir istek göndermez.
Kaynaklar (8, İngilizce)

Kendi cümlelerimizle yazılmış bir özettir, çeviri değildir. Tüm kaynaklar yukarıda.

Konu: Web3 dkVideo: Syntax

Svelte DOM'un dışına çıkıyor: Custom renderer nedir, neden zor?

Svelte bugün sadece tarayıcıdaki DOM için kod üretiyor. Svelte çekirdek ekibinden Paolo Ricciuti, aynı bileşenlerin mobil uygulamaya, terminale ya da bir 3D sahneye çizilebilmesi için custom renderer desteği üzerinde çalışıyor. Hedeflerden biri ByteDance'in açık kaynak platformu Lynx ile gerçek native uygulamalar.

Konu: Web3 dkVideo: Syntax

Web uygulaman mobilde neden kötü hissettiriyor? Küçük ayarlar, büyük fark

Telefonda bir web uygulamasını 'yamuk' hissettiren şeyler genelde büyük hatalar değil: Dokununca büyüyen form alanları, yana kayan sayfa, adres çubuğu yüzünden taşan ekran, klavyenin altında kalan buton. Syntax'ın bu bölümündeki sorunları ve çözümlerini MDN ve web.dev'e göre tek tek kontrol ettik.