- Chrome 62, teorik sonuçlar yerine gerçek performans metrikleri sağlayarak network information API'yi daha kullanışlı hale getirir.
- OpenType değişken yazı tipleri desteği kullanıma sunuldu.
- HTML medya öğelerinden medya akışlarını yakalayabilirsiniz.
- Chrome 62'de kullanıma sunulacak önemli bir değişiklikle ilgili özel bir hatırlatıcım var.
Daha birçok özellik de var.
Adım Pete LePage. Chrome 62'de geliştiriciler için neler yeniye göz atalım.
Değişikliklerin tam listesini görmek ister misiniz? Chromium kaynak deposu değişiklik listesine göz atın.
Ağ Kalitesi Göstergesi
Network Information API bir süredir Chrome'da kullanılıyor, ancak yalnızca kullanıcının bağlantısına göre teorik ağ hızları sağlıyor. Kablosuz ağa bağlı olduğunuzu ancak yalnızca 2G hızına sahip bir hücresel hotspot'a bağlı olduğunuzu düşünün. API, kablosuz bağlantıyı raporlar.
console.log(navigator.connection.type);
> wifi
Chrome 62'de API, istemciden gerçek ağ performansı metrikleri sağlayacak şekilde genişletildi. Bu ağ kalitesi sinyallerini kullanarak içeriği ağa uyarlayabilirsiniz. Örneğin, çok yavaş bağlantılarda, azaltılmış bir sürüm sunarak sayfa yükleme performansını artırabilirsiniz.
API, uygulama mantığınızı basitleştirmek için ölçülen ağ performansını hücresel bağlantıyla karşılaştırma açısından döndürür. Örneğin, çok hızlı bir fiber bağlantıya bağlandığında API, 4G değerini bildirir.
console.log(navigator.connection.effectiveType);
> 4G
Bu sinyaller, HTTP istek üstbilgileri olarak da kullanılabilir ve İstemci İpuçları aracılığıyla etkinleştirilebilir. Daha ayrıntılı bilgi için örneğe ve özelliğe göz atın.
OpenType Değişken Yazı Tipleri
Geleneksel olarak, bir yazı tipi yalnızca bir yazı tipi ailesinin tek bir örneğini (ör. tek bir ağırlık veya tek bir esneme) içeriyordu. Normal, kalın ve italik yazı tipi kullanmak istiyorsanız üç ayrı yazı tipi eklemeniz gerekir. Bu da sayfanızı ağırlaştırır.
OpenType değişken yazı tipi, tek bir yazı tipi dosyası içinde kompakt bir şekilde paketlenebilen birden fazla bağımsız yazı tipine eşdeğerdir. font-variation-settings CSS özelliğini ayarlayarak esneme, stil, kalınlık ve daha fazlasını kolayca ayarlayabilir, sonsuz sayıda stil varyasyonu elde edebilirsiniz. Bu üç yazı tipi artık tek bir kompakt dosyada birleştirilebilir.
.heading {
font-family: "Avenir Next Variable";
font-size: 48px;
font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
font-family: "Avenir Next Variable";
font-size: 24px;
font-variation-settings: 'wght' 400;
}
OpenType değişken yazı tipleri, duyarlı yazı tipleri oluşturmak ve sayfa ağırlığımızı azaltmak için bize güçlü bir yeni araç sunar. Daha fazla bilgi için John Hudson'un OpenType Değişken Yazı Tipleri ile Tanışın başlıklı makalesine göz atın.
DOM öğelerinden medya yakalama
DOM Elements API'den Medya Yakalama ile artık doğrudan HTMLMediaElements üzerinden ses ve video gibi bir MediaStream öğesine canlı çekim yapabilirsiniz.
Bir HTML medya öğesinde captureStream() çağrıldıktan sonra, akışlı içerik değiştirilebilir, işlenebilir, uzaktan gönderilebilir veya kaydedilebilir. Kendi eşitleyicinizi veya ses kodlayıcınızı oluşturmak için web sesini kullanmayı düşünün. Alternatif olarak, WebRTC'yi kullanarak içeriği uzak bir siteye aktarabilirsiniz. Olasılıklar neredeyse sonsuz.
Bazı HTTP sayfaları için Güvenli Değil etiketleri
Daha önce duyurduğumuz gibi, Chrome 62'den itibaren kullanıcı bir HTTP sayfasına veri girdiğinde Chrome, adres çubuğunda bir etiketle sayfayı "Güvenli Değil" olarak işaretleyecektir. Bu etiket, tüm HTTP sayfaları için Gizli modda da gösterilir.
Diğer özellikler
Bunlar, Geliştiriciler için Chrome 62'deki değişikliklerden yalnızca birkaçıdır. Elbette daha birçok değişiklik vardır.
- Payment Request API artık iOS için Chrome'da kullanılabilir.
- WebVR kaynak denemesi ile deneysel zengin VR deneyimleri oluşturmaya başlayabilirsiniz.
Ardından YouTube kanalımıza abone olun. Yeni bir video yayınladığımızda e-posta bildirimi alırsınız.
Ben Pete LePage. Chrome 63 yayınlanır yayınlanmaz size Chrome'daki yenilikleri anlatacağım.