Microsoft, 3B Görünüm aracına Bileşik Katmanlar sekmesini ekler

Microsoft, web geliştiricilerine yeni bir özellik enjekte ederek şaşırtıyor 3B Görünüm aracıGeliştirme Araçları'nın (Dev Tools) bir parçası olan . Salı günü duyurulan Bileşik Katmanlar sekmesi, gereksiz kaydırma çubukları, z-endeksi yığınlama sorunları ve DOM karmaşıklığı gibi olağan web geliştirme sorunlarını çözmek için kullanılan diğer 3D Görünüm araçları araçlarına katılacak.

Birleştirilmiş Katmanlar özelliği, web sayfasını doğru sayıda katmana bölmek içindir. Microsoft Kenar Kıdemli Ürün Müdürü patrick brosset bileşenler diğerlerinden bağımsız olarak canlandırıldığında veya değiştirildiğinde faydalı olacağını söylüyor. Microsoft Edge DevTools'un daha önce aynı işlevi sunan ayrı bir Katmanlar aracına sahip olduğu hatırlanabilir. Ancak şirket, bunun için paneli kaldırmaya karar verdi ve bunun sonucunda 3D Görünüm aracıyla birleşti.

Brosset, yeni özelliğin gelişini açıklayan bir blog yazısında, tarayıcı oluşturma motorlarının etkinliğini üst düzeyde tartışarak katmanların ne kadar önemli olduğunu ve temelde web'de nasıl gerçekleştiğini de ayrıntılarıyla anlatıyor. Ona göre bir tarayıcı motoru, HTML ve CSS'den ekrandaki piksellere geçmek için bir dizi adım izler. Bu prosedürler, HTML kodunun ayrıştırılmasını ve DOM ağacının oluşturulmasını, CSS kodunun ayrıştırılmasını ve stil ve düzen bilgilerinin elde edilmesini, yeni bir ağaç yapısının üretilmesini ve sayfayı ekrana boyamasını içerir.

Brosset, "Bu son adım sırasında motor, sayfayı tek seferde boyamaya veya birden çok katmana bölmeye, ayrı ayrı boyamaya ve ardından bunlardan son görüntüyü oluşturmaya karar verebilir" diye belirtiyor. “Motorun ayrı bir katman oluşturmaya karar vermesini sağlayan belirli CSS özellikleri ve HTML öğeleri var. Örneğin, bir 3B dönüştürme özelliği veya will-change özelliği kullanmak, motorun katmanlar oluşturmasını sağlar. Bu şekilde, bu katmanlardaki içerik değiştiğinde, motorun tüm görünümü değil, yalnızca bu katmanları yeniden boyaması gerekir.”

Birleştirilmiş Katmanlar sekmesine tıklamak, kullanıcılara oluşturulan katmanları gösterir, burada listeleri sol taraftaki kenar çubuğunda görüntülenir. Araç ayrıca 3B sahnedeki şeyleri vurgulayacak ve katmanlara tıklamak, kullanıcılara boyut gibi onlar hakkında değerli bilgiler verecektir.

"Bir web geliştiricisi olarak, sayfanın canlandırmak istediğiniz bir bölümünün gerçekten de kendi katmanında olup olmadığını bilmek çok yararlı olabilir" diye ekliyor. “Öyleyse, animasyon oynatılırken sayfanın geri kalanının da yeniden boyanmasına gerek olmayacağından emin olabilirsiniz. Ancak her birinin belleğe ihtiyacı olduğundan, yanlışlıkla çok fazla katman oluşturmadığınızı kontrol etmek de aynı derecede önemlidir.”