Microsoft legger til kategorien Sammensatte lag i 3D View-verktøyet

Ikon for lesetid 3 min. lese


Lesere hjelper til med å støtte MSpoweruser. Vi kan få provisjon hvis du kjøper gjennom lenkene våre. Verktøytipsikon

Les vår avsløringsside for å finne ut hvordan du kan hjelpe MSPoweruser opprettholde redaksjonen Les mer

Fanen Sammensatte lag i 3D-visningsverktøyet
Fanen Sammensatte lag i 3D-visningsverktøyet lar deg se lagene som er opprettet.

Microsoft overrasker webutviklere med en ny funksjon injisert i den 3D-visningsverktøy, som er en del av utviklingsverktøyene (Dev Tools). Annonsert på tirsdag, vil funksjonen kalt Composited Layers-fanen slå seg sammen med andre verktøy for 3D View-verktøy som brukes for å løse vanlige nettutviklingsproblemer, som unødvendige rullefelt, z-indeksstablingsproblemer og DOM-kompleksitet.

Sammensatte lag-funksjonen er ment å fraksjonere nettsiden i riktig antall lag. Microsoft Edge Senior Product Manager Patrick Brosset sier at det vil være nyttig når komponentene er animert eller endres uavhengig av resten. Det kan huskes at Microsoft Edge DevTools tidligere hadde et eget Layers-verktøy som tilbyr samme funksjonalitet. Imidlertid bestemte selskapet seg for å fjerne panelet for det, noe som resulterte i at det ble slått sammen med 3D View-verktøyet.

I et blogginnlegg som kunngjør ankomsten av den nye funksjonen, beskriver Brosset også hvor viktige lagene er og hvordan de i utgangspunktet skjer på nettet ved å diskutere aktiviteten til nettlesergjengivelsesmotorer på et høyt nivå. Ifølge ham følger en nettlesermotor en rekke trinn for å gå videre fra HTML og CSS til piksler på en skjerm. Disse prosedyrene inkluderer å analysere HTML-koden og lage DOM-treet, analysere CSS-kode og skaffe stil- og layoutinformasjon, produsere en ny trestruktur og male siden til skjermen.

"I løpet av dette siste trinnet kan motoren bestemme seg for å male siden på én gang, eller å dele den opp i flere lag, male dem individuelt og deretter komponere det endelige bildet fra dem," bemerker Brosset. "Det er spesifikke CSS-egenskaper og HTML-elementer som gjør at motoren bestemmer seg for å lage et eget lag. For eksempel, bruk av en 3D-transformeringsegenskap eller vil-endre-egenskapen får motoren til å lage lag. På denne måten, når innholdet i disse lagene endres, trenger motoren bare å male disse individuelle lagene på nytt og ikke hele viewporten.»

Ved å klikke på kategorien Sammensatte lag vil brukerne vise lagene som er opprettet, hvor listen deres vises i sidefeltet på venstre side. Verktøyet vil også fremheve tingene i 3D-scenen, og å klikke på lagene vil gi brukere verdifull informasjon om dem, for eksempel størrelse.

"Som webutvikler kan det være veldig nyttig å vite om en del av siden du har tenkt å animere, faktisk er i sitt eget lag," legger han til. "Hvis det er det, kan du være sikker på at mens animasjonen spilles av, trenger ikke resten av siden å males på nytt også. Men det er like viktig å sjekke at du ikke ved et uhell lager for mange lag heller, da hvert lag trenger minne.»