Bu sayfa, Cloud Translation API ile çevrilmiştir.

Geliştirici Araçları'ndaki Yenilikler (Chrome 68)

Kayce Basques

Chrome 68'deki Geliştirici Araçları'ndaki yenilikler:

Eager Değerlendirmesi. Siz ifadeleri yazarken, Konsolda sonucu önizler.
Bağımsız değişken ipuçları. Siz işlevleri yazarken Console, söz konusu işlev için beklenen bağımsız değişkenleri gösterir.
İşlev otomatik tamamlama. document.querySelector('p') gibi bir işlev çağrısı yazdıktan sonra Console, döndürülen değerin desteklediği işlevleri ve özellikleri gösterir.
Console'da ES2017 anahtar kelimeleri. await gibi anahtar kelimeler artık Console'un otomatik tamamlama kullanıcı arayüzünde kullanılabiliyor.
Denetimler panelinde Lighthouse 3.0. Daha hızlı ve tutarlı denetimler, yeni bir kullanıcı arayüzü ve yeni denetimler.
BigInt Destek Ekibi. Konsolda JavaScript'in yeni keyfi kesinlikli tam sayısını deneyin.
İzleme bölmesine özellik yolları ekleme. Kapsam bölmesinden İzleme bölmesine özellikler ekleyin.
"Zaman damgalarını göster" Ayarlar'a taşındı.

Not: chrome://version adresinden hangi Chrome sürümünü kullandığınızı kontrol edin. Daha eski bir sürümü çalıştırıyorsanız bu özellikler mevcut olmayacaktır. Daha yeni bir sürümü çalıştırıyorsanız bu özellikler değişmiş olabilir. Chrome, yaklaşık 6 haftada bir yeni bir ana sürüme otomatik olarak güncellenir.

Aşağıdan sürüm notlarını okuyun veya video sürümünü izleyin.

Yardımcı Konsol

Chrome 68, Console'da otomatik tamamlama ve önizleme ile ilgili birkaç yeni özellik içerir.

Eager Değerlendirmesi

Konsola bir ifade yazdığınızda, Konsol artık imlecinizin altında bu ifadenin sonucunun önizlemesini gösterebilir.

Konsol, Sort() işleminin sonucunu açık bir şekilde yürütülmeden önce yazdırır.

Şekil 1. Konsol, sort() işleminin sonucunu açık bir şekilde yürütülmeden önce yazdırıyor

Eager Değerlendirmesini etkinleştirmek için:

Konsol'u açın.
Console Ayarları'nı açın.
Eager Assessment onay kutusunu etkinleştirin.

Geliştirici Araçları, ifadenin yan etkilere neden olup olmadığını öğrenmek için istekli değildir.

Bağımsız değişken ipuçları

İşlevler siz yazarken, Konsol artık işlevin beklediği bağımsız değişkenleri de göstermektedir.

Console'daki bağımsız değişken ipuçları.

2. Şekil. Console'daki çeşitli bağımsız değişken ipucu örnekleri

Notlar:

Bağımsız değişkenin önündeki soru işareti (ör. ?options), isteğe bağlı bağımsız değişkeni temsil eder.
Bir bağımsız değişkenden önceki üç nokta (ör. ...items) bir kapsamı temsil eder.
CSS.supports() gibi bazı işlevler birden çok bağımsız değişken imzasını kabul eder.

İşlev yürütüldükten sonra otomatik tamamlama

Eager Değerlendirmesi'ni etkinleştirdikten sonra, konsolda artık siz bir işlev yazdıktan sonra hangi özellik ve işlevlerin kullanılabilir olduğu da gösterilir.

document.querySelector('p') çalıştırıldıktan sonra Console artık söz konusu öğe için kullanılabilir özellikleri ve işlevleri gösterebilir.

3. Şekil. Üstteki ekran görüntüsü eski davranışı temsil ederken, alttaki ekran görüntüsü işlev otomatik tamamlamayı destekleyen yeni davranışı temsil etmektedir.

Otomatik tamamlamada ES2017 anahtar kelimeleri

await gibi ES2017 anahtar kelimeleri artık Console'un otomatik tamamlama kullanıcı arayüzünde kullanılabilir.

Konsol artık otomatik tamamlama kullanıcı arayüzünde "bekle" önerisinde bulunuyor.

4. Şekil. Console artık otomatik tamamlama kullanıcı arayüzünde await önerisinde bulunuyor.

Daha hızlı, daha güvenilir denetimler, yeni bir kullanıcı arayüzü ve yeni denetimler

Chrome 68'de Lighthouse 3.0 yüklüdür. Sonraki bölümlerde en büyük değişikliklerden bazıları özetlenmiştir. Hikayenin tamamı için Announcing Lighthouse 3.0'a bakın.

Daha hızlı ve güvenilir denetimler

Lighthouse 3.0, Lantern kod adlı yeni bir dahili denetim motoruna sahiptir. Bu motor, denetimlerinizi daha hızlı ve çalıştırmalar arasında daha az farkla tamamlar.

Yeni kullanıcı arayüzü

Lighthouse 3.0, Lighthouse ve Chrome kullanıcı deneyimi (Araştırma ve Tasarım) ekiplerinin ortak çalışması sayesinde yeni bir kullanıcı arayüzü de kullanıma sundu.

Lighthouse 3.0'daki yeni rapor kullanıcı arayüzü.

5. Şekil. Lighthouse 3.0'daki yeni rapor kullanıcı arayüzü

Yeni denetimler

Lighthouse 3.0 ayrıca 4 yeni denetimle sunulmaktadır:

İlk Zengin İçerikli Boyama
robots.txt dosyası geçerli değil
Animasyonlu içerik için video biçimlerini kullanın
Varış noktalarına birden fazla ve maliyetli gidiş gelişten kaçının

BigInt desteği

Chrome 68, BigInt adı verilen yeni bir temel sayısal değeri destekler. BigInt, tam sayıları rastgele bir hassasiyetle temsil etmenize olanak tanır. Console'da deneyin:

Konsoldaki BigInt örneği.

6. Şekil. Console'daki BigInt örneği

İzlenecek mülk yolu ekleyin

Bir ayrılma noktasında duraklatıldığında Kapsam bölmesinde bir özelliği sağ tıklayın ve bu özelliği İzleme bölmesine eklemek için İzlemeye özellik yolu ekle'yi seçin.

İzlenecek mülk yolu ekleme örneği.

7. Şekil. İzlenecek mülk yolu ekleme örneği

"Zaman damgalarını göster", ayarlara taşındı

Önceden Konsol Ayarları'nda bulunan Zaman damgalarını göster onay kutusu Ayarlar'a taşındı.

Önizleme kanallarını indirme

Varsayılan geliştirme tarayıcınız olarak Chrome Canary, Yeni geliştirilenler veya Beta'yı kullanmayı düşünün. Bu önizleme kanallarıyla Geliştirici Araçları'nın en yeni özelliklerine erişebilir, son teknoloji ürünü web platformu API'lerini test edebilir ve sitenizdeki sorunları kullanıcılarınızdan önce tespit edebilirsiniz!

Chrome Geliştirici Araçları ekibiyle iletişim kurma

Yayındaki yeni özellikler ve değişiklikler ya da Geliştirici Araçları ile ilgili diğer konular hakkında konuşmak için aşağıdaki seçenekleri kullanın.

crbug.com adresinden öneri veya geri bildirim gönderin.
Geliştirici Araçları'nda, Diğer seçenekler > Yardım > Geliştirici Araçları sorunu bildir'i kullanarak Geliştirici Araçları sorunlarını bildirin.
@ChromeDevTools adresine tweet gönderin.
Geliştirici Araçları'ndaki YouTube videoları veya Geliştirici Araçları İpuçları YouTube videolarındaki yenilikler hakkındaki görüşlerinizi bizimle paylaşın.