Bu sayfa, Cloud Translation API ile çevrilmiştir.

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

Kayce Basques

Tekrar hoş geldiniz! Chrome 63 sürümünde Geliştirici Araçları'na eklenecek yeni özellikler şunlardır:

Çok istemcili uzaktan hata ayıklama desteği.
Workspaces 2.0.
Dört yeni denetim.
Özel veriler kullanarak push bildirimlerini simüle edin.
Özel etiketlerle arka plan senkronizasyon etkinliklerini tetikleyin.

Not: Chrome'un hangi sürümünü kullandığınızı chrome://version adresinden kontrol edebilirsiniz. Chrome, yaklaşık 6 haftada bir yeni ana sürüme otomatik olarak güncellenir.

Daha fazla bilgi edinmek için aşağıdaki videoyu okuyun veya izleyin!

Çok istemcili uzaktan hata ayıklama desteği

VS Code veya WebStorm gibi bir IDE'den uygulama hatalarını ayıklamayı denediyseniz Geliştirici Araçları'nı açmanın hata ayıklama oturumunuzu karışıklığa yol açtığını muhtemelen fark etmişsinizdir. Bu sorun, WebDriver testlerinde hata ayıklamak için Geliştirici Araçları'nın kullanılmasını da imkansız hale getirmiştir.

Chrome 63 sürümünden itibaren Geliştirici Araçları, artık yapılandırma gerekmeden birden fazla uzaktan hata ayıklama istemcisini varsayılan olarak desteklemektedir.

Çok istemcili uzaktan hata ayıklama, crbug.com'un en popüler 1 numaralı Geliştirici Araçları sorunu ve Chromium projesinin tamamında üçüncüsüydü. Çok müşterili destek, diğer araçları Geliştirici Araçları ile entegre etmek veya bu araçları yeni şekillerde kullanmak için oldukça ilgi çekici fırsatlar sunar. Örneğin:

ChromeDriver veya VS Code ve WebMovie için Chrome hata ayıklama uzantıları gibi protokol istemcileri ve Puppeteer gibi WebSocket istemcileri artık Geliştirici Araçları ile aynı anda çalışabilir.
Puppeteer veya chrome-remote-interface gibi iki ayrı WebSocket protokol istemcisi artık aynı sekmeye aynı anda bağlanabiliyor.
chrome.debugger API kullanan Chrome uzantıları, artık Geliştirici Araçları ile aynı anda çalışabilir.
Artık aynı sekmede birden fazla farklı Chrome Uzantısı chrome.debugger API'yi aynı anda kullanabilir.

Çalışma Alanları 2.0

Geliştirici Araçları'nda çalışma alanları bir süredir kullanılıyor. Bu özellik, Geliştirme Araçları'nı IDE'niz olarak kullanmanızı sağlar. Geliştirici Araçları'nda kaynak kodunuzda bazı değişiklikler yaparsınız. Bu değişiklikler, dosya sisteminizdeki projenizin yerel sürümünde de değişmeye devam eder.

Workspaces 2.0, 1.0 temel alınarak geliştirilmiştir. Bu sayede daha yararlı bir kullanıcı deneyimi sunulur ve aktarılan kodun otomatik olarak iyileştirilmiş bir şekilde otomatik olarak eşlenmesi sağlanır. Bu özelliğin ilk olarak Chrome Geliştirici Zirvesi 2016'dan kısa bir süre sonra yayınlanması planlanmıştı, ancak ekip bazı sorunları çözmek için bu özelliği erteledi.

Workspaces 2.0'ın nasıl çalıştığını görmek için CDS 2016'nın Geliştirici Araçları konuşmasının "Yazma" bölümüne (14:28 civarında) göz atın.

Dört yeni denetim

Chrome 63'te Denetimler panelinde 4 yeni denetim vardır:

Resimleri WebP olarak sunun.
Uygun en boy oranlarına sahip resimler kullanın.
Bilinen güvenlik açıklarına sahip ön uç JavaScript kitaplıklarını kullanmaktan kaçının.
Tarayıcı hataları Console'a kaydedildi.

Sayfalarınızın kalitesini iyileştirmek üzere Denetimler panelini nasıl kullanacağınızı öğrenmek için Chrome Geliştirici Araçları'nda Lighthouse'u çalıştırma bölümüne bakın.

Denetimler panelini destekleyen proje hakkında daha fazla bilgi edinmek için Lighthouse sayfasına göz atın.

Push bildirimlerini özel verilerle simüle edin

Geliştirici Araçları'nda bir süredir push bildirimleri simüle ediliyor, ancak tek bir kısıtlama bulunuyor: Özel veriler gönderemiyordunuz. Ancak Chrome 63'teki Service Worker (Hizmet Çalışanı) bölmesine gelen yeni Push metin kutusu sayesinde artık bunu yapabilirsiniz. Hemen deneyin:

Basit Push Demosu'na gidin.
Push Bildirimlerini Etkinleştir'i tıklayın.
Chrome, bildirimlere izin vermenizi istediğinde İzin ver'i tıklayın.
Geliştirici Araçları'nı açın.
Service Workers (Hizmet Çalışanları) bölmesine gidin.
Push metin kutusuna bir şey yazın.

Şekil 1. Service Worker bölmesindeki Push metin kutusu aracılığıyla özel verilerle push bildirimlerini simüle etme
Bildirimi göndermek için Push'u tıklayın.

2. Şekil. Simüle edilen push bildirimi

Arka plan senkronizasyonu etkinliklerini özel etiketlerle tetikleme

Arka plan senkronizasyonu etkinliklerini tetikleme işlemi de bir süredir Hizmet Çalışanları bölmesinde bulunuyordu, ancak artık özel etiketler gönderebilirsiniz:

Geliştirici Araçları'nı açın.
Service Workers (Hizmet Çalışanları) bölmesine gidin.
Senkronizasyon metin kutusuna bir metin girin.
Senkronizasyon'u tıklayın.

Özel bir arka plan senkronizasyonu etkinliğini tetikleme

3. Şekil. Geliştirici Araçları, Senkronizasyon'u tıkladıktan sonra hizmet çalışanına, update-content özel etiketini içeren bir arka plan senkronizasyon etkinliği gönderir

Ö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ı'ndaki Diğer seçenekler > Yardım > Geliştirici Araçları ile ilgili sorun bildir bölümüne giderek Geliştirici Araçları sorunlarını bildirin.
@ChromeDevTools adresinden tweet atabilirsiniz.
Geliştirici Araçları YouTube videoları veya Geliştirici Araçları ipuçları YouTube videolarına yorum yazın.