Chrome 71'de aşağıdakiler için destek ekledik:
- Göreceli zamanların gösterilmesi artık
IntlAPI'nin bir parçasıdır. - Dikey olarak akan metinlerde alt çizginin metnin hangi tarafında görüneceğini belirtme
- Konuşma sentezi API'sini kullanmadan önce kullanıcı etkinleştirme gerektirir.
Daha birçok özellik de var.
Adım Pete LePage. Chrome 71'de geliştiriciler için neler yeni olduğuna göz atalım.
Değişiklik günlüğü
Bu makalede, öne çıkan özelliklerden yalnızca bazıları ele alınmıştır. Chrome 71'deki diğer değişiklikler için aşağıdaki bağlantılara göz atın.
- Chromium kaynak deposu değişiklik listesi
- ChromeStatus.com'un Chrome 71 ile ilgili güncellemeleri
- Chrome 71'de desteği sonlandırılan ve kaldırılan özellikler
Intl.RelativeTimeFormat() ile göreceli zamanları gösterme
Birçok web uygulaması, tarih ve saatin tamamını göstermek yerine bir şeyin ne zaman gerçekleştiğini veya gerçekleşeceğini belirtmek için "dün", "iki gün içinde" ya da "bir saat önce" gibi ifadeler kullanır.
Göreceli saatlerin gösterilmesi o kadar yaygın hale geldi ki, yaygın tarih/saat kitaplıklarının çoğu bu işlemi bizim için yapacak yerelleştirilmiş işlevler sağlıyor. Aslında, oluşturduğum neredeyse her web uygulamasına, Moment JS'yi bu amaç doğrultusunda eklediğim ilk kitaplıklardan biri.
Chrome 71, çalışmayı JavaScript motoruna aktaran ve göreli zamanların yerelleştirilmiş biçimlendirilmesini sağlayan Intl.RelativeTimeFormat() özelliğini kullanıma sunar. Bu, performansımızı biraz artırır ve bu kitaplıklara yalnızca bir tarayıcı yeni API'leri henüz desteklemediğinde polyfill olarak ihtiyacımız olduğu anlamına gelir.
const rtf = new Intl.RelativeTimeFormat('en');
rtf.format(3.14, 'second');
// → 'in 3.14 seconds'
rtf.format(-15, 'minute');
// → '15 minutes ago'
Kullanımı basittir. Yeni bir örnek oluşturun ve yerel ayarı belirtin. Ardından, format işlevini göreli zamanla çağırmanız yeterlidir. Ayrıntılar için Mathias'ın Intl.RelativeTimeFormat API makalesine göz atın.
Dikey metin için alt çizgi konumunu belirtme
Çince veya Japonca metin dikey akış şeklinde gösterildiğinde, tarayıcılar alt çizginin yerleştirildiği yerde tutarlı değildir. Alt çizgi solda veya sağda olabilir.
Chrome 71'de text-underline-position mülkü artık CSS3 metin süsleme spesifikasyonunun bir parçası olarak left veya right değerini kabul ediyor. CSS3 metin süsleme spesifikasyonu, kullanıcının kullanılacak satır türü, stil, renk ve konum gibi öğeleri belirtmesine olanak tanıyan çeşitli yeni özellikler ekler.
.left {
text-underline-position: left;
}
.right {
text-underline-position: right;
}
Konuşma sentezi için kullanıcı etkinleştirmesi gerekir
Bir siteye girdiğimizde aniden sitenin bizimle konuşmaya başlaması hepimizi şaşırtmıştır. Otomatik oynatma politikaları, sitelerin ses veya sesli video dosyalarını otomatik olarak oynatmasını engeller. Bazı siteler bunun yerine ses sentezi API'sini kullanarak bu sorunun üstesinden gelmeye çalıştı.
Chrome 71'den itibaren konuşma sentezi API'sinin çalışması için sayfadaki kullanıcının bir şekilde etkinleştirilmesi gerekir. Bu sayede, diğer otomatik oynatma politikalarıyla uyumlu hale getirilmiştir. Kullanıcı sayfayla etkileşime geçmeden önce kullanmaya çalışırsanız hata mesajı alırsınız.
const utterance = new window.SpeechSynthesisUtterance('Hello');
utterance.lang = lang || 'en-US';
try {
window.speechSynthesis.speak(utterance);
} catch (ex) {
console.log('speechSynthesis not available', ex);
}
Bir siteye gittiğinizde hem sizi hem de etrafınızdaki iş arkadaşlarınızı şaşırtmaktan daha kötü bir şey yoktur.
Diğer özellikler
Bunlar, Chrome 71'de geliştiriciler için yapılan değişikliklerden yalnızca birkaçıdır. Elbette daha birçok değişiklik vardır.
Element.requestFullscreen()yöntemi artık Android'de özelleştirilebilir ve kullanıcı hareketi gerçekleştirilene kadar hiçbir kullanıcı aracısı denetiminin gösterilmediği tamamen tam sayfa modu ile gezinme çubuğunun görünür hale getirilmesi arasında seçim yapmanıza olanak tanır.- Modül komut dosyası istekleri için varsayılan kimlik bilgileri modu,
omityerinesame-originolarak değiştirildi. - Chrome 71, Chrome'u Shadow DOM v1 spesifikasyonu ile uyumlu hale getirerek artık
:host()ve:host-context()sözde sınıflarının yanı sıra::slotted()bağımsız değişkenlerinin özgünlüğünü hesaplar.
Chrome DevSummit Videoları
Chrome Dev Summit'e katılamadıysanız veya katıldıysanız ancak tüm konuşmaları izleyemediyseniz YouTube kanalımızdaki Chrome Dev Summit 2018 oynatma listesine göz atın.
Eva ve Phil, Hizmet İşleyiciler ile Daha Hızlı ve Daha Dayanıklı Uygulamalar Geliştirme başlıklı makalede hizmet işçilerini kullanmayla ilgili bazı ilginç tekniklerden bahsetmiştir.
Mariko ve Jake, Karmaşık JS'ye yoğun web uygulamaları, yavaşlamayı önleme başlıklı oturumda Squoosh'u nasıl oluşturduklarından bahsetti.
Katie ve Houssein, Hızla İlgili Temel Bilgiler: Hızlı Web Siteleri İçin Temel Teknikler başlıklı makalede sitenizin performansını en üst düzeye çıkarmak için bazı harika tekniklerden bahsetti.
Jake pastayı düşürdü. Chrome DevSummit 2018 oynatma listesinde birçok harika video daha var.
Abone ol
Videolarımızdan haberdar olmak için Chrome Developers YouTube kanalımıza abone olun. Yeni bir video yayınladığımızda e-posta bildirimi alırsınız.
Adım Pete LePage. Chrome 72 yayınlanır yayınlanmaz Chrome'daki yenilikleri size bildirmek için burada olacağım.