Chrome 100'deki yenilikler

Pete LePage

Şunları bilmeniz gerekir:

Ben Pete LePage. Şimdi Chrome 100'deki geliştiriciler için yenilikleri görelim.

Chrome 100

Tarayıcılar sürüm 10'a ilk ulaştığında, ana sürüm numarası bir basamaktan ikiye yükselirken birkaç sorun yaşandı. Umarız iki basamaktan üçe geçişi kolaylaştıracak birkaç şey öğrenmişizdir.

Chrome ve Firefox logosu

Chrome 100 şu anda kullanıma sunulmuştur ve Firefox 100 çok yakında kullanıma sunulacaktır. Bu üç haneli sürüm numaraları, tarayıcı sürümünün bir şekilde tanımlanmasına bağlı olan sitelerde sorunlara neden olabilir. Son birkaç ay içinde, Firefox ekibi ve Chrome ekibi, her ne kadar tarayıcı 100'ü rapor etmese de, sürüm 100'ü bildiren denemeler yaptı.

Bu nedenle birkaç sorun bildirilmiş, ancak çoğu zaten düzeltilmiştir. Ama hâlâ yardımınıza ihtiyacımız var.

  • Web sitesi bakım uzmanıysanız web sitenizi Chrome ve Firefox 100 ile test edin.
  • Bir User-Agent ayrıştırma kitaplığı geliştirirseniz 100'den büyük ve 100'e eşit sürümleri ayrıştıracak testler ekleyin.

Daha ayrıntılı bilgi için web.dev'de yakında ana sürüm 100'e ulaşacak Chrome ve Firefox sayfasına göz atın.

Web'deki 100 İlginç An

100 Web'deki Harika Anlar tanıtım resmi

Web'in büyümesini izlemek ve son 100 Chrome sürümünde oluşturduğunuz muhteşem şeyleri görmek heyecan vericiydi. Eski günleri hatırlayıp son 14 yılda gerçekleşen #100CoolWebMoments etkinliği kutlamanın eğlenceli olacağını düşündük.

En sevdiğiniz anları bizimle paylaşın. Atladığımız bir şey varsa (ve sahip olduğumuzdan eminiz) @Chromiumdev hesabına, #100CoolWebMoments hashtag'iyle tweet atın. Keyfini çıkarın!

User-Agent dizesi kısaltıldı

Kullanıcı aracısından bahsetmişken, Chrome 100 varsayılan olarak indirilmemiş User-Agent dizesini destekleyen son sürüm olacaktır. Bu, User-Agent dizesi kullanımını yeni User-Agent Client İpuçları API'si ile değiştirme stratejisinin bir parçasıdır.

Chrome 101'den itibaren kullanıcı aracısı kademeli olarak azaltılacaktır.

Neyin ne zaman kaldırılacağı hakkında daha fazla bilgi edinmek için [Chromium blogunda][crblog] Kullanıcı Aracısı Kısaltma Kaynak Denemesi ve Tarihleri bölümüne göz atın.

Birden çok ekranlı pencere yerleşimi API'si

Bazı uygulamalarda, yeni pencereler açıp belirli yerlere veya belirli ekranlara yerleştirmek önemli bir özelliktir. Örneğin, sunum yapmak için Slaytlar'ı kullanırken, slaytların birincil ekranda tam ekran, diğer ekranda ise konuşmacı notlarımın görünmesini istiyorum.

Multi-Screen Window Placement API, kullanıcının makinesine bağlı ekranları numaralandırmayı ve belirli ekranlara pencereler yerleştirmeyi mümkün kılar.

window.screen.isExtended ile cihaza bağlı birden fazla ekran olup olmadığını hızlıca kontrol edebilirsiniz.

const isExtended = window.screen.isExtended;
// returns true/false

Ancak temel işlev, takılı ekranlarla ilgili ayrıntılı bilgi sağlayan window.getScreenDetails() ürünündedir.

const x = await window.getScreenDetails();
// returns
// {
//    currentScreen: {...}
//    oncurrentscreenchange: null
//    onscreenschange: null
//    screens: [{...}, {...}]
// }

Örneğin, birincil ekranı belirleyip ardından bir öğeyi bu ekranda tam ekran yapmak için requestFullscreen() kullanabilirsiniz.

try {
  const screens = await window.getScreenDetails();
  const primary = screens
         .filter((screen) => screen.primary)[0]
  await elem.requestFullscreen({ screen: primary });
} catch (err) {
  console.error(err);
}

Ayrıca, değişiklikleri (örneğin, yeni bir ekran takılıp çıkarıldığında veya çıkarıldığında, çözünürlük değiştiğinde vb.) dinlemek için bir yol sağlar.

const screens = await window.getScreenDetails();
let numScreens = screens.screens.length;
screens.addEventListener('screenschange', (event) => {
  if (screens.screens.length !== numScreens) {
    console.log('Screen count changed');
    numScreens = screens.screens.length;
  }
});

Daha ayrıntılı bilgi için Tom'un web.dev adresindeki Çoklu Ekran Penceresi Yerleşimi API'si ile birkaç ekranı yönetme başlıklı makaleye göz atın.

Diğer ölçütler

Elbette dahası var.

HID Cihazlar için, kullanıcı tarafından verilen bir HID cihazına verilen izni iptal etmenize olanak tanıyan yeni bir forget() yöntemi vardır.

// Request an HID device.
const [device] = await navigator.hid.requestDevice(opts);


// Then later, revoke permission to the device.
await device.forget();

WebNFC'de ise makeReadOnly() yöntemi, NFC etiketlerini kalıcı olarak salt okunur hale getirmenize olanak tanır.

const ndef = new NDEFReader();
await ndef.makeReadOnly();

Daha fazla bilgi

Burada, öne çıkan özelliklerin yalnızca bir kısmı ele alınıyor. Chrome 100'deki ek değişiklikler için aşağıdaki bağlantıları kontrol edin.

Abone ol

Gelişmelerden haberdar olmak için Chrome Geliştiricileri YouTube kanalına abone olun. Yeni bir video sunduğumuzda e-posta bildirimi alırsınız.

Ben Pete LePage. Chrome 101 yayınlanır yayınlanmaz size Chrome'daki yenilikleri anlatacağım!