Επωφεληθείτε από τις σύγχρονες δυνατότητες του προγράμματος περιήγησης, όπως η προφόρτωση, η προ-ανάκτηση, η προσύνδεση για να κάνετε τον ιστότοπο του WordPress πιο γρήγορο.
Ως ιδιοκτήτης ιστότοπου, σε ποιον δεν αρέσει να κάνει ό,τι είναι δυνατό για να φορτώσει την ιστοσελίδα πιο γρήγορα;
Η διασφάλιση της ταχύτερης φόρτωσης του ιστότοπου σε όλο τον κόσμο αποτελεί πρόκληση. Υπάρχουν πολλά πράγματα που μπορείτε να κάνετε για να φορτώσετε γρήγορα τους πόρους του ιστότοπου, συμπεριλαμβανομένης της ενεργοποίησης των παρακάτω υποδείξεων προγράμματος περιήγησης. Είναι επίσης γνωστές ως τεχνικές προ-περιήγησης.
Σημείωση: οι τεχνικές υποδείξεων του προγράμματος περιήγησης δεν βοηθούν πολύ όταν αποκτάτε πρόσβαση στον ιστότοπο για πρώτη φορά, αλλά τα επόμενα αιτήματα είναι πιο γρήγορα.
Πίνακας περιεχομένων
Προφόρτωση
Μπορείτε να χρησιμοποιήσετε την ετικέτα προφόρτωσης για να πείτε στο πρόγραμμα περιήγησης να ανακτήσει κάποιους από τους στατικούς πόρους νωρίς. Μπορεί να είναι εικόνα, γραμματοσειρά, JavaScript, CSS, σενάρια, βίντεο κ.λπ. Βοηθά να δοθεί προτεραιότητα στη φόρτωση των πόρων. ως εκ τούτου, η απόδοση βελτιώνεται.
Η προφόρτωση θα ήταν καλή ιδέα να εφαρμοστεί εάν περιμένετε οι χρήστες σας να επισκεφτούν πολλές σελίδες στη συνέχεια. Όπως το κατάστημα ηλεκτρονικού εμπορίου όπου ο χρήστης επισκέπτεται τη σελίδα του προϊόντος και στη συνέχεια ελέγχει τις πληροφορίες, συγκρίνει με άλλο προϊόν, προσθέτει στο καλάθι, πληρώνει κ.λπ.
Μπορείτε να χρησιμοποιήσετε τις ακόλουθες προσθήκες για να ρυθμίσετε τη λειτουργία Προφόρτωση.
Καλύτερες συμβουλές πόρων – ένα δωρεάν πρόσθετο για τη διαμόρφωση αρχείων CSS και JS.
WP Rocket – ένα premium plugin για την υπερφόρτιση της απόδοσης του ιστότοπου με πολλές βασικές τεχνικές, συμπεριλαμβανομένης της προφόρτωσης προσωρινής αποθήκευσης και χάρτη ιστότοπου.
Πώς ξέρετε εάν η προφόρτωση είναι ενεργοποιημένη;
Ο πιο γρήγορος τρόπος για να το μάθετε είναι προβάλλοντας την πηγή της σελίδας. Θα πρέπει να δείτε κάτι σαν παρακάτω.
<link rel="preload" as="style" href="https://wilku.top/implementing-preload-prefetch-preconnect-in-wordpress/IMPORTANT.css"> <link rel="preload" as="script" href="CRITICAL.js">
Δεν υποστηρίζουν όλα τα προγράμματα περιήγησης Προφόρτωση κατά την εγγραφή. Λοιπόν, ελέγξτε το μήτρα συμβατότητας πριν την υλοποίηση.
Προσύνδεση
Φορτώνετε πόρους από άλλους τομείς; Ίσως το CDN;
Εάν όχι, και κάθε πόρος φορτώνεται από τον μεμονωμένο τομέα σας, τότε αυτό μπορεί να μην είναι χρήσιμο.
Η προσύνδεση υποδεικνύει το πρόγραμμα περιήγησης για τη δημιουργία σύνδεσης με άλλους τομείς στο παρασκήνιο για εξοικονόμηση χρόνου για αναζήτηση DNS, ανακατεύθυνση, χειραψία TCP, διαπραγμάτευση TLS κ.λπ. Η ιδέα είναι να μειωθεί ο λανθάνοντας χρόνος για να παρέχεται γρήγορη φόρτωση πόρων από άλλο τομέα.
Και πάλι, μπορείτε να χρησιμοποιήσετε την προαναφερθείσα προσθήκη καλύτερων υποδείξεων πόρων ή το premium like perfmatters.
Αφού διαμορφώσετε τους απαιτούμενους πόρους, θα πρέπει να τους δείτε στην πηγή της σελίδας όπως παρακάτω.
<link rel="preconnect" href="https://ANOTHERSITE.com">
Σημείωση: εάν φορτώνετε τους πόρους από έναν τομέα που απαιτεί CORS, τότε πρέπει να καθορίσετε ότι η διασταυρούμενη προέλευση και η έξοδος θα πρέπει να μοιάζουν.
<link rel="preconnect" href="https://ANOTHERSITE.com" crossorigin>
Η προσύνδεση είναι συμβατή με την πιο πρόσφατη έκδοση του Chrome, Edge, Firefox, Safari.
Προανάκτηση
Αφήστε το πρόγραμμα περιήγησης να πάρει την επόμενη σελίδα, η οποία πιστεύετε ότι θα χρειαστεί όταν ο χρήστης περιηγηθεί. Το Prefetch θα κατεβάσει τους απαραίτητους πόρους και θα τους αποθηκεύσει στην τοπική κρυφή μνήμη και θα τους εξυπηρετήσει γρήγορα όταν χρειάζεται. Υπάρχουν δύο τύποι προφόρτωσης.
Προφόρτωση DNS – εξηγείται παρακάτω
Προανάκτηση συνδέσμου – διαμορφώθηκε χρησιμοποιώντας . Χρησιμοποιείται για την εκ των προτέρων λήψη του HTML ή των στατικών πόρων. Μπορείτε να κάνετε προανάκτηση πόρων χρησιμοποιώντας ως χαρακτηριστικό.
Πρόσθετο Pre Party Resource Hints.Προφόρτωση DNS
Φορτώνετε πόρους από πολλούς τομείς και θέλετε να τους επιλύσετε στο παρασκήνιο;
Αυτή η γρήγορη ρύθμιση μπορεί να βοηθήσει στην επίλυση όλων των πιθανών τομέων νωρίτερα, ώστε όταν ζητούνται πόροι, να φορτώνει πιο γρήγορα. Αυτό βοηθά στη μείωση της συνολικής καθυστέρησης.
Ας υποθέσουμε ότι φορτώνετε πόρους από 3 τομείς και κάθε τομέας χρειάζεται περίπου 100 ms για να πραγματοποιήσει αναζήτηση DNS, οπότε θα εξοικονομήσετε καθυστέρηση 300 ms.
Δεν είναι κουλ;
Μπορείτε να το εφαρμόσετε είτε χρησιμοποιώντας το πρόσθετο perfmatters είτε να προσθέσετε τα ακόλουθα στο αρχείο functions.php του θέματός σας, εάν είστε άνετοι στην επεξεργασία των αρχείων θέματος.
//* DNS Prefetching
function dns_prefetch() {
echo '<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="https://YOUROTHERDOMAIN.com" />
<link rel="dns-prefetch" href="https://ANDANOTHERONE.com" />
<link rel="dns-prefetch" href="https://AND.SOMEMORE.com" />
}
add_action('wp_head', 'dns_prefetch', 0);
Μπορείτε να διαβάσετε περισσότερα στο Έγγραφα Ιστού Mozilla.
Προαπόδοση
Αναμένετε από τους χρήστες του ιστότοπού σας να πλοηγηθούν στην πιθανή σελίδα;
Η προαπόδοση μπορεί να βοηθήσει στη φόρτωση αυτών των στοιχείων στο παρασκήνιο και όταν οι χρήστες κάνουν κλικ σε αυτό, το λαμβάνουν πολύ γρήγορα. Μπορείτε να το πετύχετε αυτό με την προσθήκη Pre Party Resource Hints.
Η προαπόδοση είναι κατάλληλη για μια ελαφριά σελίδα ή στοιχείο, αλλά να είστε προσεκτικοί με ολόκληρο τον ιστότοπο ή μεγάλους πόρους, καθώς μπορεί να αυξήσει τη χρήση της CPU και το εύρος ζώνης και να επιβραδύνει τον ιστότοπο. Επομένως, δοκιμάστε με τον μικρότερο πόρο και δοκιμάστε τον για να βεβαιωθείτε ότι δεν έχει παρενέργειες.
Όπως μπορείτε να δείτε, υπάρχουν τέσσερις κύριες προσθήκες που εμπλέκονται για την εφαρμογή υποδείξεων προγράμματος περιήγησης στο WordPress. Επιλέξτε αυτό που σας αρέσει και ταιριάζει στις απαιτήσεις.
Πρόσθετο Pre Party Resource Hints – μια δωρεάν προσθήκη προσφέρει προφόρτωση DNS, προφόρτωση συνδέσμων, προαπόδοση, προσύνδεση και προφόρτωση.
Καλύτερες συμβουλές πόρων – εναλλακτική της παραπάνω.
Το δωρεάν πρόσθετο είναι καλό αρκεί να διατηρείται και να υποστηρίζεται. Δυστυχώς, αυτό δεν συμβαίνει για πολλά πρόσθετα, και γι’ αυτό μερικές φορές είναι καλύτερο να προτιμάτε την πληρωμένη έκδοση. Τα πρόσθετα εμπορικής έκδοσης υποστηρίζονται επαγγελματικά και ενημερωμένα με τυπικές επιδιορθώσεις και επιδιορθώσεις ασφαλείας του WordPress. Εάν είστε διατεθειμένοι να ξοδέψετε μερικά δολάρια για τη βελτιστοποίηση της απόδοσης του ιστότοπού σας, τότε μπορείτε να ελέγξετε τα παρακάτω.
WP Rocket – φημισμένο, το οποίο εμπιστεύονται περισσότεροι από 800.000 ιστότοποι. Κοστίζει 49 $ για έναν ιστότοπο.
Perfmatters – ένα ελαφρύ και εύκολο στην παρακολούθηση κοστίζει 24,95 $ για έναν ιστότοπο. Καθώς γράφω, προσφέρει τα ακόλουθα χαρακτηριστικά.
Αυτό είναι πολύ βελτιστοποίηση.
συμπέρασμα
Ο πυρήνας του WordPress είναι ελαφρύς, αλλά γίνεται ογκώδης εξαρτάται από το θέμα και τις προσθήκες που χρησιμοποιείτε. Επίσης, είναι απαραίτητο να βελτιστοποιήσετε την απόδοση του ιστότοπού σας για καλύτερη κατάταξη αναζήτησης και μετατροπή. Οι παραπάνω τεχνικές είναι εύκολο να ακολουθηθούν, αλλά δεν πρέπει να σταματήσετε εκεί.
Θα πρέπει επίσης να εξετάσετε το ενδεχόμενο να χρησιμοποιήσετε ένα CDN για την προσωρινή αποθήκευση και την παράδοση περιεχομένου πιο γρήγορα στους χρήστες σας, παγκοσμίως. Υπάρχουν πολλά, αλλά θα συνιστούσα να δοκιμάσετε το SUCURI που προσφέρει CDN και ασφάλεια, και τα δύο.