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

Sofia Emelianova
Sofia Emelianova
GitHub

Yeni Otomatik Doldurma paneli

Bu sürümde, yeni Otomatik Doldurma paneli Geliştirici Araçları'na eklendi. Chrome Otomatik Doldurma özelliği, kayıtlı adresleri bulunan web sitelerindeki formları otomatik olarak doldurmak için kullanışlı bir yöntem sunar. Yeni Otomatik Doldurma paneli, form alanlarınız arasındaki eşlemeyi, tahmini otomatik doldurma değerlerini ve kayıtlı verileri incelemenize olanak tanır.

Bu demo sayfasındaki yeni paneli test verileriyle deneyin:

  1. Profil Otomatik Doldurma bölümünde Formu doldur ... düğmelerinden herhangi birini tıklayın, 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ı, otomatik doldurma tahmin edilen alanlarını ve kayıtlı değerleri gösterir.

Otomatik doldurma paneli.

Daha fazla bilgi edinmek için Formları Öğrenme ve Otomatik Doldurma başlıklı makaleleri inceleyin.

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

Özel ağ kısıtlama profillerine paketle ilgili parametrelerin yeni eklenmesiyle artık doğrudan Geliştirici Araçları'ndan WebRTC uygulamalarınızı kısıtlayabilirsiniz. Bu, üçüncü taraf yazılımlarını 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 eklemeden önce ve sonra.

WebRTC bağlantısını daraltmak için ayarlar Ayarlar > Throttling'e gidip özel bir profilde paketle ilgili parametreleri belirtin ve Ağ panelinden seçin.

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

Chromium sorunu: 41175925.

Animasyonlar panelinde kaydırmayla çalışan animasyonlar desteği

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

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

Fare simgesiyle işaretlenmiş, kaydırmaya dayalı animasyonlar grubu.

Genel Bakış bölümünde fare fare simgesiyle işaretlenmiş bir animasyon grubu görünür. Artık denetleyebilirsiniz. Grup, Zaman Çizelgesi'nde milisaniye yerine piksel değerlerini gösterir.

Öğeler > Stiller'de geliştirilmiş CSS iç içe yerleştirme desteği

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

Girinti ekleme ve iç içe yerleştirilmiş stilleri köşeli parantez içine alma öncesi ve sonrası.

Chromium sorunu: 40166888.

Geliştirilmiş Performans paneli

Bu sürüm, Performans panelinde çeşitli iyileştirmeler getiriyor.

Flame grafiğinde işlevleri ve alt öğelerini gizleme

Performans > Ana bölümünde alev grafiğindeki gürültüyü filtrelemek için artık alakasız işlevleri ve bunların 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ü eklemenizin öncesi ve sonrası.

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

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

Önceden, Ana kanalda etkinlik seçtiğinizde, kanalda başlatıcıdan seçili etkinliğe bir ok gösteriliyordu. Bu aşamada kanal, seçilen etkinlikten (varsa) başlattığı etkine doğru bir ok gösterir.

Göster yerine, seçilen etkinlikten başlatılan etkinliklere ve adlandırılmış bağlantılara giden önceki ve sonraki oklar.

Ayrıca, tüm başlatıcıların Özet sekmesinde artık Başlatıcı için alanları; hem Başlatan hem de Başlatan alanlarında Göster yerine adlandırılmış bağlantılar bulunur.

Chromium sorunları: 325604258, 325024819, 326055289.

Lighthouse 11.6.0

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

Önemli değişiklikler arasında, yeni etkinleştirme check_box_outline_blank JS örneklemeyi etkinleştir ayarı bulunmaktadır. Bu ayar varsayılan olarak devre dışıdır.

Etkinleştirme 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şturmayı yavaşlatabilir.

(solda) ve (sağda) JS örneklemesi bulunmayan performans izi.

İze, Lighthouse raporu oluşturulduktan sonra more_vert Araçlar menüsü > Kısıtlanmamış İzlemeyi Görüntüle altından ulaşılabilir.

Geliştirici Araçları'ndaki Lighthouse panelini kullanmayla ilgili temel bilgileri öğrenmek için Lighthouse: Web sitesi hızını optimize etme başlıklı makaleyi inceleyin.

Chromium sorunu: 772558.

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

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

Özel nesne grupları için açıklayıcı bir ipucunun gösterildiği öncesi ve sonrası.

Chromium sorunu: 41490331.

Uygulama > Depolama alanı güncellemeleri

Bu sürümde, Uygulama > Depolama alanında da birkaç güncelleme yapılmıştır.

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

Uygulama > Depolama > Paylaşılan depolama 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ı gösteren önceki ve sonraki hali.

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

Chromium sorunu: 324464353.

Web SQL desteği tamamen sonlandırıldı

Sürüm 119'da Chrome, Web SQL'i kullanımdan kaldırdı ve bu sürümdeki kullanımdan kaldırma deneme jetonunu, artık Web SQL'i kullanamayacağınız için kaldırdı.

Bunun üzerine DevTools, Uygulama panelinden Web SQL bölümünü kaldırdı.

Chromium sorunu: 327254049.

Kapsam paneli iyileştirmeleri

Bu sürümle birlikte Kapsam panelinde birkaç güncelleme yapılmıştır:

  • Durum çubuğu, filtrelenmiş URL'lerin kullanım istatistiklerini artık doğru bir şekilde hesaplıyor. Önceden, filtreyle eşleşen alt öğelerin kullanım verilerini toplamak yerine üst öğelerinin verilerini ekliyordu.

Eşleşen alt öğelerin istatistiklerinin doğru bir şekilde hesaplanmasından önceki ve sonraki süreçler.

  • Kullanılan kodun rengi artık yeşil yerine gridir. Bu sayede, özellikle yeşil olmayan renk körlüğü olduğunda görünürlüğü artırılabilir.

Kullanılan kodun renginin gri olarak değiştirilmesinden önceki ve sonraki durum.

Chromium sorunu: 41494198, 329253687.

Katmanlar paneli kullanımdan kaldırılabilir

Katmanlar paneli, az kullanıldığı için yakında kullanımdan kaldırılabilir. Panelin üst kısmında artık bir uyarı banner'ı gösterilir.

Katmanlar panelinin üst kısmındaki olası kullanımdan kaldırma işlemlerini bildiren uyarı banner'ı.

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

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

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

CPU performansını belirlemek için Performans panelini kullanın.

Chromium sorunu: 40262073.

Öne çıkan çeşitli unsurlar

Bu sürümde yapılan bazı dikkate değer düzeltmeler ve iyileştirmeler şunlardır:

  • Ağ:
    • Çok satırlı çerezlerin yanlış ayrıştırılmasına neden olan bir hata düzeltildi (325410304).
    • Başlatan sütunundaki (327665602) sabit çağrı yığını önizlemesi.
  • Performans izleyici: İ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/Cmd+F (1523279) tuşlarıyla arama yapıldığında eşleşen tüm arama sonuçları artık 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österiliyor.
  • Performans: Özet sekmesindeki kırpılmış çağrı yığını ve bozuk düzeni düzeltildi (325314708).
  • Çekmece: close Kapat düğmelerine artık odaklanılabilir. Böylece paneller klavyeyle kapatılabilir.

Ö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   Diğer > 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.

Geliştirici Araçları'ndaki yenilikler

DevTools'daki yenilikler serisinde ele alınan her şeyin listesi.

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Chrome 101

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 iptal edildi.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59