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

Kayce Basques

Tekrar hoş geldiniz! Chrome 64'te Geliştirici Araçları'na eklenecek yeni özellikler şunlardır:

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

Performans İzleyicisi

Bir sayfa yüklemesinin çeşitli yönlerinin gerçek zamanlı görünümünü almak için Performans İzleyicisi'ni veya aşağıdakiler dahil, çalışma zamanı performansı:

  • CPU kullanımı.
  • JavaScript yığın boyutu.
  • Sayfadaki DOM düğümlerinin, JavaScript etkinlik işleyicilerin, dokümanların ve çerçevelerin toplam sayısı.
  • Saniye başına düzenler ve stil için yeniden hesaplamalar.

Kullanıcılar uygulamanızın yavaş veya kötü hissettiğini bildiriyorsa uygulamalar için Performans İzleyicisi'ni ipuçları.

Yükleme performansı neden önemlidir?: BookMyShow, yeni bir Hıza odaklanan progresif web uygulamasıdır. Daha fazla bilgi edinin.

Performans Monitörü'nü kullanmak için:

  1. Komut Menüsü'nü açın.

  2. Performance yazmaya başlayın, ardından Show Performance Monitor öğesini seçin.

    Performans İzleyicisi Şekil 1. İlgili içeriği oluşturmak için kullanılan Performans İzleyicisi

  3. Göstermek veya gizlemek için bir metriği tıklayın. Şekil 1'de CPU Kullanımı, JS yığın boyutu ve JS etkinlik işleyiciler grafikleri gösterilir.

İlgili özellikler:

  • Performans paneli. Kritik bir kullanıcı yolculuğuna katılın ve sitenizde olan her şeyi kaydedin. JavaScript etkinliği, ağ istekleri, CPU kullanımı ve çok daha fazlasını içeren sayfada. Ayrıca şunlar da olabilir: yük performansını analiz etmek için kullanılır. Daha fazla bilgi edinin.
  • Denetimler paneli. Herhangi bir URL için bir dizi otomatik yükleme ve çalışma zamanı performans testi çalıştırın. Daha fazla bilgi edinin.

Performansı analiz etmeye yeni başlıyorsanız, önerilen yol ilk olarak Denetimler panelini kullanabilir, ardından Performans panelini veya Performans'ı kullanarak daha ayrıntılı inceleme yapabilirsiniz. anlamına gelir.

Konsol Kenar Çubuğu

Büyük sitelerde Console kısa sürede alakasız mesajlara boğabilir. Yeni Konsolu kullan Gürültüyü azaltmak ve sizin için önemli olan iletilere odaklanmak için kenar çubuğu.

Konsol Kenar Çubuğunu yalnızca hata mesajlarını göstermek için kullanma

2. Şekil. Konsol Kenar Çubuğunu yalnızca hata mesajlarını göstermek için kullanma

Konsol Kenar Çubuğu varsayılan olarak gizlidir. Konsol Kenar Çubuğunu Göster'i tıklayın. Konsol Kenar Çubuğunu Göster bir şablondur.

İlgili özellikler:

  • Filtrele metin kutusu. Bir metin girdiğinizde Konsol yalnızca bu metni içeren mesajları gösterir metin. Normal ifade kalıplarını, negatif filtreleri ve URL filtrelerini de destekler.

Benzer Console mesajlarını gruplandır

Console artık benzer iletileri varsayılan olarak birlikte gruplandırıyor. Örneğin, Şekil 3'te 27 vardır [Violation] Avoid using document.write() mesajının örnekleri.

Benzer iletileri bir arada gruplandırma konusunda Console örneği

3. Şekil. Benzer iletileri bir arada gruplandırma konusunda Console örneği

Bir grubu tıklayarak genişletin ve iletinin tüm örneklerini görün.

Genişletilmiş Console mesajları grubu örneği

4. Şekil. Genişletilmiş Console mesajları grubu örneği

Bu özelliği devre dışı bırakmak için Benzer Gruplama onay kutusunun işaretini kaldırın.

İlgili özellikler:

  • Kendi Console mesajlarınızı console.group() ile gruplandırabilirsiniz.

Yerel Geçersiz Kılmalar

Bir hata oluştu. Bu özelliği başlangıçta Chrome 64'te kullanıma sunmayı planlıyorduk ancak son teslim tarihini basitleştirmelisiniz. Anlaşılan Yenilikler kullanıcı arayüzü gerekir. Maalesef

Bu özellik, Chrome 65 sürümünde kullanıma sunulacak ve Chrome 64 sürümünden yaklaşık 6 hafta sonra kullanıma sunulacaktır. Kontrol Et Yerel Geçersiz Kılmalar hakkında daha fazla bilgi edinin. Windows veya Mac kullanıyorsanız Chrome 65'i hemen denemek için Chrome Canary indirin.

Önizleme kanallarını indirme

Varsayılan geliştirme tarayıcınız olarak Chrome Canary, Dev veya Beta'yı kullanabilirsiniz. Bu önizleme kanalları en yeni Geliştirici Araçları özelliklerine erişmenizi, son teknoloji ürünü web platformu API'lerini test etmenizi ve kullanıcılarınızdan önce sitenizdeki sorunları bulmanızı sağlar.

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

Yayındaki yeni özellikleri ve değişiklikleri ya da Geliştirici Araçları ile ilgili diğer her şeyi tartışmak için aşağıdaki seçenekleri kullanın.

  • Öneri veya geri bildirimlerinizi crbug.com adresinden bize iletebilirsiniz.
  • Geliştirici Araçları sorunlarını bildirmek için Diğer seçenekler'i Daha fazla > Yardım > Geliştirici Araçları'nda Geliştirici Araçları ile ilgili sorunları bildirin.
  • @ChromeDevTools adresinden tweet atabilirsiniz.
  • Geliştirici Araçları YouTube videoları veya Geliştirici Araçları ipuçları YouTube videolarına yorum yazın.

Geliştirici Araçları'ndaki yenilikler

Geliştirici Araçları'ndaki yenilikler serisinde ele alınan her şeyin listesi.