Τρόπος χρήσης των Εργαλείων προγραμματιστή του προγράμματος περιήγησης στο Web

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

Πηγαίνουν οι ημέρες κατά τις οποίες τα μοναδικά εργαλεία προγραμματισμού και δοκιμών που βρέθηκαν μέσα σε ένα πρόγραμμα περιήγησης σας επέτρεψαν να δείτε τον πηγαίο κώδικα μιας σελίδας και τίποτα περισσότερο. Τα σημερινά προγράμματα περιήγησης σας επιτρέπουν να κάνετε μια βαθύτερη κατάδυση κάνοντας τα πράγματα όπως εκτέλεση και αποσφαλμάτωση αποσπασμάτων JavaScript, επιθεώρηση και επεξεργασία στοιχείων DOM, παρακολούθηση της κυκλοφορίας δικτύου σε πραγματικό χρόνο καθώς φορτώνεται η εφαρμογή ή η σελίδα σας για τον εντοπισμό σημείων συμφόρησης, την ανάλυση της απόδοσης CSS δεν χρησιμοποιεί πάρα πολύ μνήμη ή πάρα πολλούς κύκλους CPU και πολλά άλλα. Από τη σκοπιά των δοκιμών, μπορείτε να αναπαράγετε πώς μια εφαρμογή ή μια ιστοσελίδα θα προβάλλεται σε διαφορετικά προγράμματα περιήγησης καθώς και σε διαφορετικές συσκευές και πλατφόρμες μέσω της μαγείας του σχεδιασμού που ανταποκρίνεται και των ενσωματωμένων προσομοιωτών. Το καλύτερο μέρος είναι ότι μπορείτε να κάνετε όλα αυτά χωρίς να χρειάζεται να αφήσετε το πρόγραμμα περιήγησής σας!

Τα σεμινάρια που ακολουθούν σας δείχνουν πώς να αποκτήσετε πρόσβαση σε αυτά τα εργαλεία προγραμματιστών σε πολλά δημοφιλή προγράμματα περιήγησης στο Web.

Google Chrome

Τα εργαλεία προγραμματιστή του Chrome σάς επιτρέπουν να επεξεργάζεστε και να διορθώνετε κώδικα, να ελέγχετε μεμονωμένα στοιχεία για να εκθέτετε προβλήματα επιδόσεων, να προσομοιώνετε διαφορετικές οθόνες συσκευών, συμπεριλαμβανομένων αυτών που εκτελούν Android ή iOS, και να εκτελείτε διάφορες άλλες χρήσιμες λειτουργίες.

1. Κάντε κλικ στο κύριο κουμπί του Chrome, το οποίο φέρει τρεις οριζόντιες γραμμές και βρίσκεται στην επάνω δεξιά γωνία του προγράμματος περιήγησης.
2. Όταν εμφανιστεί το αναπτυσσόμενο μενού, τοποθετήστε το δείκτη του ποντικιού πάνω από το Περισσότερα εργαλεία επιλογή.
3. Θα εμφανιστεί τώρα ένα δευτερεύον μενού. Επιλέξτε την επιλογή που έχει επισημανθεί Εργαλεία προγραμματιστή . Μπορείτε επίσης να χρησιμοποιήσετε την ακόλουθη συντόμευση πληκτρολογίου στη θέση αυτού του στοιχείου μενού: Chrome OS / Windows ( CTRL + SHIFT + I ), Mac OS X ( ALT (ΕΠΙΛΟΓΗ) + COMMAND + I )
4. Θα πρέπει τώρα να εμφανιστεί η διεπαφή των Εργαλείων για προγραμματιστές Chrome, όπως φαίνεται σε αυτό το στιγμιότυπο οθόνης. Ανάλογα με την έκδοση του Chrome, η αρχική διάταξη που βλέπετε μπορεί να είναι ελαφρώς διαφορετική από αυτήν που παρουσιάζεται εδώ. Ο κύριος κόμβος των εργαλείων για προγραμματιστές, που συνήθως βρίσκονται είτε στην κάτω είτε στην δεξιά πλευρά της οθόνης, περιέχει τις ακόλουθες καρτέλες.Στοιχεία: Παρέχει τη δυνατότητα να επιθεωρεί το CSS και τον κώδικα HTML καθώς και να επεξεργάζεται το CSS on-the-fly, βλέποντας τα αποτελέσματα των αλλαγών σας σε πραγματικό χρόνο.Κονσόλα: Η κονσόλα JavaScript του Chrome επιτρέπει άμεση καταχώρηση εντολών καθώς και διαγνωστικά σφαλμάτων.Πηγές: Σας επιτρέπει να εντοπίζετε λάθος κώδικα JavaScript μέσω ενός ισχυρού γραφικού περιβάλλοντος.Δίκτυο: Κατηγοριοποιεί και εμφανίζει λεπτομερείς πληροφορίες για κάθε σχετική ενέργεια στην ενεργή εφαρμογή ή σελίδα, συμπεριλαμβανομένων πλήρων κεφαλίδων αιτήματος και απαντήσεων καθώς και προηγμένων μετρήσεων χρονισμού.Χρονοδιάγραμμα: Επιτρέπει την εμπεριστατωμένη ανάλυση κάθε δραστηριότητας που πραγματοποιείται στο πρόγραμμα περιήγησης, μόλις αρχίσει μια αίτηση φόρτωσης σελίδας ή εφαρμογής.
5. Εκτός από αυτά τα τμήματα, μπορείτε επίσης να αποκτήσετε πρόσβαση στα ακόλουθα εργαλεία μέσω του >> εικονίδιο που βρίσκεται στα δεξιά του Χρονοδιάγραμμα αυτί.Προφίλ: Σπασμένο κάτω Προφίλ επεξεργαστή CPU και Προφίλρα σωρού , παρέχει εκτεταμένη χρήση μνήμης και χρόνο συνολικής εκτέλεσης της ενεργής εφαρμογής ή σελίδας.Ασφάλεια: Υπογραμμίζει προβλήματα πιστοποιητικών και άλλα ζητήματα που σχετίζονται με την ασφάλεια με την ενεργή σελίδα ή την εφαρμογή.Πόροι: Εδώ μπορείτε να επιθεωρήσετε τα cookies, το τοπικό αποθηκευτικό χώρο, την προσωρινή μνήμη εφαρμογών και άλλες τοπικές πηγές δεδομένων που χρησιμοποιούνται από την τρέχουσα ιστοσελίδα ή εφαρμογή.Έλεγχοι: Προσφέρει τρόπους για τη βελτιστοποίηση του χρόνου φόρτωσης της σελίδας ή της εφαρμογής και της γενικής απόδοσης.
6. Λειτουργία συσκευής σας επιτρέπει να βλέπετε την ενεργή σελίδα σε ένα προσομοιωτή που την καθιστά σχεδόν ακριβώς όπως θα εμφανιζόταν σε μία από περισσότερες από μια ντουζίνα συσκευές, συμπεριλαμβανομένων πολλών γνωστών μοντέλων Android και iOS όπως το iPad, το iPhone και το Samsung Galaxy. Σας δίνεται επίσης η δυνατότητα να μιμηθούν ψηφίσματα προσαρμοσμένης οθόνης ώστε να ταιριάζουν στις ιδιαίτερες ανάγκες σας για ανάπτυξη ή δοκιμή. Για εναλλαγή Λειτουργία συσκευής ενεργοποίηση και απενεργοποίηση, επιλέξτε το εικονίδιο κινητού τηλεφώνου που βρίσκεται ακριβώς στα αριστερά του Στοιχεία αυτί.
7. Μπορείτε επίσης να προσαρμόσετε την εμφάνιση και την αίσθηση των εργαλείων προγραμματιστών κάνοντας πρώτα κλικ στο κουμπί μενού που αντιπροσωπεύεται από τρεις κάθετα τοποθετημένες κουκίδες και βρίσκεται στην άκρα δεξιά πλευρά των προαναφερθέντων καρτελών. Από αυτό το αναπτυσσόμενο μενού, μπορείτε να επανατοποθετήσετε την αποβάθρα, να εμφανίσετε ή να αποκρύψετε διαφορετικά εργαλεία καθώς και να ξεκινήσετε πιο προηγμένα αντικείμενα, όπως έναν επιθεωρητή συσκευών. Θα διαπιστώσετε ότι η ίδια η διεπαφή εργαλείων dev είναι εξαιρετικά προσαρμόσιμη μέσω των ρυθμίσεων που βρίσκονται σε αυτή την ενότητα.

Mozilla Firefox

Η ενότητα για προγραμματιστές ιστού του Firefox περιλαμβάνει εργαλεία για σχεδιαστές, προγραμματιστές και δοκιμαστές, όπως έναν επεξεργαστή στυλ και ένα σταγονόμετρο εικονοστοιχείων.

Lifewire Προτεινόμενη ανάγνωση:Τα Top 25 greasemonkey και Tampermonkey User Scripts

1. Κάντε κλικ στο κύριο κουμπί του Firefox, το οποίο αντιπροσωπεύεται από τρεις οριζόντιες γραμμές και βρίσκεται στην επάνω δεξιά γωνία του παραθύρου του προγράμματος περιήγησης.
2. Όταν εμφανιστεί το αναπτυσσόμενο μενού, επιλέξτε το εικονίδιο με την ετικέτα Προγραμματιστής . ο Web Developer θα πρέπει τώρα να εμφανίζεται το μενού, που περιέχει τις ακόλουθες επιλογές.Θα παρατηρήσετε ότι τα περισσότερα στοιχεία μενού έχουν συντομεύσεις πληκτρολογίου που σχετίζονται με αυτές.Εναλλαγή εργαλείων: Εμφανίζει ή αποκρύπτει τη διεπαφή εργαλείων προγραμματιστών, που βρίσκεται συνήθως στο κάτω μέρος του παραθύρου του προγράμματος περιήγησης. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (ΕΠΙΛΟΓΗ) + COMMAND + I ), Τα Windows ( CTRL + SHIFT + I )Επιθεωρητής: Σας δίνει τη δυνατότητα να επιθεωρήσετε ή / και να τροποποιήσετε τον κώδικα CSS και HTML στην ενεργή σελίδα καθώς και σε μια φορητή συσκευή μέσω απομακρυσμένης αποσφαλμάτωσης. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (OPTION) + COMMAND + Γ ), Τα Windows ( CTRL + SHIFT + C )Κονσόλα Web: Σας επιτρέπει να εκτελέσετε εκφράσεις JavaScript μέσα στην ενεργή σελίδα, καθώς και να εξετάσετε ένα διαφορετικό σύνολο καταγεγραμμένων δεδομένων, συμπεριλαμβανομένων των προειδοποιήσεων ασφαλείας, των αιτημάτων δικτύου, των μηνυμάτων CSS και πολλά άλλα. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (ΕΠΙΛΟΓΗ) + COMMAND + K ), Τα Windows ( CTRL + SHIFT + K )Debugger: ο JavaScript Debugger σας επιτρέπει να εντοπίζετε και να διορθώνετε ελαττώματα θέτοντας σημεία διακοπής, επιθεωρώντας κόμβους DOM, εξωτερικές πηγές μαύρης πυγμαχίας και πολλά άλλα. Όπως συμβαίνει με το Επιθεωρητής , αυτή η λειτουργία υποστηρίζει επίσης την απομακρυσμένη αποσφαλμάτωση. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (OPTION) + COMMAND + S ), Τα Windows ( CTRL + SHIFT + S) Επεξεργαστής στυλ: Σας δίνει τη δυνατότητα να δημιουργήσετε νέα φύλλα στυλ και να τα ενσωματώσετε στην ενεργή ιστοσελίδα ή να επεξεργαστείτε τα υπάρχοντα φύλλα και να δοκιμάσετε πώς οι αλλαγές σας εμφανίζονται σε ένα πρόγραμμα περιήγησης με ένα μόνο κλικ. Συντόμευση πληκτρολογίου: Mac OS X, Windows ( SHIFT + F7 )Εκτέλεση: Παρέχει λεπτομερή ανάλυση της απόδοσης δικτύου της ενεργής σελίδας, των δεδομένων ρυθμού πλαισίων, του χρόνου και της κατάστασης εκτέλεσης της JavaScript, του χρώματος που αναβοσβήνει και πολλά άλλα. Συντόμευση πληκτρολογίου: Mac OS X, Windows ( SHIFT + F5 )Δίκτυο: Εμφανίζει κάθε αίτημα δικτύου που ξεκίνησε από το πρόγραμμα περιήγησης μαζί με την αντίστοιχη μέθοδο, τον τομέα προέλευσης, τον τύπο, το μέγεθος και το χρονικό διάστημα που έχει περάσει. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (ΕΠΙΛΟΓΗ) + COMMAND + Q ), Τα Windows ( CTRL + SHIFT + Q )Γραμμή εργαλείων προγραμματιστή: Ανοίγει έναν διαδραστικό διερμηνέα γραμμής εντολών. Εισαγω βοήθεια στον διερμηνέα για μια λίστα με όλες τις διαθέσιμες εντολές και την σωστή σύνταξη τους. Συντόμευση πληκτρολογίου: Mac OS X, Windows ( SHIFT + F2 )WebIDE: Παρέχει τη δυνατότητα δημιουργίας και εκτέλεσης εφαρμογών Web μέσω μιας πραγματικής συσκευής που χρησιμοποιεί το Firefox OS ή μέσω του προσομοιωτή του Firefox OS. Συντόμευση πληκτρολογίου: Mac OS X, Windows ( SHIFT + F8 )Κονσόλα περιήγησης: Παρέχει την ίδια λειτουργικότητα με το Κονσόλα Web (βλέπε παραπάνω). Ωστόσο, όλα τα δεδομένα που επιστρέφονται αφορούν ολόκληρη την εφαρμογή του Firefox (συμπεριλαμβανομένων των επεκτάσεων και των λειτουργιών σε επίπεδο περιηγητή), σε αντίθεση με την ενεργή ιστοσελίδα. Συντόμευση πληκτρολογίου: Mac OS X ( SHIFT + COMMAND + J ), Τα Windows ( CTRL + SHIFT + J )Ανταπόκριση σχεδίασης: Σας επιτρέπει να προβάλλετε άμεσα μια ιστοσελίδα σε διαφορετικές αναλύσεις, διατάξεις και μεγέθη οθόνης για να μιμείται πολλές συσκευές, συμπεριλαμβανομένων των δισκίων και των smartphones. Συντόμευση πληκτρολογίου: Mac OS X ( ALT (ΕΠΙΛΟΓΗ) + COMMAND + M ), Τα Windows ( CTRL + SHIFT + M )Σταγονόμετρο: Εμφανίζει τον δεκαεξαδικό κωδικό χρώματος για επιλεγμένα εικονοστοιχεία.Scratchpad: Σας επιτρέπει να γράφετε, να επεξεργάζεστε, να ενσωματώνετε και να εκτελείτε αποσπάσματα κώδικα JavaScript από ένα παράθυρο του Firefox. Συντόμευση πληκτρολογίου: Mac OS X, Windows ( SHIFT + F4 )Πηγή σελίδας: Το αρχικό εργαλείο προγραμματιστών που βασίζεται στον browser, αυτή η επιλογή εμφανίζει απλώς τον διαθέσιμο κώδικα πηγής για την ενεργή σελίδα. Συντόμευση πληκτρολογίου: Mac OS X ( COMMAND + U ), Τα Windows ( CTRL + U )Λάβετε περισσότερα εργαλεία: Ανοίγει το Εργαλειοθήκη προγραμματιστή ιστού συλλογή στον επίσημο ιστότοπο πρόσθετων του Mozilla, που περιλαμβάνει περίπου δώδεκα δημοφιλείς επεκτάσεις όπως το Firebug και το Greasemonkey.

Microsoft Edge / Internet Explorer

Συνήθως αναφέρεται ως Εργαλεία προγραμματιστή F12 , το αφιέρωμα στη συντόμευση πληκτρολογίου που ξεκίνησε τη διεπαφή από τις παλαιότερες εκδόσεις του Internet Explorer, το dev εργαλείο στο IE11 και το Microsoft Edge έχει προχωρήσει πολύ από την έναρξή του, προσφέροντας μια πολύ εύχρηστη ομάδα οθονών, debuggers, emulators και -the-fly μεταγλωττιστές.

1. Κάνε κλικ στο Περισσότερες δράσεις μενού που αντιπροσωπεύεται από τρεις κουκκίδες και βρίσκεται στην επάνω δεξιά γωνία του παραθύρου του προγράμματος περιήγησης. Όταν εμφανιστεί το αναπτυσσόμενο μενού, επιλέξτε την επιλογή που έχει επισημανθεί Εργαλεία προγραμματιστή F12 . Όπως ήδη ανέφερα, μπορείτε επίσης να έχετε πρόσβαση στα εργαλεία μέσω του F12 συντόμευση πληκτρολογίου.
2. Η διεπαφή ανάπτυξης πρέπει τώρα να εμφανίζεται, συνήθως στο κάτω μέρος του παραθύρου του προγράμματος περιήγησης. Υπάρχουν τα ακόλουθα εργαλεία, τα οποία είναι προσβάσιμα κάνοντας κλικ στην αντίστοιχη επικεφαλίδα καρτέλας ή χρησιμοποιώντας τη συντόμευση του πληκτρολογίου.Εξερεύνηση DOM: Σας επιτρέπει να επεξεργάζεστε φύλλα στυλ και HTML στην ενεργή σελίδα, καθιστώντας τα τροποποιημένα αποτελέσματα όσο περνάτε. Χρησιμοποιεί τη λειτουργία IntelliSense για αυτόματη συμπλήρωση κώδικα, όπου ισχύει. Συντόμευση πληκτρολογίου: (CTRL + 1) Κονσόλα: Παρέχει τη δυνατότητα υποβολής πληροφοριών σφαλμάτων, όπως μετρητές, χρονοδιακόπτες, ίχνη και προσαρμοσμένα μηνύματα μέσω ενός ολοκληρωμένου API. Επίσης, σας επιτρέπει να εισάγετε κώδικα σε μια ενεργή ιστοσελίδα και να τροποποιήσετε τις τιμές που αντιστοιχούν σε μεμονωμένες μεταβλητές σε πραγματικό χρόνο. Συντόμευση πληκτρολογίου: (CTRL + 2) Debugger: Σας δίνει τη δυνατότητα να ορίσετε σημεία διακοπής και να διορθώσετε τον κώδικα σας ενώ εκτελείται, εάν χρειάζεται, γραμμή με γραμμή. Συντόμευση πληκτρολογίου: (CTRL + 3) Δίκτυο: Καταγράφει κάθε αίτημα δικτύου που ξεκίνησε από το πρόγραμμα περιήγησης κατά τη φόρτωση και εκτέλεση της σελίδας, συμπεριλαμβανομένων λεπτομερειών πρωτοκόλλου, τύπου περιεχομένου, χρήσης εύρους ζώνης και πολλά άλλα. Συντόμευση πληκτρολογίου: (CTRL + 4) Εκτέλεση: Αναφέρετε τα ποσοστά καρέ, τη χρήση της CPU και άλλες μετρήσεις που σχετίζονται με την απόδοση, για να σας βοηθήσουν να επιταχύνετε τους χρόνους φόρτωσης σελίδας και άλλες δραστηριότητες. Συντόμευση πληκτρολογίου: (CTRL + 5) Μνήμη: Σας βοηθά να απομονώσετε και να διορθώσετε πιθανές διαρροές μνήμης στην τρέχουσα ιστοσελίδα προβάλλοντας ένα χρονοδιάγραμμα χρήσης μνήμης μαζί με στιγμιότυπα από διαφορετικά χρονικά διαστήματα. Συντόμευση πληκτρολογίου: (CTRL + 6) Αμιλλα: Σας δείχνει τον τρόπο με τον οποίο η ενεργή σελίδα θα εμφανίζεται σε διάφορες αναλύσεις και μεγέθη οθόνης, εξομοιώνοντας smartphones, tablet και άλλες συσκευές. Παρέχει επίσης τη δυνατότητα τροποποίησης του παράγοντα χρήστη και του προσανατολισμού της σελίδας, καθώς επίσης και την προσομοίωση διαφορετικών γεωγραφικών τοποθεσιών με εισαγωγή γεωγραφικού πλάτους και γεωγραφικού μήκους. Συντόμευση πληκτρολογίου: (CTRL + 7)
3. Για να εμφανίσετε το Κονσόλα ενώ μέσα σε οποιοδήποτε από τα άλλα εργαλεία κάντε κλικ στο τετράγωνο κουμπί με ένα δεξί βραχίονα μέσα του, που βρίσκεται στην επάνω δεξιά γωνία της διεπαφής εργαλείων ανάπτυξης.
4. Για να ξεκλειδώσετε το περιβάλλον των εργαλείων προγραμματιστών, ώστε να γίνει ένα ξεχωριστό παράθυρο, κάντε κλικ στο κουμπί που αντιπροσωπεύεται από δύο ορθογώνια επικαλύψεων ή χρησιμοποιήστε την ακόλουθη συντόμευση πληκτρολογίου: CTRL + P . Μπορείτε να τοποθετήσετε τα εργαλεία στην αρχική θέση πατώντας CTRL + P μια δεύτερη φορά.

Apple Safari (μόνο OS X)

Το διαφορετικό εργαλείο dev του Safari αντικατοπτρίζει τη μεγάλη κοινότητα προγραμματιστών που χρησιμοποιεί ένα Mac για τις ανάγκες σχεδιασμού και προγραμματισμού. Εκτός από την ισχυρή κονσόλα και τις παραδοσιακές λειτουργίες καταγραφής και εντοπισμού σφαλμάτων, παρέχεται επίσης ένας εύχρηστος τρόπος σχεδιασμού με ευκολία στη χρήση και ένα εργαλείο για τη δημιουργία των δικών σας επεκτάσεων του προγράμματος περιήγησης.

1. Κάντε κλικ στο Σαφάρι στο μενού του προγράμματος περιήγησης που βρίσκεται στο επάνω μέρος της οθόνης σας. Όταν εμφανιστεί το αναπτυσσόμενο μενού, επιλέξτε Προτιμήσεις . Μπορείτε επίσης να χρησιμοποιήσετε την ακόλουθη συντόμευση πληκτρολογίου στη θέση αυτού του στοιχείου μενού: COMMAND + COMMA (,)
2. Το σαφάρι Προτιμήσεις θα πρέπει τώρα να εμφανιστεί η διεπαφή, επικαλύπτοντας το παράθυρο του προγράμματος περιήγησης. Κάνε κλικ στο Προχωρημένος εικονίδιο που βρίσκεται στην άκρα δεξιά πλευρά της κεφαλίδας.
3. ο Προχωρημένος οι προτιμήσεις θα πρέπει τώρα να είναι ορατές. Στο κάτω μέρος αυτής της οθόνης υπάρχει μια επιλογή με την ετικέτα Εμφάνιση του αναπτυσσόμενου μενού στη γραμμή μενού , συνοδευόμενη από ένα πλαίσιο ελέγχου. Εάν δεν υπάρχει κανένα σημάδι ελέγχου στη συσκευασία, κάντε κλικ σε αυτήν μία φορά για να το τοποθετήσετε εκεί.
4. Κλείστε το Προτιμήσεις κάντε κλικ στο κόκκινο 'x' που βρίσκεται στην επάνω αριστερή γωνία.
5. Θα πρέπει τώρα να παρατηρήσετε μια νέα επιλογή στο μενού του προγράμματος περιήγησης που ονομάζεται Αναπτύσσω , που βρίσκεται μεταξύ Σελιδοδείκτες και Παράθυρο . Κάντε κλικ σε αυτό το στοιχείο μενού. Θα πρέπει τώρα να εμφανίζεται ένα αναπτυσσόμενο μενού, το οποίο περιέχει τις ακόλουθες επιλογές.Άνοιγμα σελίδας με: Σας επιτρέπει να ανοίξετε την ενεργή ιστοσελίδα σε ένα από τα άλλα προγράμματα περιήγησης που είναι εγκατεστημένα επί του Mac σας.User Agent: Σας δίνει τη δυνατότητα να επιλέξετε από πάνω από δώδεκα προκαθορισμένες τιμές πράκτορα χρηστών συμπεριλαμβανομένων αρκετών εκδόσεων του Chrome, του Firefox και του Internet Explorer, καθώς και να ορίσετε τη δική σας προσαρμοσμένη συμβολοσειρά.Εισαγάγετε τον υπεύθυνο τρόπο σχεδίασης: Εμφανίζει την τρέχουσα σελίδα όπως θα εμφανίζεται σε διάφορες συσκευές και σε διαφορετικές αναλύσεις οθόνης.Εμφάνιση επιθεωρητή ιστού: Κυκλοφορεί η κύρια διεπαφή για τα εργαλεία dev του Safari, τα οποία συνήθως τοποθετούνται στο κάτω μέρος της οθόνης του προγράμματος περιήγησης και περιέχουν τις ακόλουθες ενότητες: Στοιχεία , Δίκτυο , Πόροι , Χρονοδιαγράμματα , Debugger , Αποθήκευση , Κονσόλα .Εμφάνιση κονσόλας σφαλμάτων: Επίσης, εκκινεί τη διεπαφή εργαλείων dev, απευθείας στο Κονσόλα καρτέλα που εμφανίζει σφάλματα, προειδοποιήσεις και άλλα δεδομένα καταγραφής που μπορούν να αναζητηθούν.Εμφάνιση σελίδας Πηγή: Ανοίγει το Πόροι καρτέλα, η οποία εμφανίζει τον πηγαίο κώδικα για την ενεργή σελίδα που κατηγοριοποιείται από το έγγραφο.Εμφάνιση πόρων σελίδας: Εκτελεί την ίδια λειτουργία με το Εμφάνιση προέλευσης σελίδας επιλογή.Εμφάνιση επεξεργαστή αποσπάσματος: Ανοίγει ένα νέο παράθυρο όπου μπορείτε να εισάγετε κώδικα CSS και HTML, προβαίνοντας σε προεπισκόπηση της εξόδου του επί τόπου.Εμφάνιση παράδοσης επέκτασης: Παρέχει τη δυνατότητα δημιουργίας ή επεξεργασίας επεκτάσεων του Safari με CSS, HTML και JavaScript.Εμφάνιση καταγραφής γραμμής χρόνου: Ανοίγει το Χρονοδιαγράμματα tab και αρχίζει να εμφανίζει τις απαιτήσεις δικτύου, τη διάταξη και την απόδοση, καθώς και την εκτέλεση του JavaScript σε πραγματικό χρόνο.Άδειασμα Caches: Διαγράφει ολόκληρη τη μνήμη cache που είναι αποθηκευμένη στο σκληρό σας δίσκο.Απενεργοποίηση προσωρινής αποθήκευσης: Σταματάει το Safari από την προσωρινή αποθήκευση, έτσι ώστε όλο το περιεχόμενο να ανακτάται από το διακομιστή κατά τη φόρτωση κάθε σελίδας.Απενεργοποίηση εικόνων: Αποτρέπει την απόδοση εικόνων σε όλες τις ιστοσελίδες.Απενεργοποίηση στυλ: Αγνοεί ιδιότητες CSS όταν φορτώνεται μια σελίδα.Απενεργοποίηση JavaScript: Περιορίζει την εκτέλεση JavaScript σε όλες τις σελίδες.Απενεργοποίηση επεκτάσεων: Απαγορεύει την εκτέλεση όλων των εγκατεστημένων επεκτάσεων στο πρόγραμμα περιήγησης.Απενεργοποιήστε τις ειδικές για τον ιστό ιστότοπους: Εάν το Safari έχει τροποποιηθεί για να χειριστεί ρητά τα συγκεκριμένα θέματα που αφορούν την ενεργή ιστοσελίδα, αυτή η επιλογή θα εμποδίσει αυτές τις αλλαγές έτσι ώστε η σελίδα να φορτωθεί όπως θα είχε πριν από την εισαγωγή αυτών των τροποποιήσεων.Απενεργοποίηση τοπικών περιορισμών αρχείων: Επιτρέπει στο πρόγραμμα περιήγησης να έχει πρόσβαση σε αρχεία στους τοπικούς δίσκους σας, μια ενέργεια που είναι περιορισμένη από προεπιλογή για λόγους ασφαλείας.Απενεργοποιήστε τους περιορισμούς διασταυρούμενης προέλευσης: Οι περιορισμοί αυτοί εφαρμόζονται από προεπιλογή για την αποτροπή του XSS και άλλων δυνητικών κινδύνων. Ωστόσο, συχνά χρειάζονται προσωρινή αναπηρία για αναπτυξιακούς σκοπούς.Να επιτρέπεται η JavaScript από το πεδίο έξυπνης αναζήτησης: Όταν είναι ενεργοποιημένη, παρέχει τη δυνατότητα εισαγωγής διευθύνσεων URL javascript: ενσωματωμένο απευθείας στη γραμμή διευθύνσεων.Αντιμετωπίστε τα πιστοποιητικά SHA-1 ως μη ασφαλή: Τα πιστοποιητικά SSL που χρησιμοποιούν τον αλγόριθμο SHA-1 θεωρούνται ευρέως ότι είναι ξεπερασμένα και ευάλωτα.