Τι κάνει πραγματικά ένα site γρήγοροΤι κάνει πραγματικά ένα site γρήγορο

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

1. Εικόνες

Είναι το πρώτο που ελέγχεις και βγαίνει σωστό πιο συχνά από όλα τα υπόλοιπα μαζί. Μια φωτογραφία hero εξαγμένη σε 4000 pixel πλάτος και σερβιρισμένη ως JPEG 3MB σε ένα κινητό είναι ακόμα, το 2026, ο συνηθέστερος λόγος που ένα site μοιάζει αργό. Κάθε εικόνα πρέπει να σερβίρεται περίπου στο μέγεθος που εμφανίζεται, σε σύγχρονη μορφή, με δηλωμένο πλάτος και ύψος ώστε η διάταξη να μην αναπηδά κατά τη φόρτωση.

2. Γραμματοσειρές

Οι webfonts μπλοκάρουν το κείμενο από το να ζωγραφιστεί. Δύο οικογένειες σε τέσσερα βάρη η καθεμία, φορτωμένες από ξένο domain, είναι οκτώ διαδρομές πριν μπορέσει ο επισκέπτης να διαβάσει έναν τίτλο. Φιλοξένησε μόνος σου τα δύο βάρη που πραγματικά χρησιμοποιείς, περιόρισέ τα στους χαρακτήρες που χρειάζεσαι, και δώσε τους fallback αρκετά κοντινό σε μετρικές ώστε η εναλλαγή να μη σπρώχνει τη σελίδα.

3. Scripts τρίτων

Analytics, ένα chat widget, ένα cookie banner, ένα heatmap, δύο pixels και ένα σήμα αξιολογήσεων. Το καθένα μπήκε για καλό λόγο από κάποιον που δεν σκεφτόταν τα άλλα έξι. Τα scripts τρίτων είναι η μία κατηγορία όπου το κόστος είναι αόρατο στην ανάπτυξη — είναι γρήγορα στο μηχάνημά σου, στη σύνδεσή σου, με ζεστή cache — και βάναυσο σε κινητό με δεδομένα. Έλεγξέ τα κάθε χρόνο και σβήσε όσα δεν έχει κοιτάξει κανείς.

4. Δουλειά που δεν ζήτησε ο επισκέπτης

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

5. Ο server

Φθηνό shared hosting χωρίς caching, ένα ερώτημα στη βάση ανά component, και μια διεργασία PHP που ξεκινά από το μηδέν σε κάθε αίτημα θα νικήσουν οποιαδήποτε φροντίδα στο front-end. Αν το πρώτο byte θέλει ένα δευτερόλεπτο, τίποτα από όσα γίνονται μετά δεν σώζει τη σελίδα.

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

Πώς να το ελέγξεις σωστά

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