Web, Interop 2024 ile daha da iyileşiyor

 (webkit.org)
2 puan yazan GN⁺ 2024-02-03 | 1 yorum | WhatsApp'ta paylaş
  • Interop 2024, başlıca tarayıcı motoru ekiplerinin aynı web özelliklerini daha tutarlı biçimde uygulamasını hizalamaya yönelik ortak bir proje; bu yıl 17 odak alanı ve 3 araştırma projesiyle yürütülüyor
  • Birlikte çalışabilirlik iyileştirmeleri Web Platform Tests gibi otomatik testlerle ölçülüyor; WPT, 1,8 milyondan fazla teste sahip ve başlıca tarayıcıların genelinde %95’in üzerinde başarıyla geçiliyor
  • Interop 2023, seçilen testlerde üç büyük tarayıcı motorunun ortak geçme oranını %48’den %95’e çıkardı; P3 color, Subgrid, Container Queries, :has(), Web Components ve Media Queries 4 desteğini büyük ölçüde hizaladı
  • Bu yıl 96 öneri arasından 16’sı seçildi ve 2023 çalışmalarının bir bölümü devralınarak Accessibility, CSS Nesting, Custom Properties, IndexedDB, Layout, Popover, URL gibi 17 alana odaklanılıyor
  • Microsoft Edge, Interop panosuna ayrı bir sütun olarak eklendi; böylece tarayıcı bazında ilerleme daha doğrudan karşılaştırılabiliyor

Tarayıcı birlikte çalışabilirliğini hizalama yöntemi

  • Web, çeşitli cihazlarda çalışacak şekilde tasarlandığı için milyarlarca kişi tarafından iş birliği, öğrenme ve bağlantı kurma amacıyla kullanılabiliyor
  • Geliştiricilerin tüm tarayıcılara ve tüm kullanıcılara aynı deneyimi sunabilmesi için web teknolojilerinin tarayıcı uygulamalarının birbirine benzer olması gerekiyor
  • Uygulama tutarlılığı web standartları sürecinde oluşturulur; yeni web teknolojilerinin davranışı ayrıntılı teknik belgelerle tanımlanır
  • Tarayıcıların web standartlarına uyup uymadığı otomatik testlerle doğrulanır
    • Web Platform Tests 1,8 milyondan fazla test içerir
    • Başlıca tarayıcıların genelinde WPT’lerin %95’inden fazlası geçer

Interop 2023’ün yarattığı değişim

  • Interop 2023, Ocak 2023’te seçilen testlerin %48’inin üç büyük tarayıcı motorunun tamamında geçtiği bir durumla başladı
    • Referans tarayıcılar, kullanıcılara dağıtılmış Chrome ve Firefox masaüstü Linux ile macOS Monterey’de Safari idi
  • Bir yıl sonra geçme oranı %95’e yükseldi
    • Referans tarayıcılar Chrome Dev, Firefox Nightly masaüstü Linux ve macOS Ventura’da Safari Technology Preview idi
  • Birçok web özelliğinin tarayıcılar arası desteği iyileşti
    • P3 color, çıkışının başlamasından 7 yıl sonra tüm tarayıcılarda tam desteklenir hale geldi
    • Form controls, web tarihinde ilk kez dikey yazım modunu destekledi
    • CSS border-image, başlangıçta amaçlandığı gibi çalışır hale geldi
    • Subgrid, Container Queries, :has(), Motion Path, CSS Math Functions, inert, @property tüm modern tarayıcılarda desteklenir oldu
    • Offscreen Canvas, Modules in Web Workers, Import Maps, Import Assertions, JavaScript Modules gibi Web API’leri iyileştirildi
    • Media Queries 4 spesifikasyonunun tamamı, daha kolay bir söz dizimiyle her yerde desteklenir hale geldi
    • Web Components; adoptedStyleSheets, ElementInternals, Form-Associated Custom Elements, Shadow DOM ve Custom Elements temel davranışlarında iyileştirildi
    • :nth-child(), :nth-last-child(), :modal, :user-valid, :user-invalid gibi CSS pseudo-class’ları için tutarlı tarayıcı desteği beklenebilir hale geldi
    • Feature queries, font özelliklerini algılama desteğini yeni olarak kazandı
    • Font Palettes, renkli font desteğini güçlendirdi
    • CSS Masking, HTML Forms, Pointer and Mouse Events, Scrolling, Transforms, URL, WebCodecs ve web uyumluluğu hata kümelerinde de kayda değer ilerleme sağlandı
  • Interop 2023’ün 26 odak alanından 20’si başarıyla tamamlandı
  • 2024’te de Custom Properties, Pointer and Mouse Events, URL ve Flexbox·Grid·Subgrid’i bir araya getiren Layout çalışmaları devam ediyor

Interop 2024’ün yapısı

  • 2024’te 96 odak alanı önerisi değerlendirildi ve sonuçta 16’sı seçildi
  • Bazı yeni önerilerin birleştirilmesi ve 2023 çalışmalarının bir bölümünün devralınmasıyla Interop 2024 toplam 17 odak alanına sahip oldu
  • Kararlı sürüm tarayıcılar bazında Interop 2024’ün genel puanı tesadüfen yine %48’den başladı
  • Bu yıldan itibaren Interop dashboard üzerine Microsoft Edge için ayrı bir sütun eklendi
    • Şu anda bu sütun, Windows 10’da çalışan Edge ve Edge Dev’i temsil ediyor

2024'ün odak alanları

  • Accessibility

    • Interop 2023'ün Accessibility araştırma projesinde Apple erişilebilirlik ekibi, WPT için erişilebilirlik test altyapısı oluşturdu ve 1.300'den fazla erişilebilirlik testi yazdı
    • Bu testler Interop 2024 odak alanına dahil edilerek tarayıcıların erişilebilirlik desteğinin iyileştirilmesi teşvik ediliyor
    • Yeni erişilebilirlik testlerinin çoğu WAI-ARIA konusunu ele alıyor
    • Özellikle Roles Model ve Accessible Name and Description Computation merkeze alınıyor
    • Bunlar, yardımcı teknoloji kullanıcılarının öğelerin amacını ve neler yapabildiğini anlaması için tutarlı mekanizmalar sunar
    • HTML Accessibility API Mappings specification ile ilgili testler de dahil
    • HTML öğelerinin varsayılan erişilebilirlik anlamlarını ve <label> ile görsel alt metni gibi özelliklerde tarayıcı davranış kurallarını tanımlar
    • display: contents erişilebilirlik testleri de yeni olarak dahil edildi
    • Bu CSS görüntüleme modu, Flexbox veya Grid için ebeveyn-çocuk-torun ilişkilerini ayarlarken içeriğin etrafındaki kutuyu kaldırmakta kullanışlıdır
    • İlk uygulamalarda, kutu kaldırıldığında içerik erişilebilirlik ağacından da tamamen kayboluyor ve bu da yardımcı teknoloji kullanıcıları için sorun yaratıyordu
    • Tarayıcılarda sorunların çoğu düzeltildi, ancak her durumda tamamen çözülmüş değil

  • CSS Nesting

    • CSS Nesting, uygulama farklarını azaltmak ve geliştiricilerin güvenle kullanabilmesini sağlamak için Interop 2024'e dahil edildi
    • CSS iç içe yazım özelliği 2023'te dört büyük tarayıcının tamamında yayınlandı
    • Chrome, Edge ve Safari bunu nisan ve mayıs aylarında önce yayınladı
    • Firefox ağustos ayında yayınladı
    • Web standardı mayıs ile ağustos arasında biraz değişerek, tüm iç içe seçicilerin bir sembolle başlaması yönündeki ilk gerekliliği gevşetti
    • Geliştiriciler & article yerine article kullanabilir
    • Tüm uygulamalar güncellendi, ancak Nesting'in karmaşık ayrıntı davranışları CSS Working Group tarafından netleştirilirken birlikte çalışabilirliği iyileştirme alanı hâlâ var
    • Safari'deki test başarısızlıklarının çoğu, iç içe CSS'in Shadow DOM ve :host ile nasıl etkileşime girdiğiyle ilgili

  • Custom Properties

    • @property at-rule son birkaç yılda tarayıcılarda yayınlanmaya başladı
    • Interop 2023'ün Custom Properties alanında, tüm kararlı tarayıcılar genelinde ortak test geçme oranı %4'ten %7,6'ya yükseldi; tüm önizleme tarayıcılarında ise %90,7'si geçti
    • Firefox destek ekleyen son tarayıcı ve çalışma şu anda Firefox Nightly'de sürüyor
    • Çalışma tamamlanmadığı için 2024'te de odak alanı olarak devam ediyor
    • @property kullanarak CSS özel özelliklerinin söz dizimini, kalıtım davranışını ve başlangıç değerini, tarayıcı motorlarının CSS özelliklerini tanımlama biçimine benzer şekilde bildirebilirsiniz
    • Bu sayede gradyanların veya transform'un belirli bölümleri gibi daha önce CSS ile mümkün olmayan animasyonlar mümkün olur

  • Declarative Shadow DOM

    • Declarative Shadow DOM, JavaScript olmadan yalnızca HTML ile yeniden kullanılabilir widget'lar ve bileşenler oluşturmaya yarayan deklaratif bir API'dir
    • Safari 16.4 Mart 2023'ten, Chrome 90 ise Nisan 2021'den beri destekliyor
    • Firefox'un Firefox Nightly'de bir uygulaması bulunuyor
    • State of HTML 2023 anketinde sık talep edilen özelliklerden biriydi ve tüm tarayıcılarda birlikte çalışabilirliği sağlamak için Interop 2024'e dahil edildi

  • Font size adjust

    • font-size-adjust, eski teknolojilere odaklanmanın faydasını gösteren bir örnek
    • Firefox bunu ilk kez 2008'de uyguladı, ancak web tasarımcıları ve geliştiriciler arasında neredeyse hiç kullanılmadı veya tartışılmadı
    • İlk spesifikasyon zamanla, iki değerli söz dizimiyle daha fazla dili destekleyecek şekilde gelişti ve from-font değeriyle kullanılabilirliği iyileşti
    • WebKit ekibi temel sürümü Safari 16.4'te uyguladı ve Safari 17.0'da güncelleme ekledi
    • Mozilla uygulamasını Firefox 118'de güncelledi; Safari ve Firefox şu anda tüm testlerden %100 geçiyor
    • Chrome 2015'te deneysel bir uygulamaya başladı, ancak henüz yayınlamadı
    • Font size adjust, bir metin dizisi içindeki birden fazla fontun aynı görsel boyutta görünmesini ayarlamak için bir yöntem sunar
    • Örneğin 1.4rem metinde x-height, cap height, ch genişliği, ic genişliği ve ic yüksekliği hizalanabilir
    • Kod ile normal metni karıştırırken veya birden fazla dili tek bir cümlede bir araya getirirken kullanışlıdır

  • HTTPS URLs for WebSocket

    • WebSocket API'nin ws: ve wss: adlı HTTP(S) dışı şemaları kullanma özelliği vardır
    • URL davranışı HTTP(S) URL'lerle neredeyse aynı olduğundan API kullanımı zahmetli olabilir
    • WebKit ekibi, web geliştiricilerinin geri bildirimlerine dayanarak API'nin HTTP(S) URL'leri de desteklemesini sağladı ve bunu Safari 17.0'da yayınladı
    • Önceden location.protocol değerine göre wss: veya ws: olarak değiştiren kod gerekiyordu; artık new WebSocket(path) gibi kullanılabiliyor
    • Interop 2024'e dahil edilmesindeki amaç, diğer tarayıcıların da bunu benimsemesini sağlamak

  • IndexedDB

    • IndexedDB, verileri nesne yönelimli veritabanı biçiminde istemci tarafında saklayan bir API'dir
    • 2011'den itibaren tarayıcılarda yayınlanmaya başladı ve web standardı gelişmeye devam etti
    • version 2 ve version 3 tüm büyük tarayıcılar tarafından destekleniyor
    • version 2 tamamen birlikte çalışabilir durumda, ancak version 3 için uygulama kalitesini eşitlemeye yönelik ek çalışma gerekiyor

  • Layout

    • CSS Grid ve Flexbox, 2021'deki ilk Interop projesine dahil edilmişti
    • Subgrid Interop 2023'e eklendi
    • Üç yerleşim yöntemi de iyi durumda, ancak henüz kusursuz değil
    • 2024'te üç alandaki testler Layout adlı tek bir odak alanında birleştirildi
    • Karmaşık uç durumlarda birlikte çalışabilirliği artırma çalışmaları sürüyor
    • Geliştiriciler Flexbox, Grid ve Subgrid'in hepsini güvenle kullanabilir; tüm tarayıcılar bunları sağlam biçimde destekliyor

  • Pointer and Mouse Events

    • Pointer events, fare, kalem/stylus ve bir veya daha fazla parmakla dokunma gibi işaretleme giriş aygıtlarını tek bir DOM olay modeliyle işler
    • Bu API 2012'den itibaren tarayıcılarda yayınlanmaya başladı ve 2019'a kadar tüm tarayıcılara girdi, ancak birlikte çalışabilirliği istikrarsızdı

  • Interop ekibi 2022’de Pointer and Mouse Events araştırma projesini başlatarak mutabakatı netleştirdi ve bunu yansıtan testler yazdı

    • Interop 2023’te bu testler odak alanına alındı ve geçiş oranı %34’ten %81’e yükseldi
    • Hâlâ yapılacak işler kaldığı için 2024’te de odak alanı olarak devam ediyor

  • Popover

    • HTML’in popover özelliği, öğelerin sayfanın en üst katmanında görünmesini sağlayan tarayıcı yerleşik bir yöntem sunar
    • Tüm web sayfasını kaplayan bir overlay oluştururken en uygun seçenek dialog öğesidir
    • Başka öğeleri pop-up mesaj, kullanıcı arayüzü veya görünüp kaybolan içerik hâline getirmek istediğinizde popover bir framework sağlar
    • popover desteği 2023’te Chrome 114 ve Safari 17.0’da kullanıma sunuldu
    • Firefox, Firefox Nightly’de destek üzerinde çalışıyor

  • Relative Color Syntax

    • Relative Color Syntax, başka renkleri referans alarak CSS renkleri tanımlamanın yeni bir yoludur
    • Mevcut bir rengi belirli bir miktar daha açık veya daha koyu yapabilir ya da bir renk değişkeninin doygunluğunu ayarlayıp ikinci bir değişkene atayabilirsiniz
    • Tasarım sistemleri oluştururken özellikle güçlü olabilir
    • Safari 16.4, desteği ilk olarak Mart 2023’te kullanıma sundu
    • Chrome 119 ve Edge 119 desteği Ekim ve Kasım 2023’te kullanıma sundu
    • Mevcut implementasyonların hiçbiri currentcolor’ın Relative Color Syntax ile birlikte kullanılmasını desteklemiyor
    • Interop 2024’ün Relative Color Syntax alanı, tam destek durumuna değil, dar kapsamlı olarak currentcolor desteğine ve renk gamı dışı davranış testlerine odaklanıyor
    • P3 color desteklemeyen ekranlarda ne olduğunu kontrol ediyor

  • requestVideoFrameCallback

    • <video> öğesi, web’e video eklemek için güçlü bir özellik sunar
    • HTMLVideoElement, JavaScript’te video nesnesini manipüle etmeye yarayan özellikler ve metotlar sağlar
    • requestVideoFrameCallback(), video kareleri bazında işlemlerin verimli biçimde yapılmasını sağlar
      • Video işleme veya analiz
      • canvas’a çizim yapma
      • Ses kaynağıyla senkronizasyon
    • Chrome 83 ve Safari 15.4’ten itibaren destekleniyor
    • Interop 2024’e dahil edilmesi, tarayıcı implementasyonlarını tamamlamaya ve iyileştirmeye yardımcı olur

  • Scrollbar Styling

    • Scrollbar Styling alanı, kaydırma çubuğu stillendirmede kullanılabilen iki CSS özelliğini kapsar
    • scrollbar-width, auto, thin, none olmak üzere üç değer sunar
      • auto varsayılan genişliktir
      • thin daha ince bir kaydırma çubuğu sağlar
      • none, içerik kaydırmasını korurken kaydırma çubuğunu gizler
    • Firefox 64 desteği Aralık 2018’de implemente etti; Chrome 121 ve Edge 121’de de yeni kullanıma sunuldu
    • scrollbar-gutter, kaydırma çubuğu için yer ayırarak kaydırma çubuğunun var olup olmamasından bağımsız olarak aynı layout’un korunmasını sağlar
    • scrollbar-gutter: stable, kaydırma çubuğu olmasa bile tarayıcıya yer ayırmasını söyler
    • Kaydırma çubuğuna ihtiyaç duyulup duyulmadığı değiştiğinde layout kaymasını önleyebilir
    • Chrome 94, Edge 94 ve Firefox 97’de 2021~2022 döneminde kullanıma sunuldu
    • Safari’nin bu odak alanını tamamlamak için en çok işi yapması gerekiyor
    • Chrome ve Firefox testlerin zaten %100’ünü geçiyor
    • Safari, 2009’da ::-webkit-scrollbar-* adlı 9 pseudo-element ile kaydırma çubuğu stillendirme özelliğini ilk sunan tarayıcı olmuştu; ancak bu yöntem resmi bir CSS web standardı olmadı
    • CSS Working Group çok daha basit bir yaklaşımı seçti

  • @starting-style and transition-behavior

    • Bu alan, animasyon kontrolü için iki yeni özelliğe odaklanır
    • Her iki özellik de Eylül 2023’te Chrome 117 ve Edge 177’de kullanıma sunuldu
    • @starting-style, belirli bir öğenin başlangıç değerlerini tanımlamayı sağlar
    • Bir öğe transition’dan geçmek üzereyken buna ihtiyaç duyulur
    • display:none durumuna girerken veya bu durumdan çıkarken geçiş yapmanın bir yolunu da sunar
    • transition-behavior, daha önce yalnızca animasyonlarda mümkün olan ayrık animasyonlanabilir özelliklerin işlenmesini CSS transition’larına genişletir
    • Öğeleri gösterirken veya gizlerken display özelliğinde transition yapmanın yolunu açar

  • Text Directionality

    • Metin akış yönü, web dizgisinde önemli bir unsurdur
    • Bazı diller soldan sağa, bazı diller sağdan sola akar
    • dir attribute, HTML öğelerinde yönün left, right, auto olarak belirtilmesini sağlar
    • auto, tarayıcıdan ilk harfe bakarak yönü tahmin etmesini ister
    • Yönlülük ile shadow tree arasındaki etkileşim yakın zamana kadar iyi tanımlanmamıştı
    • Bu konu standart düzeyinde ele alındı ve Interop 2024’e dahil edilmesiyle implementasyon uyumu doğrulanıyor

  • text-wrap: balance

    • Web tasarımcıları çok kısa veya yalnızca tek kelimelik satırları engellemenin bir yolunu uzun zamandır istiyordu
    • Responsive web design ve kolon genişliği üzerinde kontrol eksikliği bu sorunu daha da zorlaştırıyor
    • text-wrap, belirli kullanım senaryolarına göre satır sonu hesaplama yöntemini tarayıcıya bildiren çeşitli seçenekler sunar
    • text-wrap: balance, başlıklar için uygun bir çözümdür
    • Birkaç satırlık metni dengeli biçimde yerleştirerek her satırda benzer miktarda metin bulunmasını sağlar
    • Chrome 114 ve Firefox 121’de kullanıma sunuldu; Safari Technology Preview’da implemente edildi
    • Interop 2024, text-wrap-mode, text-wrap-style ve white-space-collapse davranış testlerini de içerir
    • CSS Working Group yakın zamanda bu longhand’lerin birbiriyle etkileşim biçimini değiştirdiği için tarayıcılar arası destek şu anda tutarlı değil

  • URL

    • URL, web’in en temel unsurlarından biridir; URL olmadan web var olmazdı
    • Web’in erken tarihinde icat edilen pek çok şey gibi URL desteği de hâlâ tamamen interoperable değil
    • WHATWG, URL’lerin tam olarak nasıl çalışması gerektiğini ayrıntılı biçimde içeren URL Living Standard standardını hazırladı
    • Bu standardı destekleyen testler Interop 2023 odak alanıydı ve geçiş oranı %77’den %85’e yükseldi
    • 2024’te de interoperabiliteyi sağlamak için çalışmalar sürüyor
    • Safari testlerin %99.7’sini geçiyor

Araştırma projeleri ve ilerleme takibi

  • Interop 2024 ayrıca 3 araştırma alanı içeriyor
    • Accessibility Testing
    • Mobile Testing
    • WebAssembly Testing
  • Araştırma alanları, Interop ekibinin daha fazla test yazıp bunları çalıştırılabilir hâle getirmesini amaçlayan çalışmalardır
  • Mobile Testing araştırma projesi, mobil işletim sistemlerinde tarayıcıların test edilebilmesi için WPT’nin ihtiyaç duyduğu altyapıyı tamamlamayı hedefliyor
    • Gelecekte Interop proje panosuna mobil puanların da dahil edilmesi mümkün
  • Üç araştırmadan ikisi geçen yıldan devam eden projeler olsa da 2024’te hepsi %0 tamamlanma durumuyla başladı
  • Katılımcı ekipler bu yıl yeni hedefler belirledi ve pano, bu hedeflere göre ilerlemeyi gösteriyor
  • Interop 2024 ilerlemesi Interop 2024 dashboard üzerinden takip edilebilir
  • Birlikte çalışabilirlik, web’in başarısını mümkün kılan temel sütunlardan biridir; Interop 2022 ve 2023’teki çalışmalar üzerine 2024’te de iş birliği devam ediyor

İlgili okumalar

1 yorum

 
GN⁺ 2024-02-03
Hacker News yorumları

  • Burada kesinlikle hoş değişiklikler var ve desteğin iyileşmesi sevindirici.
    Örneğin CSS nesting, SASS ve LESS’in faydalı olmasının temel nedenlerinden biriydi; bu yüzden büyük bir değişiklik. Değişkenler gibi bir preprocessor özelliği olmaktansa, en başından CSS’in çekirdek bir özelliği olarak yer alması daha doğruydu.
    Custom properties ile neler yapılabildiği de her zaman ilgi çekici ve bunu Shadow DOM ile custom elements sonrasında iyi bir sonraki adım olarak görüyorum. Popover da beklenmedik derecede iyi; artık JavaScript olmadan popup modal benzeri şeyler yapılabilmesi çok kullanışlı. Custom modal, dropdown menu, hamburger button gibi şeylere vakit harcamayı azaltabilir.
    Yine de bu tür projelerde formlara da daha fazla önem verilmesini isterdim. HTML 5 dönemindeki çeşitli alanların tarayıcılar arasında aşırı farklı olması, görünüm için özel pseudo-class stillendirmesine dayanması ve genel olarak özelleştirmenin zor olması, neredeyse her şeyi yapabilen bir platform için şaşırtıcı derecede eski görünüyor

    • Bir UI tasarımcısı serbestçe hareket edebiliyorsa, eskiden beğenmiş olsa bile bu yeni varsayılan modal, menü ve butonları istememesi sık görülür.
      Bu değişiklik yardımcı olacaktır ama UI’da tutarlılık, herkesin peşinden gitmesi gereken bir özellikten çok bir zayıflık gibi ele alınıyor.
    • CSS nesting, CSS preprocessor kullanmak için kalan son neden.
      Safari 17.2+ daha yaygın hale geldiğinde sadece saf CSS kullanmak mümkün olacak.
      Bunun dışında @media query’leri için değişkenler de bir neden, ama bu daha az yaygın bir ihtiyaç.

  • Görünüşe göre JPEG XL sonuçta dahil edilmemiş. Uzun zamandır genel olarak net bir iyileşme getiren ilk görüntü biçimi olduğu düşünülürse bunu anlamak oldukça zor.
    Interop’un, Google’ın fiilen benimsenmesini engelleyen bu durumu sona erdirmesini umuyordum ama yaygın kullanılan eski formatların yetersiz ikameleri birikmeye devam ederken biraz daha beklemek gerekecek gibi görünüyor.

    • Buna ben de üzüldüm.
      Google’ın JPEG XL ile ilgili derdinin ne olduğunu bilmiyorum.

  • “Tüm tarayıcılar artık P3 rengini tamamen destekliyor” demek aslında pek doğru değil.
    Firefox hâlâ renkleri cihaza göndermeden önce hepsini sRGB’ye clamp’liyor. https://bugzilla.mozilla.org/show_bug.cgi?id=1626624#c16

  • Web ile sadece ara sıra uğraştığım için asıl hedef kitle ben değilim ama WebKit’te en çok gözüme çarpan eksik özellik, SVG favicon desteğinin olmaması.
    Bunu anlamak gerçekten zor ve farklı boyutlarda Apple’a özel ikonların hepsiyle uğraşmak benim gibi hafif düzeyde web geliştirme yapan biri için epey zahmetli.

    • Artık eskisi kadar kötü değil, buna sevinebilirsin. Şimdi sadece tek bir Apple’a özel ikon yeterli [1]:
      [1]: https://evilmartians.com/chronicles/how-to-favicon-in-2021-s...
    • Biraz ilişkili bir konu ama Chrome, ico favicon varsa SVG favicon kullanmıyor. (https://bugs.chromium.org/p/chromium/issues/detail?id=145085...) Bu yüzden PNG favicon ile SVG favicon birlikte dağıtılıyor.
    • Bu arada Safari, bu formattaki tek renkli SVG favicon desteğine sahip.
      Vite gibi bir şey kullanılırsa, tek bir kaynak görselden favicon ve ana ekran ikonu üretiminin tamamını otomatik hale getirmek de mümkün.
    • SVG istenen şekilde ölçeklenmiyor. Örneğin 256px kare bir görseli vektörleştirmiş olsanız bile, sadece vektör dönüşümüyle 24px boyutunda iyi görünmesini sağlayamazsınız.
    • Doğru. Bu ikonların hepsini üretmek zorunda olmamak gerek.
      Ayrıca listelerin de stillendirilebilmesi güzel olurdu; örneğin bir öğeye bayrak benzeri bir şey eklemek gibi.
      CSS page transitions ya da scroll-driven animations hakkında da hiç söz edilmemiş; bunlar da tekrarlayan JavaScript kodunu azaltabilir.

  • Bu yazıyı okuyunca beklediğimden çok daha fazla heyecanlandım
    Katılımcı konsorsiyumda neden PWA odak alanı olmadığını merak ediyorum

    • Tarihsel olarak Interop daha çok CSS’e odaklanma eğilimindeydi, ama bu giderek değişiyor
      Yine de birçok test alanına worker testleri dahil edildiği için PWA durumu da iyileşiyor. 2023’te baştan sona bir Modules bölümü vardı ve PWA/worker odaklı birçok özellik test edildi. OffscreenCanvas veya mobil testler gibi test ve araştırma kapsamındaki API’lerin önemli bir kısmı da çeşitli PWA uygulamalarıyla yakından ilgili
      Bu yıl, geçen yıla kıyasla CSS merkezliliği en düşük Interop yılı. Benim gördüğüm kadarıyla PWA’ların başlıca dayandığı IndexedDB, WebSocket ve önemli bir erişilebilirlik iyileştirmeleri bölümü var. Araştırma alanı olan 3 başlık da — WebAssembly, erişilebilirlik ve mobil testler — PWA’larla yakından ilişkili
      Özellikle hangi API’lere daha fazla odaklanılmasını istediğinizi merak ediyorum
    • Diye hatırlıyorum, konsorsiyum yaklaşık 12 kişiden oluşuyor ve bu kişiler tarayıcı şirketlerinde de çalışıyor
      Amaç, bir araya gelip mevcut yol haritaları ve iş yüklerini dikkate alarak 1 yıl boyunca birlikte üzerinde çalışabilecekleri ya da iyileştirebilecekleri özellikleri bulmak. Interop’u, asıl işteki büyük özellik geliştirmelerinin arasında ele alınabilecek küçük bir ek bilet gibi düşünebilirsiniz
      Şimdiye kadarki odak, tarayıcıların içeriği nasıl render ettiğiyle ilgili çok düşük seviyeli ayrıntılar üzerindeydi. JavaScript API’leri ise çoğunlukla standardize edilip “yukarı akışta” birleştirildiği için, en büyük iyileştirme alanı burası
      Tüm motorlarda yeni özelliklerin eşzamanlı uygulanmasına yönelik bir akım ortaya çıkmadan önce, tarayıcılar arasındaki boşlukları kapatma yönünde daha fazla çalışma yapılmaya devam edilecek gibi görünüyor
      Yine de Apple sonunda mobil Safari’ye web push eklediğine göre, PWA özelliklerinin avantajlarından yararlanacak çoğu web uygulamasının ihtiyaç duyduğu noktaya epey yaklaşılmış durumda. Tarayıcılar arasında hâlâ ortak olmayan hangi özellikleri kullanmak istediğinizi merak ediyorum
    • PWA odak alanına nelerin dahil olduğunu düşündüğünüzü merak ediyorum
      Başka bir yerde https://web.dev/learn/pwa/capabilities ve https://whatpwacando.today bağlantıları verilmişti, ama bu özelliklerin önemli bir kısmının özünde PWA özelliği sayılmasının zor olduğunu düşünüyorum. Gerçekten çok sayıda özellik PWA dışında da yaygın biçimde kullanılıyor; bu yüzden bunları “PWA” paketi içine koymak anlamını bulanıklaştırıyor. Web geliştiricileri için “depolama” ya da “medya” gibi gruplamalar muhtemelen daha anlamlı
      PWA’nın temel tanımına bakarsanız, esas olarak manifest ve service worker ile bunların web platformuyla birlikte kullanılmasından söz ediyoruz
      manifest’in otomatik testi zor. İçeriği tarayıcı arayüzünün farklı bölümlerinde gösteriliyor, ama arayüz çoğunlukla web standartlarında tanımlanmıyor. Çünkü satıcılar kendi arayüz kararlarını verme özgürlüğünü istiyor. Bu yüzden dahil edilmesi zor ve ne kadar birlikte çalışabilirlik sorunu olduğu da belirsiz
      service worker önerilebilir. Son birkaç yılda önerilmedi, ama bu alanda da son dönemde çok fazla birlikte çalışabilirlik sorunu olduğunu düşünmüyorum
    • PWA, uygulama mağazası modelini baypas ediyor. Uygulamaları doğrudan tarayıcıdan yükleyebilirsiniz
      Bu yüzden bu sorunu uzatmak ve PWA deneyimini bilerek daha az çekici kılmak onların işine geliyor
      Firefox’un PWA desteğini neden kaldırdığını bilmiyorum ama muhtemelen bakım maliyeti yüzündendir
    • Çünkü PWA, “içerik gösterimi” gibi çok daha geniş bir kullanım amacına kıyasla niş bir kullanım senaryosu

  • Yazı tipleri
    CSS tipografisine daha fazla emek verilse iyi olur
    Özellikle leading-trim ve margin-trim gerekli
    https://medium.com/microsoft-design/leading-trim-the-future-...
    https://developer.mozilla.org/en-US/docs/Web/CSS/margin-trim

  • En büyük kazanım, Safari güncellemelerinin işletim sistemi güncellemelerine bağlı olmaktan çıkması

    • macOS’ta mümkün
      Ancak iOS’ta değil
      Ve iOS güncellemeleri 3-4 ayda bir yeni sürüm aldığı için, pratikte iOS’ta sorun olmuyor

  • Bunun, WebKit’in WebAssembly özelliklerini yakalamaya başladığının işareti olup olmadığını merak ediyorum
    Şu anda Chrome ve Firefox’a göre epey geride ve multiple memories ya da garbage collection gibi büyük ve önemli özellikler yok

    • İkisi de henüz Wasm spesifikasyonuna dahil değil, standartlaştırma sürecindeler
      Google daha çok “Hazır! Ateş! Nişan al! Bir daha ateş et!” çizgisinde; yani tamamlanmamış spesifikasyon uygulamalarını göndermeye daha yatkın. Apple ise daha çok “Hazır! Nişan al! Nişan al! Ateş et!” çizgisinde; yani genel olarak böyle şeyleri yapmaya isteksiz. Firefox içinse konuşmak zor

  • Cookie Store API’nin hâlâ resmî olarak uygulanmamış olmasına inanamıyorum
    Yıl 2024 olmuş, ama isme göre tek bir cookie almak için hâlâ devasa ve dağınık bir string’i parse etmek gerekiyor

    • Sebebi HTML 5 localStorage’ın ortaya çıkmış olması olabilir mi

  • WebSocket protokolü konusundaki sorunu pek anlayamıyorum
    Upgrade sonrasındaki bağlantı artık http(s) protokolü değilse, burada http ya da https kullanımına izin vermek kafa karıştırıcı değil mi? Üçlü operatör kullanmak ya da mevcut sayfanın yönlendirildiği değerden farklı bir değere sahip olmak gerçekten bu kadar korkunç mu? Tarayıcı normalizasyonu çalışmalarını görmek sevindirici, ama bu madde, değiştirmeye değer olsa bile önceliği oldukça düşük görünüyor