Η Microsoft προσθέτει την καρτέλα Composited Layers στο εργαλείο 3D View

Η Microsoft εκπλήσσει τους προγραμματιστές Ιστού με μια νέα δυνατότητα που έχει ενσωματωθεί σε αυτήν Εργαλείο προβολής 3D, το οποίο αποτελεί μέρος των Εργαλείων Ανάπτυξης (Dev Tools). Ανακοινώθηκε την Τρίτη, η δυνατότητα που ονομάζεται καρτέλα Composited Layers θα ενώσει άλλα εργαλεία των εργαλείων 3D View που χρησιμοποιούνται για την αντιμετώπιση συνηθισμένων προβλημάτων ανάπτυξης ιστού, όπως περιττές γραμμές κύλισης, ζητήματα στοίβαξης z-index και πολυπλοκότητα DOM.

Η δυνατότητα Composited Layers προορίζεται για την κλασματοποίηση της ιστοσελίδας στον σωστό αριθμό επιπέδων. Η Microsoft Edge Senior Product Manager της Πάτρικ Μπρόσετ λέει ότι θα είναι χρήσιμο όταν τα στοιχεία κινούνται ή αλλάζουν ανεξάρτητα από τα υπόλοιπα. Υπενθυμίζεται ότι το Microsoft Edge DevTools είχε προηγουμένως ένα ξεχωριστό εργαλείο Layers που προσέφερε την ίδια λειτουργικότητα. Ωστόσο, η εταιρεία αποφάσισε να αφαιρέσει το πάνελ για αυτό, με αποτέλεσμα τη συγχώνευσή του με το εργαλείο 3D View.

Σε μια ανάρτηση ιστολογίου που ανακοινώνει την άφιξη της νέας δυνατότητας, η Brosset αναφέρει επίσης πόσο σημαντικά είναι τα επίπεδα και πώς βασικά συμβαίνουν στον Ιστό, συζητώντας τη δραστηριότητα των μηχανών απόδοσης του προγράμματος περιήγησης σε υψηλό επίπεδο. Σύμφωνα με τον ίδιο, μια μηχανή προγράμματος περιήγησης ακολουθεί μια σειρά βημάτων για να προχωρήσει από HTML και CSS σε pixel σε μια οθόνη. Αυτές οι διαδικασίες περιλαμβάνουν την ανάλυση του κώδικα HTML και τη δημιουργία του δέντρου DOM, την ανάλυση κώδικα CSS και την απόκτηση πληροφοριών στυλ και διάταξης, την παραγωγή μιας νέας δομής δέντρου και τη ζωγραφική της σελίδας στην οθόνη.

«Κατά τη διάρκεια αυτού του τελευταίου βήματος, ο κινητήρας μπορεί να αποφασίσει να ζωγραφίσει τη σελίδα με μία κίνηση ή να τη χωρίσει σε πολλαπλά στρώματα, να τα ζωγραφίσει μεμονωμένα και στη συνέχεια να συνθέσει την τελική εικόνα από αυτά», σημειώνει ο Brosset. «Υπάρχουν συγκεκριμένες ιδιότητες CSS και στοιχεία HTML που κάνουν τον κινητήρα να αποφασίσει να δημιουργήσει ένα ξεχωριστό επίπεδο. Για παράδειγμα, η χρήση μιας ιδιότητας τρισδιάστατου μετασχηματισμού ή της ιδιότητας will-change κάνει τον κινητήρα να δημιουργεί επίπεδα. Με αυτόν τον τρόπο, όταν το περιεχόμενο σε αυτά τα επίπεδα αλλάζει, ο κινητήρας πρέπει μόνο να ξαναβάψει αυτά τα μεμονωμένα επίπεδα και όχι ολόκληρο το παράθυρο προβολής.»

Κάνοντας κλικ στην καρτέλα Σύνθετα επίπεδα θα εμφανιστούν στους χρήστες τα επίπεδα που δημιουργήθηκαν, όπου η λίστα τους εμφανίζεται στην πλαϊνή γραμμή στην αριστερή πλευρά. Το εργαλείο θα επισημάνει επίσης τα πράγματα στην τρισδιάστατη σκηνή και κάνοντας κλικ στα επίπεδα θα δώσει στους χρήστες πολύτιμες πληροφορίες για αυτά, όπως το μέγεθος.

«Ως προγραμματιστής ιστού, μπορεί να είναι πολύ χρήσιμο να γνωρίζουμε εάν ένα μέρος της σελίδας που σκοπεύετε να κάνετε κίνηση βρίσκεται, όντως, στο δικό του επίπεδο», προσθέτει. «Αν ναι, τότε μπορείτε να είστε σίγουροι ότι ενώ αναπαράγεται το κινούμενο σχέδιο, δεν θα χρειαστεί να ξαναβάψετε και την υπόλοιπη σελίδα. Αλλά είναι εξίσου σημαντικό να ελέγξετε ότι δεν δημιουργείτε κατά λάθος πάρα πολλά επίπεδα, καθώς το καθένα χρειάζεται μνήμη.