Geliştirici Araçları'ndaki yenilikler, Chrome 124

Sofia Emelianova
Sofia Emelianova

Yeni Otomatik Doldurma paneli

Bu sürüm, yeni Otomatik doldurma panelini Geliştirici Araçları'na getiriyor. Chrome Otomatik Doldurma, web sitelerindeki formları kayıtlı adreslerle otomatik olarak doldurmak için kullanışlı bir yol sunar. Yeni Otomatik Doldurma paneli, form alanlarınız, tahmini otomatik doldurma değerleri ve kayıtlı veriler arasındaki eşlemeyi incelemenize olanak tanır.

Bu demo sayfasındaki test verilerini içeren yeni paneli deneyin:

  1. Profil Otomatik Doldurma sayfasında, Formu doldur ... düğmelerinden birini, ardından Gönder'i ve ardından Adres kaydedilsin mi? iletişim penceresinde Kaydet'i tıklayıp formun bulunduğu sayfaya geri dönün.
  2. Geliştirici Araçları'nı açın ve bir otomatik doldurma etkinliğini tetikleyin: Bir form alanı ve açılır listeden adresi seçin.

Otomatik Doldurma paneli otomatik olarak açılır ve algılanan form alanlarını, tahmin edilen otomatik doldurma alanlarını ve kayıtlı değerleri gösterir.

Otomatik doldurma paneli.

Daha fazla bilgi edinmek için Formları Öğrenme ve Otomatik Doldurma makalelerine göz atın.

WebRTC için gelişmiş ağ kısıtlama

Paketle ilgili parametrelerin, özel ağ kısıtlama profillerine eklenmesiyle artık WebRTC uygulamalarınızı doğrudan Geliştirici Araçları'nda kısıtlayabilirsiniz. Bu, üçüncü taraf yazılımı kullanmaya gerek kalmadan gerçek zamanlı iletişim uygulamanızı test etmek açısından yararlıdır.

Yeni parametreler şunlardır: Paket Kaybı (yüzde), Paket Sırası Uzunluğu (paket sayısı) ve check_box Paket Yeniden Sıralama işareti.

Özel kısıtlama profillerine paketle ilgili yeni seçenekler eklenmeden önce ve sonra.

WebRTC bağlantısını kısıtlamak için ayarlar Ayarlar > altındaki özel bir profilde paketle ilgili parametreleri belirtin. Hızlandırma'yı seçin ve panelinde seçin.

Bu demo sayfasındaki yeni parametreleri deneyin. Öncelikle, sayfanın kamerayı kullanmasına izin verin. Ardından, panelinde yapılandırdığınız özel profili seçin ve tekrar sayfaya giderek Başlat ve Ara'yı tıklayın.

Chromium sorunu: 41175925.

Animasyonlar panelinde kaydırmaya dayalı animasyonlar desteği

Animasyonlar paneli artık kaydırmaya dayalı animasyonları incelemenize olanak tanıyor.

Bu özelliği bu demo sayfasında deneyebilirsiniz. Animasyonlar panelini açın ve kaydırmaya dayalı animasyonları yakalamak için sayfayı yeniden yükleyin.

Kaydırmaya dayalı animasyonlar, fare simgesiyle işaretlenmiş.

Genel Bakış'ta, fare fare simgesiyle işaretlenmiş bir animasyon grubu görünür. Artık bu bilgileri inceleyebilirsiniz. Grup, Zaman Çizelgesi'nde milisaniye yerine piksel değerleri gösterir.

Elements > altındaki CSS iç içe yerleştirme desteği iyileştirildi Stiller

Öğeler > Stiller sekmesi, CSS iç içe yerleştirme desteğini iyileştirir ve artık girinti ve küme parantezi içinde iç içe yerleştirilmiş stilleri gösteriyor. CSS iç içe yerleştirme, CSS kurallarını birlikte gruplandırmanın ve işleri daha az ayrıntılı ve daha yapılandırılmış hale getirmenin bir yoludur.

Girintinin eklenmesi ve iç içe yerleştirilmiş stillerin küme ayracı içine eklenmesinden önce ve sonra.

Chromium sorunu: 40166888.

Gelişmiş Performans paneli

Bu sürümde, Performans paneline çeşitli iyileştirmeler sunulmaktadır.

Fonksiyonları ve alt öğelerini flame grafiğinde gizle

Performans > flame grafiğindeki gürültüyü filtrelemek için Ana ayarda artık alakasız işlevleri ve alt öğelerini gizleyebilirsiniz. Flame grafiğinde, bir işlevi sağ tıklayın ve içerik menüsünden bir seçenek belirleyin.

İşlevleri ve alt öğelerini gizlemenize olanak tanıyan bir içerik menüsü eklemeden önce ve sonra.

Gizli alt öğeleri olan işlevlerin sağ tarafında bir arrow_drop_down Açılır menü düğmesi bulunur. Gizlenen alt öğelerin sayısını görmek için fareyle üzerine gelin ve bunları tekrar göstermek için tıklayın. Flame grafiğinin ilk durumuna dönmek için bir işlevi sağ tıklayıp İzi sıfırla'yı seçin.

Seçili başlatıcılardan başlattıkları etkinliklere uzanan oklar

Daha önce, Ana kanaldaki bir etkinliği seçtiğinizde ve kanal, başlatıcıdan seçili etkinliğe doğru bir ok gösteriyordu. Artık kanal, seçilen etkinlikten (varsa) başlattığına bir ok gösterir.

Gösterme yerine, seçilen etkinlikten başlatılan etkinliklere ve adlandırılmış bağlantılara doğru okların gösterildiği öncesi ve sonrası.

Ayrıca, tüm başlatıcıların Özet sekmesinde Şunun için Başlatıcı alanları vardır ve hem Şunun için başlatan: hem de Başlatan: alanları, Açıkla yerine adlandırılmış bağlantılara sahiptir.

Chromium sorunları: 325604258, 325024819, 326055289.

Lighthouse 11.6.0

Lighthouse paneli artık Lighthouse 11.6.0'ı çalıştırıyor. Değişikliklerin tam listesini inceleyin.

Kayda değer değişiklikler arasında, yeni etkinleştirme check_box_outline_blank JS örneklemeyi etkinleştir ayarı yer alır. Bu ayar varsayılan olarak devre dışıdır.

Kaydolmak için JS örnekleme ayarı eklemeden önce ve sonra.

JS örneklemenin etkinleştirilmesi, performans izlemeye ayrıntılı JavaScript çağrı yığınları ekler ancak rapor oluşturma işlemini yavaşlatabilir.

JS örneklemesi olmayan (solda) ve (sağ) JS örneklemesiyle performans izleme.

İzi, more_vert Araçlar menüsü > Lighthouse raporu oluşturulduktan sonra Kısıtlanmamış İzi Görüntüle.

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.

Bellek'teki özel kategoriler için ipuçları > Yığın anlık görüntüleri

Bellek panelindeki yığın anlık görüntülerinde, kuruculara dayalı olmayan özel nesne grupları bulunur. Fareyle bu tür nesnelerin üzerine geldiğinizde, Bellek panelinde artık kısa bir açıklama içeren bir ipucu ve dokümanlarda daha uzun bir açıklamanın bağlantısını görebilirsiniz.

Özel nesne grupları için açıklayıcı bir ipucunun gösterilmesinden önce ve sonra.

Chromium sorunu: 41490331.

Uygulama > Depolama alanı güncellemeleri

Bu sürüm, Uygulama'ya birkaç güncelleme getiriyor > Depolama.

Paylaşılan depolama alanı için kullanılan bayt

Uygulama > Depolama > Paylaşılan depolama alanı bölümünde artık bir kaynak tarafından kullanılan bayt sayısı gösterilmektedir.

Paylaşılan depolama alanı için kaç bayt kullanıldığının gösterilmeden önceki ve sonraki durumu.

Paylaşılan depolama alanı, gizliliği korumaya yönelik okuma erişimiyle sınırsız, siteler arası depolama alanına yazma erişimine sahip olmanızı sağlar.

Chromium sorunu: 324464353.

Web SQL desteği sonlandırıldı

Chrome, sürüm 119'da Web SQL'i kullanımdan kaldırdı ve bu sürümde desteği sonlandırma deneme jetonunu kaldırdı. Bu nedenle, artık Web SQL'i kullanamazsınız.

Ardından Geliştirici Araçları, Uygulama panelinden Web SQL bölümünü kaldırdı.

Chromium sorunu: 327254049.

Kapsam paneli iyileştirmeleri

Bu sürüm, Kapsam paneline birkaç güncelleme getiriyor:

  • Durum çubuğu, filtrelenen URL'lerin kullanım istatistiklerini artık doğru bir şekilde hesaplar. Önceden, filtreyle eşleşen alt öğelerin kullanım verileri yerine ebeveynlerinin verileri ekleniyordu.

Eşleşen alt öğe istatistiklerinin doğru şekilde hesaplanmasından önceki ve sonraki dönem.

  • Görünürlüğü artırmak için, kullanılan kodun rengi artık yeşil yerine gri renkte. yeşil olmayan renk körlüğü.

Kullanılan kodun öncesi ve sonrası rengi gri olarak değiştirilir.

Chromium sorunu: 41494198, 329253687.

Katmanlar panelinin desteği sonlandırılmış olabilir

Katmanlar paneli, kullanım oranının düşük olması nedeniyle yakında kullanımdan kaldırılabilir. Panelin üst kısmında artık bir uyarı banner'ı gösterilir.

Katmanlar panelinin en üst kısmında, özelliğin kullanımdan kaldırılma olasılığını bildiren uyarı banner'ı.

Ekip, panelin kullanımdan kaldırılmasına yönelik nihai kararı vermeden önce düşüncelerinizi ve endişelerinizi bizimle paylaşabilirsiniz.

JavaScript Profiler'ın kullanımdan kaldırılması: Dördüncü aşama, son

Bu sürümde, JS Profiler paneli tamamen kullanımdan kaldırıldı ve artık yeniden etkinleştirilemez.

CPU performansını ölçmek için Performans panelini kullanın.

Chromium sorunu: 40262073.

Çeşitli öne çıkan anlar

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

  • :
    • Çok satırlı çerezlerin yanlış ayrıştırılmasıyla ilgili hata düzeltildi (325410304).
    • Başlatıcı sütununda (327665602) sabit çağrı yığını önizlemesi.
  • Performans izleme: İzleme onay kutuları artık kullanıcı arayüzünün geri kalanıyla (1467464) aynıdır.
  • Kaynaklar: XHTML dokümanları için söz dizimi vurgulaması eklendi (327940244).
  • Ayarlar > Cihazlar: Eski Galaxy Fold'un yerini daha yeni Galaxy Z Fold 5 (40113439) alır.
  • Performans: Ctrl/Ctrl+Ctrl (1523279) ile arama yapılırken eşleşen tüm arama sonuçları vurgulanıyor.
  • Geliştirici kaynakları: Artık C/C++ Geliştirici Araçları Desteği (DWARF) Chrome uzantısı (40746829) gibi dil uzantıları üzerinden yüklenen kaynaklar da gösterilmektedir.
  • Performans: Kırpılmış çağrı yığını ve Özet sekmesindeki hatalı düzen düzeltildi (325314708).
  • Çekmece: kapat Kapat düğmelerine odaklanılabiliyor. Böylece paneller klavye kullanılarak kapatılabiliyor.

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