DevTools ile ilgili en güncel haberler
Bu yayındaki ilk haber biraz meta: Bu güncelleme kendisi! Arada sırada, en azından ayda bir kez, Chrome DevTools dünyasında olup bitenleri özetleyeceğim.
Yeni derken bunu gerçekten kastediyorum: Chrome Canary'a yeni eklenen özelliklerden bahsedeceğim. Kararlı sürümde kalmayı tercih ederseniz de sorun değil. Ancak maceracıysanız ve gelişmelerden haberdar olmak istiyorsanız bu gönderiler tam size göre. Her gönderinin sonunda, en son özellikler ve hata düzeltmelerinin yanı sıra Topluluk Nabzı bölümünü bulabilirsiniz. Bu bölümde, sevgili kullanıcılarımızın en iyi katkıları öne çıkarılır.
Sözü fazla uzatmadan asıl konuya geçelim.
DevTools'daki yenilikler
Ağ ve Zaman Çizelgesi'ndeki film şeridi benzeri ekran görüntüleri
Henüz bir hafta önce, önemli bir yeni özelliği deneme aşamasından çıkardık: Hem Ağ hem de Zaman Çizelgesi sekmesinde sayfanın ekran görüntüsünü alma özelliği.
Ağ panelinde, kare yakalamayı etkinleştirmek için küçük kamera simgesini tıklayın ve ardından yakalamayı tetiklemek için sayfayı yeniden yükleyin. WebPageTest gibi diğer araçlarla yakalanan ekran görüntüleri dışında, şu anda yalnızca bir boyadan gelen kareleri gösteriyoruz.
Çerçevelerden birini çift tıkladığınızda yakınlaştırılmış bir görünüm gösterilir (ardından gezinmek için sol/sağ okları kullanın). Fareyle çerçevelerin üzerine geldiğinizde ise panel ve zaman çizelgesinde çizgiler gösterilir. Bu çizgiler, çerçevenin tam olarak ne zaman yakalandığını görselleştirmenize olanak tanır ve yükleme sırasıyla ilişkilendirme yapmanıza yardımcı olur. Bu sayede, oluşturmayı engelleyen web yazı tipleri gibi yaygın yükleme sorunlarında hata ayıklama işlemi çok daha kolay hale gelir.
Zaman çizelgesi panelinde, üst araç çubuğundaki "Ekran görüntüleri" onay kutusunu işaretleyerek ekran görüntüsü yakalamayı etkinleştirebilirsiniz. Burada, Ağ paneline kıyasla işler biraz farklı işler: Bu durumda, söz konusu ekran görüntülerini Zaman Çizelgesi'ndeki diğer satırlarla ilişkili doğrusal bir zaman ölçeğine bırakabilmek için gerçek boyalardan bağımsız olarak mümkün olduğunca sık yakalamaya çalışırız. Önizlemeyi göstermek için çift tıklamanız gerekmez. Fareyle üzerine geldiğinizde yakınlaştırılmış kareler gösterilir.
Bu iki araç işlevsellik ve kullanıcı deneyimi açısından biraz uyumsuz olduğundan, özellikleri denemeniz ve crbug.com/new adresindeki kayıtlar aracılığıyla veya @ChromeDevTools adresine tweet göndererek geri bildirimde bulunmanızı öneririz.
Ağ panelinde Ağ Sınırlama
Cihaz Modu'nu kullanıma sunarken eklediğimiz ağ tarama özelliği, ağ optimizasyonlarına tek bir yerden odaklanabilmeniz için Ağ paneli araç çubuğunda ikinci evini buldu.
Bu yeni ana sayfa yalnızca bir kopyadır. Sitenizi duyarlı hale getirmeye çalışırken kötü bağlantıyı simüle etmek hâlâ çok önemli olduğundan, cihaz modu dışında da kullanılabilir.
Son olarak, uzun bir iş gününden sonra internet bağlantınızın neden kesildiğini merak edip ağ kısıtlamasını devre dışı bırakmayı unuttuğunuz için canınız mı sıkılıyor? Ağ sınırlama etkinleştirildiğinde Ağ paneli sekmesinde artık bir uyarı simgesi gösteriliyor.
Çeşitli bilgiler
- Ağ zaman çizelgesindeki tuhaf dairelerden nefret mi ediyordunuz? Biz de öyle. Bunlar, yeni film şeridinde bir karenin yakalandığı zaman noktalarıdır. Artık fareyle üzerine geldiğinizde çizgi olarak görünür.
- Cihaz Modu, cihazlar arasında geçiş yaptığınızda yönlendirmeyi korur
Topluluk Kalp Atışı
Chrome Geliştirici Araçları ile ayrıntılı inceleme
Bret Little, sizi temel DevTools işlevleriyle tanıştıran ve birçok ayrıntılı ipucu ve püf noktası sunan bu küçük ve güzel bir rehberlik kursu yayınladı. Bu dokümanda kesinlikle faydalı bilgiler var. Daha fazla DevTools dokümanı daima faydalıdır.
Bir Geliştirici Araçları IDE'si mi?
Web geliştiricisi ve DevTools meraklısı Kenneth Auchenberg, birkaç ay önce bağımsız bir DevTools uygulamasını kavram kanıtı olarak geliştirdi ve blog yayını bu hafta yine (hacker) haberlerinde yer aldı.
DevTools'u tam teşekküllü bir IDE'ye dönüştürmek, ekip üyelerimizden çoğunun daha önce hayalini kurduğu eğlenceli bir fikir olsa da devasa boyutlarda bir proje olur.
Ne düşünüyorsunuz? Geliştirici Araçları IDE'si bir hayal mi yoksa işe yarayabilir mi? Nasıl görünmesi gerekir? Yorumlarda bize bildirin.
Yakında görüşmek üzere!
Paul Bakaus ve Geliştirici Araçları Ekibi