Ποια είναι η χρήση της προφόρτωσης ιστοσελίδων; Προ-ανάκτηση ιστοσελίδας προφόρτωση τεχνολογίας instant.page

Η ταχύτητα φόρτωσης της ιστοσελίδας θα σας επηρεάσειΗλεκτρονικό εμπόριοιστοσελίδα στη μηχανή αναζήτησηςSEOΣειρά κατάταξης.

Τι είναι η προφόρτωση ιστοσελίδων;

Υπάρχει μια τεχνική που ονομάζεται prefetch, η οποία είναι στην πραγματικότητα μια τεχνική προφόρτωσης.

• Όταν ένας χρήστης επισκέπτεται σκόπιμα μια σελίδα, το πρόγραμμα περιήγησης προφορτώνει τη σελίδα.
• Όταν ο χρήστης κάνει πραγματικά κλικ στον σύνδεσμο, ο χρήστης διαβάζει απευθείας το περιεχόμενο της σελίδας από την προφορτωμένη κρυφή μνήμη και μειώνει τον χρόνο φόρτωσης της σελίδας.
• Η Amazon και άλλοι έχουν διαπιστώσει ότι η καθυστέρηση των 100 χιλιοστών του δευτερολέπτου αντιπροσωπεύει το 1% των πωλήσεων, αλλά η καθυστέρηση στον Ιστό είναι δύσκολο να ξεπεραστεί.

Προανάκτηση ιστοσελίδαςΠοια είναι η χρήση της προφόρτισης;

Το instant.page χρησιμοποιεί άμεση προφόρτωση - προφορτώνει τη σελίδα πριν ο χρήστης κάνει κλικ στο ▼

• Προτού ο χρήστης κάνει κλικ στον σύνδεσμο, τοποθετείται πάνω από τον σύνδεσμο.
• Όταν ο χρήστης αιωρείται για 65 ms, θα έχει την ευκαιρία να κάνει κλικ στον σύνδεσμο, επομένως το instant.page αρχίζει να προφορτώνεται σε αυτό το σημείο, με μέσο όρο πάνω από 300 ms για προφόρτωση της σελίδας.
• Στις κινητές συσκευές, οι χρήστες αρχίζουν να αγγίζουν την οθόνη τους πριν από την κυκλοφορία, απαιτώντας κατά μέσο όρο 90 ms για να προφορτώσουν τη σελίδα.

Η Prefetch κάνει τις ιστοσελίδες να φορτώνουν πιο γρήγορα

• Ο ανθρώπινος εγκέφαλος χρειάζεται λιγότερο από 100 χιλιοστά του δευτερολέπτου για να αντιληφθεί μια ενέργεια αμέσως.
• Επομένως, η τεχνολογία προφόρτωσης instant.page μπορεί να κάνει τον ιστότοπό σας να αισθάνεται άμεσο ακόμα και σε 3G (υποθέτοντας ότι η ταχύτητα απόδοσης της σελίδας σας είναι γρήγορη).

Πώς να λύσετε την αργή φόρτωση των ιστοσελίδων;

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

• Χρησιμοποιεί παθητικούς ακροατές συμβάντων για να διατηρεί τις σελίδες σας ομαλές.
• Δεν είναι προφορτωμένο όταν ο χρήστης ενεργοποιεί την προστασία δεδομένων (από την έκδοση 1.2.2).
• Είναι 1 kB και φορτώνει μετά από όλα τα άλλα.Είναι δωρεάν και ανοιχτού κώδικα (άδεια MIT).

Ποιο είναι το αποτέλεσμα της προφόρτωσης της ιστοσελίδας Prefetch προφόρτωση του instant.page;

Μετά τη δοκιμή της προσθήκης του κώδικα instant.page, η βελτίωση στην ταχύτητα πρόσβασης στον ιστότοπο είναι ακόμα σχετικά μεγάλη.

• Από προεπιλογή θα φιλτράρει για προφόρτωση μόνο συνδέσμων αυτού του ιστότοπου και δεν θα φορτώνει συνδέσμους από άλλους ιστότοπους.
• Όταν το ποντίκι κάνει κλικ στον σύνδεσμο του άρθρου στα αριστερά για περισσότερα από 65 ms, το Δίκτυο θα προφορτώσει τη σελίδα του άρθρου.
• Όταν αιωρείται για λιγότερο από 65 ms, δεν εκτελείται προφόρτωση (κόκκινο μέρος) ▼

Η χρήση του instant.page θα αυξήσει σημαντικά το PV και τον όγκο αιτημάτων του ιστότοπού σας:

• Ένας φίλος είπε ότι ο μέσος αριθμός επισκέψεων ανά επίσκεψη ήταν 13.84.
• Μετά τη χρήση, ο κατά κεφαλήν αριθμός επισκέψεων ανήλθε στις 17.43, που ισοδυναμεί με άνοιγμα 4 επιπλέον σελίδων ανά άτομο.

Σημείωση:

• Θα πρέπει να σημειωθεί ότι οι blogger που χρησιμοποιούν CDN επί πληρωμή και ανοιχτά CDN πλήρους ιστότοπου θα πρέπει να το κάνουν με προσοχή.
• Αλλά μην ανησυχείτε, η προφόρτωση φορτώνει μόνο σελίδες html, εικόνες και άλλα αρχεία όχι, επομένως δεν θα υπάρξει μεγάλη απώλεια επισκεψιμότητας.

Πώς να χρησιμοποιήσετε την τεχνολογία προφόρτωσης ιστοσελίδων;

Στην πραγματικότητα, υπάρχει ένα χαρακτηριστικό rel στην ετικέτα συνδέσμου του html5, ένα από τα οποία είναι το prefetch, αλλά ο αριθμός των καταναλωτών είναι μικρός.

Η instant.page που παρουσιάζεται σε αυτό το άρθρο είναι μια δέσμη ενεργειών που χρησιμοποιεί αυτήν την τεχνική.

• Αυτό το σενάριο θα κρίνει με βάση το πόσο καιρό ο χρήστης τοποθετεί το ποντίκι πάνω από τη σύνδεση.
• Όταν φτάσει τα 65 ms, ο χρήστης έχει μισές πιθανότητες να ανοίξει τον σύνδεσμο και το Instant.page προφορτώνει αυτήν τη σελίδα.

Προφόρτωση κώδικα σεναρίου JS ιστοσελίδας

1) Παρέχετε επίσημα σενάρια JS με επιτάχυνση Cloudflare ▼

Η χρήση του instant.page είναι πολύ απλή, απλά προσθέστε τον παρακάτω κώδικα στον ιστότοπό σαςΛίγο πριν την ετικέτα.

<script src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBz虚ni砖用wang络kLHw"></script>

2) Αυτοφιλοξενούμενη ελευθερίαChen WeiliangΠροσφορά ▼

• Το σενάριο βρίσκεται στον διακομιστή, Instantclick-1.2.2.js, οπότε δεν χρειάζεται να ανησυχείτε για την επιβράδυνση των πραγμάτων. 

Προσθέστε τον παρακάτω κώδικα στον ιστότοπό σαςΛίγο πριν την ετικέτα:

<script src="https://img.chenweiliang.com/javascript/instantpage.js" type="module"></script>