Η βελτιστοποίηση της απόδοσης δεν είναι έργο που γίνεται μία φορά. Η απόδοση είναι συνεχής πρακτική.
Ροή εργασίας σημαίνει: η ομάδα βλέπει τα δεδομένα απόδοσης κάθε εβδομάδα. Η ομάδα συζητά την απόδοση στις καθημερινές συναντήσεις. Η ομάδα σκέφτεται την απόδοση όταν γράφει κώδικα. Η ομάδα γιορτάζει τις βελτιώσεις.
Χωρίς ροή εργασίας: η απόδοση πέφτει με τον καιρό. Η ομάδα δεν σκέφτεται την απόδοση μέχρι να χαλάσει η ιστοσελίδα.
Με ροή εργασίας: η απόδοση βελτιώνεται με τον καιρό. Η ομάδα χτίζει κουλτούρα απόδοσης. Η απόδοση εκτιμάται.
Εβδομαδιαίο τελετουργικό απόδοσης
Κάθε Δευτέρα πρωί: η ομάδα βλέπει την αναφορά απόδοσης.
Η αναφορά δείχνει: τι βελτιώθηκε την περασμένη εβδομάδα, τι χειροτέρεψε την περασμένη εβδομάδα, τι θέλει προσοχή αυτή την εβδομάδα.
Συζήτηση της ομάδας: γιατί χειροτέρεψε το LCP της σελίδας ολοκλήρωσης αγοράς. Φταίει νέος κώδικας. Χρειάζεται έλεγχος.
Αποτέλεσμα: καταγράφονται ενέργειες. Οι βελτιώσεις απόδοσης μπαίνουν στο sprint.
Παράδειγμα πραγματικού εβδομαδιαίου τελετουργικού:
- Δευτέρα 10 π.μ.: συνάντηση αναθεώρησης απόδοσης
- Αναθεώρηση μετρήσεων: το LCP της αρχικής βελτιώθηκε κατά 0,2 δευτερόλεπτα (καλό), το INP της σελίδας προϊόντος χειροτέρεψε κατά πενήντα χιλιοστά του δευτερολέπτου (έλεγχος)
- Ανάλυση αιτίας: η σελίδα προϊόντος φόρτωσε νέα λειτουργία (μηχανή συστάσεων). Η λειτουργία πρόσθεσε JavaScript που ανέβασε το INP.
- Ενέργειες: καθυστέρησε το JavaScript της μηχανής συστάσεων, βελτιστοποίησε τον κώδικα της λειτουργίας
- Υπεύθυνος: ο μηχανικός που ανέλαβε τη διόρθωση
- Προθεσμία: ανάπτυξη την Τετάρτη
Η απόδοση μέσα στη ροή ανάπτυξης
Πριν βγάλει μια λειτουργία: ο μηχανικός μετράει την επίδραση στην απόδοση.
Η λειτουργία προσθέτει δυνατότητες. Προσθέτει και κώδικα. Ο κώδικας μεγαλώνει το πακέτο. Το μεγαλύτερο πακέτο μπορεί να χειροτερέψει την απόδοση.
Πλαίσιο: όριο απόδοσης (performance budget). Η λειτουργία δεν πρέπει να το ξεπερνά.
Παράδειγμα: νέα λειτουργία στη σελίδα ολοκλήρωσης αγοράς. Όριο: να μην προσθέτει πάνω από είκοσι kilobytes στο πακέτο JavaScript. Ο μηχανικός υλοποιεί τη λειτουργία. Η λειτουργία προσθέτει είκοσι πέντε kilobytes. Η λειτουργία ξεπερνά το όριο. Ο μηχανικός πρέπει να βελτιστοποιήσει: αφαιρεί κώδικα που δεν χρησιμοποιείται, σπάζει το πακέτο, καθυστερεί κώδικα. Ο μηχανικός μειώνει τη λειτουργία στα είκοσι kilobytes. Η λειτουργία εγκρίνεται.
Πραγματικό παράδειγμα: υλοποίηση μηχανής συστάσεων προϊόντων
Λειτουργία: δείξε εξατομικευμένες συστάσεις προϊόντων στη σελίδα προϊόντος.
Όριο απόδοσης: να μην προσθέτει πάνω από πενήντα kilobytes στο πακέτο.
Αρχική υλοποίηση: πενήντα kilobytes. Ακριβώς στο όριο.
Δοκιμή: μέτρησε LCP και INP.
- Το LCP ανεβαίνει από δύο σε 2,3 δευτερόλεπτα (απαράδεκτο, ξεπερνά το όριο)
- Το INP ανεβαίνει από 150 σε 300 χιλιοστά του δευτερολέπτου (απαράδεκτο, ξεπερνά το όριο)
Βελτιστοποίηση από τον μηχανικό: lazy load στις συστάσεις κάτω από το ορατό τμήμα, καθυστέρηση της φόρτωσης δεδομένων συστάσεων μέχρι να γίνει διαδραστική η σελίδα.
Νέα υλοποίηση: ίδιο μέγεθος πενήντα kilobytes, αλλά:
- Το LCP γυρίζει στα δύο δευτερόλεπτα (κάτω από το όριο)
- Το INP γυρίζει στα 170 χιλιοστά του δευτερολέπτου (κάτω από το όριο)
Η λειτουργία εγκρίνεται: οι απαιτήσεις απόδοσης πληρούνται.
Αναφορά προς τη διοίκηση
Μηνιαία αναφορά προς τη διοίκηση: τάσεις απόδοσης και επίδραση στην επιχείρηση.
Δομή αναφοράς:
- Στόχοι απόδοσης και πρόοδος
- Σύγκριση με τον ανταγωνισμό (πώς στεκόμαστε απέναντί του)
- Επίδραση στην επιχείρηση (έσοδα από τις βελτιώσεις απόδοσης)
- Επόμενη προτεραιότητα (τι βελτιστοποιούμε στη συνέχεια)
Παράδειγμα πραγματικής μηνιαίας αναφοράς προς την ανώτατη διοίκηση:
- Στόχος: ενενήντα τοις εκατό των χρηστών με LCP κάτω από 2,5 δευτερόλεπτα
- Πρόοδος: τώρα ογδόντα επτά τοις εκατό (από ογδόντα πέντε τοις εκατό τον προηγούμενο μήνα)
- Χρονοδιάγραμμα: στο σωστό δρόμο για τον στόχο σε δύο μήνες
- Θέση απέναντι στον ανταγωνισμό: το διάμεσο LCP των ανταγωνιστών είναι δύο δευτερόλεπτα, το δικό μας LCP είναι δύο δευτερόλεπτα (στη διάμεσο, ανταγωνιστικό)
- Επίδραση στην επιχείρηση: οι βελτιώσεις απόδοσης του προηγούμενου μήνα αύξησαν την ολοκλήρωση αγορών κατά 0,5 τοις εκατό. Σε εκατό χιλιάδες μηνιαίους επισκέπτες, αυτό κάνει πεντακόσιες επιπλέον μετατροπές. Με αξία παραγγελίας εκατό δολάρια, είναι πενήντα χιλιάδες δολάρια επιπλέον έσοδα τον μήνα. Εξακόσιες χιλιάδες δολάρια τον χρόνο.
- Επόμενη προτεραιότητα: βελτιστοποίηση για κινητό (το LCP στο κινητό είναι ένα δευτερόλεπτο πιο αργό από τον υπολογιστή, ευκαιρία να βελτιωθεί το ποσοστό μετατροπής στο κινητό)
Προσλήψεις για κουλτούρα απόδοσης
Πρόσλαβε μηχανικούς που νοιάζονται για την απόδοση. Ερώτηση συνέντευξης: πες μου για μια βελτιστοποίηση απόδοσης που υλοποίησες.
Πρόσλαβε product managers που εκτιμούν την απόδοση. Η απόδοση βελτιώνει την εμπειρία χρήστη και το ποσοστό μετατροπής. Οι product managers πρέπει να ξέρουν την επίδραση στην επιχείρηση.
Χτίσε κουλτούρα ομάδας όπου η απόδοση εκτιμάται. Γιόρτασε τις νίκες απόδοσης. Αναγνώρισε τον μηχανικό που βελτίωσε το LCP κατά 0,5 δευτερόλεπτα.
Πραγματικό παράδειγμα: προσλήψεις για κουλτούρα απόδοσης.
Ερώτηση συνέντευξης σε υποψήφιο μηχανικό: περίγραψε μια φορά που βελτιστοποίησες κώδικα για απόδοση. Ποιο ήταν το πρόβλημα. Πώς μέτρησες τη βελτίωση. Ποια ήταν η επίδραση στην επιχείρηση.
Καλή απάντηση: είχαμε ένα αργό endpoint API που έπαιρνε δύο δευτερόλεπτα. Οι χρήστες παραπονιούνταν για αργή εγγραφή. Έκανα profiling στον κώδικα και βρήκα ένα ακριβό ερώτημα στη βάση. Πρόσθεσα caching. Ο χρόνος απόκρισης έπεσε στα διακόσια χιλιοστά του δευτερολέπτου. Η ολοκλήρωση εγγραφής αυξήθηκε κατά δύο τοις εκατό. Πενήντα επιπλέον πελάτες τον μήνα. Διακόσιες πενήντα χιλιάδες δολάρια επιπλέον ετήσια έσοδα.
Η απάντηση δείχνει: τεχνική κατανόηση (profiling, caching), μέτρηση (πριν και μετά), επιχειρηματική σκέψη (επίδραση στις εγγραφές και στα έσοδα).
Πρόσλαβε αυτόν τον μηχανικό. Σκέφτεται την απόδοση και την επιχείρηση.
Συχνές ερωτήσεις
Πώς παρακινούμε την ομάδα να βάζει προτεραιότητα στην απόδοση;
Σύνδεσε την απόδοση με τις μετρήσεις της επιχείρησης. Δείξε ότι μία βελτίωση ενός τοις εκατό στην απόδοση ισοδυναμεί με αύξηση ενός τοις εκατό στη μετατροπή. Υπολόγισε την επίδραση στα έσοδα. Δείξε το κόστος της βελτιστοποίησης απέναντι στα έσοδα που κερδίζεις. Οι μηχανικοί νοιάζονται για την επίδραση. Η απόδοση έχει μετρήσιμη επίδραση. Οι μηχανικοί θα της δώσουν προτεραιότητα. Με τον δημιουργό ιστοσελίδων του WEMASY, μπορείς να το στήσεις απευθείας στην ιστοσελίδα σου.
Η βελτιστοποίηση απόδοσης πρέπει να είναι ξεχωριστή ομάδα ή μέρος όλων των ομάδων;
Μέρος όλων των ομάδων. Κάθε μηχανικός πρέπει να σκέφτεται την απόδοση. Μια ξεχωριστή ομάδα απόδοσης γίνεται εμπόδιο. Η κατανεμημένη ευθύνη είναι καλύτερη. Κάθε μηχανικός είναι υπεύθυνος για την απόδοση του κώδικά του. Ο υπεύθυνος μηχανικών κρατά την ομάδα υπόλογη.
Πώς ισορροπούμε τις νέες λειτουργίες με τη βελτιστοποίηση απόδοσης;
Η απόδοση είναι λειτουργία. Η νέα λειτουργία συν η επίδραση στην απόδοση είναι το συνολικό κόστος. Βάλε προϋπολογισμό και για τα δύο. Παράδειγμα: η νέα λειτουργία κοστίζει ένα sprint. Η λειτουργία κοστίζει και μισό sprint για βελτιστοποίηση της απόδοσης. Το συνολικό κόστος είναι ενάμισι sprint. Κράτα χρόνο και για τα δύο. Η λειτουργία και η απόδοση βγαίνουν μαζί.
Τι κάνουμε αν η διοίκηση δεν ενδιαφέρεται για την απόδοση;
Δείξε την επίδραση στην επιχείρηση. Μία βελτίωση ενός τοις εκατό στη μετατροπή ισοδυναμεί με πενήντα χιλιάδες δολάρια τον μήνα (σε ένα τυπικό e-shop). Η διοίκηση καταλαβαίνει τα έσοδα. Η βελτίωση της απόδοσης είναι βελτίωση των εσόδων. Η διοίκηση θα ενδιαφερθεί.
Πόσο καιρό παίρνει να χτιστεί κουλτούρα απόδοσης;
Τρεις έως έξι μήνες. Πρώτος μήνας: στήσε μετρήσεις και πίνακα ελέγχου. Δεύτερος μήνας: ξεκινούν οι εβδομαδιαίες αναθεωρήσεις και η ομάδα ευαισθητοποιείται. Τρίτος μήνας: η ομάδα αρχίζει να σκέφτεται την απόδοση στον κώδικα. Έξι μήνες: η απόδοση είναι μέρος του DNA της ομάδας. Οι νέοι μηχανικοί μαθαίνουν την κουλτούρα απόδοσης από την πρώτη μέρα.
Πώς διατηρούμε την κουλτούρα απόδοσης όσο μεγαλώνει η εταιρεία;
Κατάγραψε τις πρακτικές. Μύησε τους νέους μηχανικούς στην κουλτούρα απόδοσης. Πρώτη μέρα: δείξε τον πίνακα απόδοσης. Πρώτη εβδομάδα: ανάθεσε μια εργασία βελτίωσης απόδοσης. Πρώτος μήνας: όρισε στόχο απόδοσης. Οι νέοι μηχανικοί μαθαίνουν την κουλτούρα. Η κουλτούρα διατηρείται.