Chrome 123 beta

Aksi belirtilmedikçe aşağıdaki değişiklikler Android, ChromeOS, Linux, macOS ve Windows için en yeni Chrome beta kanalı sürümünde geçerlidir. Burada listelenen özellikler hakkında daha fazla bilgiyi verilen bağlantılardan veya ChromeStatus.com'daki listeden edinebilirsiniz. Chrome 123, 21 Şubat 2024 itibarıyla beta sürümündedir. En son sürümü masaüstü için Google.com'dan veya Android için Google Play Store'dan indirebilirsiniz.

CSS

Bu sürümde beş yeni CSS özelliği eklendi.

CSS light-dark() renk işlevi

CSS'deki light-dark() işlevi, geliştiricilerin color-scheme özelliğini kullanıcının açık veya koyu mod tercihine daha kolay uyarlamasını sağlar.

Tek bir CSS mülkünde iki farklı renk değeri belirtmek için light-dark() kullanın. Tarayıcı (veya cihaz), öğenin hesaplanmış color-scheme değerine göre uygun rengi otomatik olarak seçer. Örneğin, aşağıdaki CSS ile:

  • Kullanıcı açık bir tema seçtiyse .target öğesinin arka planı limon sarısı olur.
  • Kullanıcı koyu tema seçtiyse .target öğesinin arka planı yeşil olur.
html {
  color-scheme: light dark;
}
.target {
    background-color: light-dark(lime, green);
}

CSS pencere içinde pencere görüntüleme modu

picture-in-picture değeri için CSS display-mode medya özelliğine destek ekler. Bu sayede web geliştiricileri, yalnızca web uygulaması (veya bir kısmı) pencere içinde pencere modunda gösterildiğinde uygulanan belirli CSS kuralları yazabilir.

Bu medya özelliği hakkında daha fazla bilgiyi pencere içinde pencere dokümanlarında bulabilirsiniz.

Bloklar için align-content CSS mülkü

align-content CSS mülkü artık blok kapsayıcılar ve tablo hücrelerinde destekleniyor. Daha önce bu özellik yalnızca ızgara ve esnek öğelerde destekleniyordu. Örneğin, display: block, display: list-item ve display: table-cell artık align-content kullanılarak hizalanabilir.

Blok ve tablo düzenlerinde align-content desteği başlıklı makaleden daha fazla bilgi edinebilirsiniz.

field-sizing CSS özelliği

Geliştiriciler, field-sizing mülkünü kullanarak form kontrollerinin sabit varsayılan boyutlarını devre dışı bırakabilir ve boyutlarını içeriklerine bağlı hale getirebilir. Bu sayede, otomatik olarak büyüyen metin alanları oluşturabilirsiniz.

CSS text-spacing-trim özelliği

Bu özellik, JLREQ (Japonca Metin Düzeni Şartları) ve CLREQ (Çince Metin Düzeni Şartları) tarafından tanımlanan görsel açıdan hoş bir yazı tipi oluşturmak için Çince, Japonca ve Korece (CJK) noktalama işareti karakterlerine kerning uygular.

Birçok CJK noktalama işareti karakteri, karakter içi boşluk içerir. Örneğin, CJK tam nokta ve CJK kapatma parantezi genellikle diğer ideografik karakterler gibi sabit bir ilerleme sağlamak için karakter boşluklarının sağ yarısında karakter içi boşluklara sahiptir. Ancak bunlar bir satırda göründüğünde, karakter içi boşluklar aşırı hale gelir. Bu özellik, aşırı boşlukları düzenler.

text-spacing-trim mülkü aşağıdaki dört değerden birini kabul eder: normal, trim-start, space-all ve space-first. CSS'de dört yeni uluslararası özellik kullanıma sunuluyor başlıklı makalede daha fazla bilgi edinebilirsiniz.

Web API'leri

Kaynaklar arası bir iframe'de WebAuthn kimlik bilgisi oluşturmaya izin ver

Bu özellik, web geliştiricilerine çapraz kaynaklı iFrame'lerde WebAuthn kimlik bilgileri (yani geçiş anahtarları olarak bilinen "publickey" kimlik bilgileri) oluşturma olanağı tanır. Bu yeni özellik için iki koşul gereklidir:

  • Iframe'de publickey-credentials-create-feature izin politikası var.
  • Iframe'de geçici kullanıcı etkinleştirme vardır.

Bu sayede geliştiriciler, Güvenen Taraf'ın birleşik kimlik deneyimi sağladığı bir kimlik yükseltme akışı sonrasında olduğu gibi yerleşik senaryolarda geçiş anahtarları oluşturabilir.

İlişkilendirme raporlama özelliği paketi

Chrome 123, Attribution Reporting API'ye aşağıdakilere odaklanan tetikleyici veri özelleştirme ve toplanabilir değer filtreleri ekler:

  • Tetikleyici veri kardinalitesi ve değerleri için özelleştirmeyi destekleyerek etkinlik düzeyinde raporlama için ek API yapılandırılabilirliği.
  • Toplanabilir değerlerde filtreleri destekleyerek özet raporlar için ek API yapılandırılabilirliği.

Uygulamalar ve web arasında ilişkilendirme ölçümü

Attribution Reporting API'yi, web'de gerçekleşen dönüşümlerin tarayıcı dışındaki diğer uygulamalarda gerçekleşen etkinliklerle ilişkilendirilmesine izin verecek şekilde genişletir.

Buradaki öneri, ilişkilendirme için OS düzeyinde destekten yararlanır. Özellikle, geliştiricilere mobil web'deki etkinliklerin Android'in Özel Korumalı Alan'ındaki etkinliklerle birleştirilmesine izin verme seçeneği sunar. Diğer platformlar için de destek uygulanabilir.

blocking=render satır içi modül komut dosyalarında

Bu, <script blocking="render">'te yapay bir sınırlamayı kaldıran küçük bir değişikliktir. Bu değişiklikten önce <script blocking="render"type="module">, src bir veri URI'si olsa bile src özelliğini gerektiriyordu. Diğer komut dosyalarını içe aktaran satır içi modül komut dosyaları yine de blok oluşturmaya devam edebildiğinden bu gereksiz bir kısıtlamadır.

Bunun nedeni, doküman içi görünüm geçişlerinin genellikle özelleştirme için oluşturma işlemini engelleyen komut dosyalarına dayanmasıdır. Bu nedenle, oluşturma işlemini engelleyen komut dosyalarının oluşturulmasını kolaylaştırmak bu özelliği destekleyecektir.

Belgede resim içinde resim: focus() API'nin açıcıya odaklanmasına izin verin

Artık doküman pencere içinde penceresinden opener.focus() simgesini kullanarak doküman pencere içinde penceresinin sahibi olan sekmeye sistem düzeyinde odaklanabilirsiniz.

Bu sayede geliştiriciler, gerektiğinde orijinal sekmeyi tekrar öne getirebilir. Örneğin, kullanıcının daha küçük resim içinde resim penceresine sığmayan bir kullanıcı arayüzü deneyimine erişmesi gerektiğinde.

Özellikleri içe aktarma with söz dizimi

İçe aktarma özellikleri, import xxx from "mod" with { type: "json" } gibi içe aktarma beyanlarına ek açıklama eklemenize olanak tanıyan bir JavaScript özelliğidir. Chrome, önerinin ilk sürümünü assert anahtar kelimesini kullanarak (Chrome 91'de) kullanıma sundu. Bu sürüm, JSON için HTML ve CSS modülleriyle entegrasyon sırasında yapılması gereken bazı değişiklikler nedeniyle with kullanacak şekilde güncellendi.

jitterBufferTarget

jitterBufferTarget özelliği, uygulamaların RTCRtpReceiver jitter arabelleğinin tutacağı medya için milisaniye cinsinden bir hedef süre belirtmesine olanak tanır. Bu, kullanıcı aracısı tarafından yapılan arabelleğe alma miktarını etkiler. Bu da yeniden yayınları ve paket kaybı kurtarmayı etkiler. Hedef değeri değiştirmek, uygulamaların oynatma gecikmesi ile ağdaki titreşim nedeniyle ses veya video karelerinin tükenme riski arasındaki dengeyi kontrol etmesine olanak tanır.

Uzun Animasyon Karesi Zamanlaması

Long Animation Frames API, Long Tasks API'nin bir uzantısıdır. Görevi, sonraki oluşturma güncellemesiyle birlikte ölçer. Uzun süre çalışan komut dosyaları, oluşturma süresi ve zorunlu düzen ve stilde harcanan süre gibi bilgileri ekler. Bu işleme düzen karmaşası denir.

Geliştiriciler, genellikle kötü INP'nin nedeni olan ana iş parçacığı tıkanıklığının nedenlerini bularak INP ile ölçülen "ağırlık" için teşhis aracı olarak bu metriği kullanabilir.

NavigationActivation arayüzü navigation.activation değerini ekler. Bu, geçerli dokümanın ne zaman etkinleştirildiğine (ör. ne zaman başlatıldığına veya geri/ileri önbellekten geri yüklendiğinde) dair durumu depolar.

Bu sayede geliştiriciler, kullanıcının hangi sayfadan geldiğine göre özelleştirilmiş sayfalar sunabilir. Örneğin, kullanıcılar ana sayfadan geldiyse farklı bir animasyon çalıştırın.

pagereveal etkinliği

pagereveal etkinliği, bir doküman ilk kez yüklendikten, geri-ileri önbellekten geri yüklendikten veya ön oluşturma işleminden etkinleştirildikten sonra ilk oluşturma fırsatında dokümanın pencere nesnesinde tetiklenir.

Sayfa girişi deneyimi (ör. önceki bir durumdan görüntüleme geçişi) oluşturmak için sayfa yazarı tarafından kullanılabilir.

Çoklu Kalemle Mürekkepleme için PointerEvent.deviceId

Gelişmiş kalem girişi özelliklerine sahip cihazlar giderek daha yaygın hale geldikçe, hem son kullanıcılara hem de geliştiricilere zengin deneyimler sunmak için web platformunun bu gelişmiş özellikleri tam olarak destekleyecek şekilde gelişmeye devam etmesi önemlidir. Bu tür gelişmelerden biri, bir cihazın dijitalleştiricisinin, kendisiyle aynı anda etkileşime geçen birden fazla kalem cihazı tanıyabilmesidir. Bu özellik, PointerEvent arayüzünün bir uzantısıdır ve geliştiricilerin sayfayla etkileşim kuran kalemleri tek tek tanımlamak için güvenilir bir şekilde kullanabileceği, oturum boyunca kalıcı, dokümandan izole edilmiş, benzersiz bir tanımlayıcıyı temsil eden yeni bir özellik (deviceId) içerir.

Gezinme istekleri için özel ağ erişimi denetimleri: yalnızca uyarı modu

A web sitesi, kullanıcının özel ağındaki başka bir B sitesine gitmeden önce bu özellik aşağıdakileri yapar:

  1. İsteğin güvenli bir bağlamda başlatılıp başlatılmadığını kontrol eder.
  2. Bir ön uç isteğinde bulunur ve B'nin özel ağ erişimine izin veren bir başlıkla yanıt verip vermediğini kontrol eder.

Alt kaynaklar ve çalışanlar için zaten özellikler mevcuttur ancak bu ekleme özellikle gezinme istekleri içindir.

Bu kontroller, kullanıcının özel ağını korumak için yapılır. Bu özellik "yalnızca uyarı" modunda olduğundan, denetimlerden herhangi biri başarısız olursa istekler reddedilmez. Bunun yerine, geliştiricilerin gelecekteki yaptırıma hazırlanmasına yardımcı olmak için DevTools'ta bir uyarı gösterilir.

Sec-CH-UA-Form-Factor istemci ipucu

Bu ipucu, sitenin yanıtını özelleştirebilmesi için kullanıcı aracısının veya cihazın "form faktörünü" gösterir.

Hizmet Çalışanı Statik Yönlendirme API'si

Bu API, geliştiricilerin yönlendirmeyi yapılandırmalarına ve hizmet işçilerinin yaptığı basit işlemleri devre dışı bırakmalarına olanak tanır. Koşul eşleşirse gezinme, hizmet işçileri başlatılmadan veya JavaScript çalıştırılmadan gerçekleşir. Bu sayede web sayfaları, hizmet işçisi müdahaleleri nedeniyle performans cezalarından kaçınabilir. Daha fazla bilgi için bu API ile ilgili önceki blog yayınını inceleyin.

Paylaşılan Depolama alanı güncellemesi

Bu güncelleme, iframe oluşturmak zorunda kalmadan çapraz kaynak iş parçacıkları çalıştırmayı destekler.

zstd Content-Encoding

Zstandard veya zstd, RFC8878'de açıklanan bir veri sıkıştırma mekanizmasıdır. Zlib düzeyinde gerçek zamanlı sıkıştırma senaryolarını ve daha iyi sıkıştırma oranlarını hedefleyen hızlı bir kayıpsız sıkıştırma algoritmasıdır. zstd jetonu, IANA'da kayıtlı bir Content-Encoding jetonu olarak eklendi.

Content-Encoding olarak zstd desteğinin eklenmesi, sayfaların daha hızlı yüklenmesine ve daha az bant genişliği kullanılmasına yardımcı olur. Ayrıca sunucularımızda sıkıştırma için daha az zaman, CPU ve güç harcayarak sunucu maliyetlerini düşürür.

Yeni kaynak denemeleri

Chrome 123'te aşağıdaki yeni kaynak denemelerini etkinleştirebilirsiniz.

WebAssembly JavaScript promise entegrasyonu

WebAssembly kullanılarak yazılmış duyarlı uygulamaları desteklemek için WebAssembly programlarının askıya alınmasına ve devam ettirilmesine olanak tanıyan özellikler sağlamak gerekir.

Promise entegrasyonunun birincil ilk kullanım alanı, kaynağı eşzamanlı API'lere dayanan WebAssembly programlarının, web platformunda giderek daha yaygın olan asenkron API'leri kullanmasına izin vermektir.

Promise entegrasyon kaynağı deneme sürümüne kaydolun.

Kaldırma işlemleri

Chrome 123, aşağıdaki özelliği kaldırır.

window-management izni ve izin politikası için window-placement takma adı

Chrome 111'de, window-placement izni ve izin politikası dizelerinin takma adı olarak window-management eklendi. Bu, window-placement desteğini sonlandırıp kaldırarak dizelerin adını değiştirmeye yönelik daha kapsamlı bir çalışmanın bir parçasıydı. Window Management API zaman içinde geliştikçe terminoloji değişikliği, tanımlayıcının kullanım süresini uzatır.

window-placement takma adıyla ilgili desteğin sonlandırılmasıyla ilgili uyarılar Chrome 113'te başladı ve bu takma ad artık kaldırılacak.