Microsoft tilføjer fanen Sammensatte lag i værktøjet 3D-visning

Ikon for læsetid 3 min. Læs


Læsere hjælper med at understøtte MSpoweruser. Vi får muligvis en kommission, hvis du køber via vores links. Værktøjstip-ikon

Læs vores oplysningsside for at finde ud af, hvordan du kan hjælpe MSPoweruser med at opretholde redaktionen Læs mere

Fanen Sammensatte lag i værktøjet 3D-visning
Fanen Sammensatte lag i 3D-visningsværktøjet lader dig se de oprettede lag.

Microsoft overrasker webudviklere med en ny funktion indsat i den 3D-visningsværktøj, som er en del af Udviklingsværktøjerne (Dev Tools). Meddelt på tirsdag vil funktionen kaldet Composited Layers-fanen slutte sig til andre værktøjer i 3D View-værktøjer, der bruges til at løse sædvanlige webudviklingsproblemer, såsom unødvendige rullebjælker, z-indeksstablingsproblemer og DOM-kompleksitet.

Funktionen sammensatte lag er beregnet til at opdele websiden i det rigtige antal lag. Microsoft Edge Senior Product Manager Patrick Brosset siger, at det vil være nyttigt, når komponenterne er animerede eller ændres uafhængigt af resten. Det kan huskes, at Microsoft Edge DevTools tidligere havde et separat Layers-værktøj, der tilbyder den samme funktionalitet. Virksomheden besluttede dog at fjerne panelet for det, hvilket resulterede i, at det fusionerede med 3D View-værktøjet.

I et blogindlæg, der annoncerer ankomsten af ​​den nye funktion, beskriver Brosset også, hvor vigtige lagene er, og hvordan de dybest set sker på nettet ved at diskutere aktiviteten af ​​browsergengivelsesmotorer på et højt niveau. Ifølge ham følger en browsermotor en række trin for at gå fra HTML og CSS til pixels på en skærm. Disse procedurer omfatter parsing af HTML-koden og oprettelse af DOM-træet, parsing af CSS-kode og indhentning af stil- og layoutoplysninger, fremstilling af en ny træstruktur og maling af siden til skærmen.

"Under dette sidste trin kan motoren beslutte at male siden på én gang eller at opdele den i flere lag, male dem individuelt og derefter komponere det endelige billede ud fra dem," bemærker Brosset. "Der er specifikke CSS-egenskaber og HTML-elementer, der får motoren til at beslutte at oprette et separat lag. Brug af en 3D-transformationsegenskab eller vil-ændre-egenskaben får motoren til at oprette lag. På denne måde, når indholdet i disse lag ændres, skal motoren kun male disse individuelle lag igen og ikke hele viewporten."

Ved at klikke på fanen Sammensatte lag vises de oprettede lag for brugerne, hvori deres liste vises i sidebjælken til venstre. Værktøjet vil også fremhæve tingene i 3D-scenen, og ved at klikke på lagene vil brugerne få værdifuld information om dem, såsom størrelse.

"Som webudvikler kan det være meget nyttigt at vide, om en del af siden, som du har til hensigt at animere, faktisk er i sit eget lag," tilføjer han. "Hvis det er det, så kan du være sikker på, at mens animationen afspilles, behøver resten af ​​siden ikke også at blive malet igen. Men det er lige så vigtigt at kontrollere, at du heller ikke ved et uheld skaber for mange lag, da hver enkelt har brug for hukommelse."