Geliştirici Araçları'ndaki yenilikler (Chrome 121)

Sofia Emelianova
Sofia Emelianova
GitHub

Ağ panelindeki iyileştirilmiş filtre çubuğu

Filtre çubuğu, istekleri daha kolay filtrelemenizi ve Ağ panelini sadeleştirmenizi sağlamak için yeniden tasarlandı.

İlgili deneme, bu sürümde varsayılan olarak etkinleştirildi, ancak geri alınacak. İlerleme durumunu crbug.com/1523150 adresinden takip edebilirsiniz.

Yeni filtre çubuğunda iki açılır menü vardır: biri istek türlerini seçmek, diğeri veri ve uzantı URL'lerini gizlemek veya yalnızca engellenen çerezleri ve istekleri ve üçüncü taraf isteklerini göstermek içindir. Her iki menü de çoklu seçimi destekler.

Eski filtre çubuğunu hemen geri getirmek için ayarlar Ayarlar > Denemeler > check_box_outline_blank Filtre çubuğunun Ağ panelindeki yeniden tasarımı.

Ağ panelindeki filtre çubuğunun sadeleştirilmesinden önce ve sonra.

crbug.com/1500573 adresinden özellik hakkındaki geri bildiriminizi iletebilirsiniz.

Chromium sorunu: 1486431.

Öğe iyileştirmeleri

@font-palette-values desteği

Öğeler paneli artık @font-palette-values CSS kuralını desteklemektedir. font-palette özelliğinin varsayılan değerlerini özelleştirebilmenizi sağlar.

Stiller'de font-palette özelliğinin değerini tıklayın. Geliştirici Araçları sizi özel değerlerinizi düzenleyebileceğiniz özel @font-palette-values bölümüne yönlendirir.

Stiller'deki @font-palette-values bölümü.

Chromium sorunu: 1501781.

Desteklenen durum: Başka bir özel özelliğin yedeği olarak özel mülk

Öğeler > Stiller artık başka bir özel özelliğin yedeği olan özel özelliği çözümliyor.

Özel bir özelliğin başka bir özel özelliğin yedeği olarak çözümlenmesinden önce ve sonra.

Chromium sorunu: 1499265.

İyileştirilmiş kaynak eşleme desteği

Ayarlarda Ayarlar > Denemeler > check_box Kaynak eşlemelerini kullanarak ifadelerdeki değişken adlarını çözümleme varsayılan olarak etkinleştirilmiştir.

Geliştirici Araçları, kaynak eşlemelerini kullanarak orijinal kodunuzu birleştirdikten, küçültdükten veya derledikten sonra bile Kaynaklar ve Kapsam'daki orijinal kodunuzda hata ayıklamanızı sağlar. Bu deneme, aşağıdakiler dahil ancak bunlarla sınırlı olmamak üzere Geliştirici Araçları'nda orijinal değişken adlarınızı tutarlı bir şekilde değerlendirmenize olanak tanır:

Daha fazla bilgi için ilgili RFC'ye bakın.

Chromium sorunu: 1444349.

Performans paneli iyileştirmeleri

Gelişmiş Etkileşimler kanalı

Performans > Etkileşimler kanalında, işlem süresi sınırlarında giriş ve sunum gecikmelerini belirten bıyıklar bulunur.

Etkileşimler kanalına bıyık eklenmeden önce ve sonra.

Ayrıca, fare imlecini bir etkileşimin üzerine getirdiğinizde zamanlamalarla ilgili faydalı bir ipucu görebilirsiniz.

Chromium sorunu: 1495751.

Alttan Yukarı, Arama Ağacı ve Etkinlik Günlüğü sekmelerinde gelişmiş filtreleme

Performans panelindeki Aşağıdan Yukarı, Arama Ağacı ve Olay Günlüğü sekmelerine gelişmiş filtreleme için üç yeni düğme eklendi:

  • match_case Büyük/küçük harf eşleştir.
  • regular_expression Normal ifade.
  • match_word Tüm kelimeyi eşleştir.

Gelişmiş filtreleme için kullanabileceğiniz üç yeni düğme.

Ayrıca, bağlamı korumanıza yardımcı olmak için artık Aşağıdan Yukarı sekmesindeki filtreyle yalnızca üst düzey öğeler eşleşiyor. Daha önce bu filtre her düğümle eşleşiyordu.

Chromium sorunu: 1496355.

Kaynaklar panelindeki girinti işaretçileri

Kaynaklar panelindeki Düzenleyici, kolaylık sağlamak için artık girintili kod bloklarını dikey satırlarla işaretliyor.

Girintilendirilmiş kod bloklarını dikey çizgilerle işaretlemeden önce ve sonra.

Chromium sorunu: 1479986.

Ağ panelinde geçersiz kılınan başlıklar ve içerikler için faydalı ipuçları

Ağ paneli, artık bir isteğin Başlıklar ve Yanıt sekmelerinin yanındaki mor nokta simgesinin üzerine geldiğinizde ipuçlarını gösteriyor. İpuçları, Geliştirici Araçları tarafından hangi öğeleri geçersiz kıldığını gösterir.

Başlıklar ve Yanıt sekmelerinde mor nokta simgesinin yanında bulunan yeni ipuçları.

Chromium sorunu: 1469776.

İstek engelleme kalıpları eklemek ve kaldırmak için yeni Komut Menüsü seçenekleri

Artık Komut Menüsü'ne ağ isteği engelleme kalıpları eklemek veya kaldırmak için komutlar yazabilirsiniz.

Ağ engelleme kalıpları eklemek veya kaldırmak için yeni komutlar eklemeden önce ve sonra.

Ekle komutu sizi kalıbı belirtmeniz için iletişim kutusuna götürür ve Kaldır komutu Ağ isteği engelleme panelini açmadan tüm kalıpları kaldırır.

İGP ihlalleri denemesi kaldırıldı

Sürüm 89'da sunulan deneysel İGP ihlalleri sekmesi gereksiz olduğu için kaldırıldı.

İGP ayrıntılarını bir bakışta görmek için Uygulama > Çerçeveler > İçerik Güvenliği Politikası (İGP).

Uygulama panelindeki İçerik Güvenliği Politikası.

Ayrıca Sorunlar panelinde İGP ihlalleri bildirilir.

Uygulama panelindeki İçerik Güvenliği Politikası.

Lighthouse 11.3.0

Lighthouse paneli artık Lighthouse 11.3.0'ı çalıştırıyor. Değişikliklerin tam listesini inceleyin. Kayda değer değişiklikler arasında, 404 sayfalarında rapor çalıştırabilme olanağı da yer almaktadır.

Geliştirici Araçları'nda Lighthouse panelini kullanmayla ilgili temel bilgileri öğrenmek için Lighthouse: Web sitesi hızını optimize etme konusuna bakın.

Chromium sorunu: 772558.

Erişilebilirlik

Bu sürüm aşağıdaki erişilebilirlik iyileştirmelerine sahiptir:

  • Ağ > Yük. Artık sekmeye odaklanarak kaynağı görüntüle ve URL kodlamalı görüntüleyebilirsiniz düğmelerine erişebilir ve ilgili işlemi tetiklemek için Enter veya Boşluk tuşuna basabilirsiniz.
  • Konsol'da, kafa karışıklığını azaltmak amacıyla, Hata Ayıklayıcı'da artık kullanılamayan komut dosyalarına yönlendiren bağlantılar artık devre dışı bırakılır ve tıklanamaz.
  • Gezinme ağaçlarında, örneğin Kaynaklar > Page (Sayfada) için Enter tuşu artık alt öğeleri olan düğümleri genişletip daraltır.

Chromium sorunları: 1338391, 1500662, 1420362.

Çeşitli öne çıkan anlar

Bu sürümdeki önemli düzeltmeler ve iyileştirmelerden bazıları şunlardır:

  • Performans. Kayıt başarısız olursa artık Ham izleme etkinliklerini indirebilir ve sorunun ne olduğunu anlamaya çalışabilirsiniz (kaydet).
  • Konsolu Göster kısayolu (Mac için Ctrl+`, Windows ve Linux için Ctrl++) artık yalnızca Konsol'u açmakla kalmıyor, aynı zamanda ikinci kez basıldığında da kapanıyor.
  • Geliştirici Kaynakları. CSS kaynaklarının ve bunların sorunlarının bildirilmesini engelleyen bir hata düzeltildi (1420362).
  • Öğeler:
    • iFrame'lerdeki öğelerin incelenmesiyle ilgili bir hata düzeltildi (1453375).
    • Hesaplandı. Varsayılan değerlerin oluşturulmasını engelleyen bir hata düzeltildi (1499882).
    • Arama. Bir veya iki karakterlik kısa sorgular için eşleşme sayısının hesaplanmasını engelleyen bir hata düzeltildi (1416457).
  • Konsol. Artık Filtre kutusunda (1346936) çıkış karakterli bir karakterle biten normal ifadeleri doğru şekilde ayrıştırıyor.
  • Ayarlar > Çalışma alanı. Hariç tutulan bir klasörün eklenmesini engelleyen hata düzeltildi (1503580).
  • Ağ > Önizleme. Artık resimler data: URI'leri (1381791) ile oluşturuluyor.
  • Bellek. İşlem çubuğuna (1275407) uygun yükleme yükleme ve indirme kaydetme düğmeleri eklendi.

Ö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.