Μειώστε τα Http Requests

To 80% του χρόνου ανταπόκρισης του περιηγητή καταναλώνετε στα Http Requests. Το μεγαλύτερο μέρος αυτού του χρόνου καταναλώνετε στο κατέβασμα όλων των στοιχείων μιας σελίδας: εικόνες, stylesheets, scripts, Flash, κα.

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

Ένας τρόπος για να μειώσετε τον αριθμό των στοιχείων μιας σελίδας είναι να απλοποιήσετε τον σχεδιασμό της. Υπάρχει όμως τρόπος να δημιουργήσετε ιστοσελίδες ποιο απλά σχεδιασμένες με ποιο πλούσιο περιεχόμενο ενώ παράλληλα έχετε και καλύτερο χρόνο; Ακολουθούν μερικές τεχνικές για να μειώσετε τα Http Requests, με τις οποίες μπορείτε να έχετε και πλούσιο σχεδιασμό.

Συνδυασμένα αρχεία

Τα συνδυασμένα αρχεία είναι ένας τρόπος για να μειώσετε τον αριθμό των Http Request συνδυάζοντας το περιεχόμενο όλων των αρχείων σεναρίων (πχ. Javascript) σε ένα αρχείο, και κάνοντας το ίδιο και με τα αρχεία stylesheet. Αυτή η διαδικασία σε ορισμένες περιπτώσεις είναι πραγματική πρόκληση, ειδικά όταν τα σενάρια ή οι κανόνες μορφοποίησης διαφέρουν από σελίδα σε σελίδα, αλλά κάνοντας αυτή τη διαδικασία κατά την δημιουργία μιας ιστοσελίδας επιταχύνετε το κατέβασμα της σελίδας.

CSS Sprites

Τα CSS Sprites είναι ο ιδανικός τρόπος για να μειώσετε τον αριθμό των Http Requests. Συνδυάστε τις εικόνες φόντου σε ένα αρχείο εικόνας, και στη συνέχεια χρησιμοποιήστε τις ιδιότητες μορφοποίησης των CSS background-image και background-position για να προβάλλετε το επιθυμητό τμήμα της εικόνας.

Image Maps

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

Inline images

Τα inline images χρησιμοποιούν data: URL Schema για να ενσωματώσουν τα δεδομένα της εικόνας στα δεδομένα της σελίδας. Αυτό μπορεί να αυξάνει το συνολικό μέγεθος της ιστοσελίδας. Ο συνδυασμός όμως των inline images στα αρχεία CSS που αποθηκεύονται προσωρινά στον περιηγητή του χρήστη μπορούν να μειώσουν το σύνολο των Http Request και έτσι αποφεύγετε και τα μεγάλα αρχεία ιστοσελίδων. Να σημειωθεί πως τα inline images δεν υποστηρίζονται ακόμα από όλους τους περιηγητές.

Η μείωση των Http Request στην ιστοσελίδας σας είναι το σημείο από το οποίο θα πρέπει να ξεκινήσετε. Αυτός είναι ο ποιο σημαντικός κανόνας για να βελτιώσετε την ταχύτητα της σελίδας σας για τους όσους επισκέπτονται για πρώτη φορά τη σελίδα σας. Όπως περιγράφετε στο ιστολόγιο του Tenni Theurer’s “Browser Cache Usage – Exposed!”, το 40 – 60% από τους καθημερινούς χρήστες της ιστοσελίδας σας, έρχεται με την cache του κενή.

Πηγή : Yahoo!

Περισσότερα για τον CorfuGmr

Όλα τα άρθρα

CorfuGmr

Ονομάζομαι Νίκος και ασχολούμαι με το internet και την κατασκευή ιστοσελίδων από το 1998. Σήμερα, μετά από 12 χρόνια γεμάτα με ενημέρωση, εκπαίδευση και εξάσκηση έχω ανεβάσει σε ένα άλλο επίπεδο τις γνώσεις μου και τις τεχνικές μου. Στα άρθρα μου προσπαθώ να σας δείξω τα μικρά, αλλά σημαντικά πράγματα που με έχουν ανεβάσει σε αυτό το επίπεδο.

Σχόλια

Αφήστε ένα σχόλιο

RSS για τα σχόλια σε αυτό το άρθρο. TrackBack URL