Το παρακάτω άρθρο δημοσιεύθηκε αρχικά στο Hackernoon.
.Οι στατικοί ιστότοποι έχουν μεγάλη επιτυχία σήμερα. Υπάρχουν πολλά πλεονεκτήματα στο να έχετε τον ιστότοπό σας στατικό, κυρίως απόδοση και ασφάλεια. Θα αντέξουν όμως οι στατικές τοποθεσίες στη δοκιμασία του χρόνου; Ποια είναι η πραγματική εμπειρία από την ανάπτυξη και τη συντήρηση ενός στατικού ιστότοπου; Και πώς στέκεται σε σύγκριση με τους δυναμικούς ιστότοπους που κατασκευάζονται με παραδοσιακά CMS όπως το WordPress; Είχα το προνόμιο να μιλήσω με τον Adam Judd, διευθύνοντα σύμβουλο της Discover Digital, ενός ψηφιακού πρακτορείου με έδρα το Ηνωμένο Βασίλειο και κύριο άξονα την ψηφιακή τεχνολογία, για το πώς επανασχεδίασαν τον δικό τους ιστότοπο χρησιμοποιώντας τη μεθοδολογία JAMstack. Αυτό περιλαμβάνει το πλαίσιο Vue.js, Nuxt.js static site generator και ένα Headless CMS Kontent.ai.
Ondrej: Άνταμ, ξέρω ότι είχες μια υπάρχουσα ιστοσελίδα την οποία αποφάσισες να επανασχεδιάσεις. Μπορείς να εξηγήσεις τα κίνητρά σου;
Adam: Ο αρχικός μας ιστότοπος είχε κατασκευαστεί σε ένα παραδοσιακό CMS το 2014, οπότε μας αναλογούσε μια ανανέωση. Ειδικά για ένα ψηφιακό πρακτορείο, είναι σημαντικό να έχετε κάτι που χρησιμοποιεί τις τελευταίες τεχνολογίες και προβάλλει τις δυνατότητές σας.
Ondrej: Αλλά υπάρχουν τόσες πολλές νέες τεχνολογίες και επιλογές για την κατασκευή ιστότοπων εκεί έξω. Πώς επιλέξατε αυτή που λειτουργεί καλά για εσάς;
Adam: Αρχικά μας τράβηξε η ιδέα να ακολουθήσουμε την οδό της πλήρους απόδοσης από την πλευρά του διακομιστή για τον ιστότοπό μας, αλλά τελικά, η διαμόρφωση του διακομιστή μας και ο τρόπος που φιλοξενούμε άλλους ιστότοπους σήμαινε ότι η γεννήτρια στατικών ιστότοπων ήταν καλύτερη επιλογή για τις ανάγκες μας. Υπήρχε λιγότερη πολυπλοκότητα στην πλευρά του διακομιστή, η ταχύτητα εξυπηρέτησης των σελίδων αυξάνεται, καθώς το περιεχόμενο έχει ήδη δημιουργηθεί, και οι δυνατότητες SEO μπορούν να διαχειριστούν ευκολότερα.
Ondrej: Μπορείτε να περιγράψετε τι είναι μια γεννήτρια στατικών τοποθεσιών και ποια είναι τα πλεονεκτήματά της;
Adam: Η βασική ιδέα πίσω από τις γεννήτριες στατικών ιστότοπων είναι να πάρουμε τη δυναμική υλοποίηση front-end περιεχομένου του ιστότοπου, να συνδυάσουμε αυτά τα δύο και να αποθηκεύσουμε το αποτέλεσμα σε στατικά, φυσικά αρχεία. Αυτή η προσέγγιση αποφέρει οφέλη σε πολλαπλά μέτωπα - ο διακομιστής ιστού σας παρέχει μόνο στατικά αρχεία, ενώ οι επισκέπτες σας εκπλήσσονται από την ταχύτητα περιήγησης στον ιστότοπό σας. Τα στατικά αρχεία είναι επίσης δύσκολο να παραβιαστούν, καθώς συνήθως δεν περιέχουν δυναμική λειτουργικότητα που θα μπορούσε να παραβιαστεί.
Ondrej: Λοιπόν, τι χρειαζόσασταν για να δημιουργήσετε τον στατικό ιστότοπο; Ποιες τεχνολογίες και πλαίσια επιλέξατε;
Adam: Η ιστοσελίδα μας έχει κατασκευαστεί με τη χρήση του Nuxt.js, ενός πλαισίου που έχει σχεδιαστεί για τη δημιουργία εφαρμογών Vue.js, με έμφαση στην απόδοση του UI και την αφαίρεση της διανομής πελάτη/εξυπηρετητή. Αυτό που μας τράβηξε στο Vue.js, ειδικότερα, ήταν ένας συνδυασμός πραγμάτων.
Πρώτα απ' όλα, η Vue είναι εξαιρετικά γρήγορη και ελαφριά. Με μέγεθος περίπου 20KB, το πλαίσιο έχει εξαιρετικά μικρά γενικά έξοδα, τα οποία επιτρέπουν στις εφαρμογές να επιτυγχάνουν μέγιστη απόδοση. Δεύτερον, το Vue.js βασίζεται σε κλασικές τεχνολογίες ιστού, πράγμα που σημαίνει ότι η καμπύλη εκμάθησης για την ανάπτυξη ήταν μικρή και ο χρόνος παράδοσης επίσης. Στον πυρήνα του, το Vue.js είναι απλό, εξαιρετικά ενοποιητικό και γρήγορο. Αναζητούσαμε ένα πλαίσιο που θα μας επέτρεπε να δημιουργήσουμε έναν αποτελεσματικό, σύγχρονο ιστότοπο σε σύντομο χρονικό διάστημα. Το Vue.js ταίριαζε απόλυτα στο σχέδιο.
Το nuxt.js ήταν η μόνη πρακτική λύση για τους περισσότερους ιστότοπους, δεδομένων των περιορισμών SEO του Vue.js.
Ondrej: Υποθέτω ότι χρησιμοποιείτε επίσης κάποιο σύστημα για τη διαχείριση του περιεχομένου, σωστά;
Adam: Ναι, επιλέξαμε το headless CMS επειδή, όσον αφορά τα βήματα για να ξεκινήσετε με το σχεδιασμό των τύπων περιεχομένου και τον πληθυσμό περιεχομένου, ήταν σίγουρα πιο γρήγορο ως σημείο εκκίνησης. Δεν χρειάστηκε να εγκαταστήσουμε κάπου το παραδοσιακό CMS ή να εμβαθύνουμε πολύ στους τύπους σελίδων και τη ρύθμισή τους. Σκεφτήκαμε να εισάγουμε όλο το περιεχόμενο από τον υπάρχοντα ιστότοπο ως σημείο εκκίνησης. Παρόλο που υπάρχει διαθέσιμο API για να γίνει αυτό, αποφασίσαμε απλώς να ξεκινήσουμε από την αρχή και να κάνουμε copy-paste ό,τι θέλαμε να κρατήσουμε από τον υπάρχοντα ιστότοπο.
Από τη σκοπιά του συντάκτη, είναι πολύ καλό, πολύ απλό.
Από τη σκοπιά του προγραμματιστή, το API προς το Kontent.ai, το οποίο είναι το headless CMS που χρησιμοποιήσαμε, είναι πολύ εύκολο στη χρήση. Δεν είχαμε πραγματικά κανένα πρόβλημα με το να φέρουμε τα δεδομένα όπου θέλαμε. Να τα περιορίσουμε, να τα παραγγείλουμε, απολύτως εύκολο στη χρήση.
Ondrej: Είναι ο ιστότοπος ενσωματωμένος με άλλες υπηρεσίες τρίτων εκτός από το headless CMS;
Adam: Η μόνη άλλη υπηρεσία τρίτου μέρους που χρησιμοποιούμε είναι η TypeForm. Τη χρησιμοποιούμε για τη φόρμα επικοινωνίας στη σελίδα επικοινωνίας μας. Ήταν η πιο γρήγορη επιλογή για να βγάλουμε τον ιστότοπο προς τα έξω.
Ondrej: Έτσι, ο ιστότοπος είναι στατικός, αλλά από καιρό σε καιρό σίγουρα θα υπάρχουν ενημερώσεις περιεχομένου ή αλλαγές στην υλοποίηση. Πώς αναγεννάτε τον ιστότοπο όταν συμβαίνει αυτό;
Adam: Το Nuxt.js έρχεται με μια επιλογή ανάπτυξης που ονομάζεται 'nuxt generate' την οποία καλούμε σε καθημερινή βάση από τον CI/CD διακομιστή μας, Team City. Μόλις οι σελίδες έχουν δημιουργηθεί στατικά και η εφαρμογή έχει κατασκευαστεί σε ένα πακέτο έκδοσης, το περνάμε στο εργαλείο διαχείρισης εκδόσεων Octopus Deploy για να το προωθήσουμε στον διακομιστή μας.
Όποτε κάνουμε μια αλλαγή στην ανάπτυξη, τη δεσμεύουμε σε ένα git repository και μέσω webhook ειδοποιούμε το TeamCity να ξεκινήσει την ίδια διαδικασία.
Ondrej: Πόσο καιρό είναι σε λειτουργία ο νέος σας ιστότοπος; Έχετε ακούσει κάποιο σχόλιο από τους πελάτες σας γι' αυτόν;
Adam: Όλα λειτουργούν καλά από την πρώτη μας εγκατάσταση πριν από μερικές εβδομάδες και δεν έχω κανένα παράπονο. Η χρήση του στατικού ιστότοπου σήμαινε ότι μπορέσαμε να διαχειριστούμε πιο εύκολα τα αποτελέσματα SEO μας και τα αποτελέσματα ήταν εξαιρετικά. Αυτό ήταν πάντα ένας σημαντικός παράγοντας στη μέτρηση της θεωρούμενης επιτυχίας μας.
Ondrej: Με βάση την εμπειρία σας, θα συνιστούσατε τις γεννήτριες στατικού ιστότοπου σε οποιονδήποτε ή είναι καλή επιλογή μόνο για συγκεκριμένους ιστότοπους;
Adam: Δεν υπάρχει προσέγγιση "ένα μέγεθος ταιριάζει σε όλους" για την ανάπτυξη ιστοσελίδων, αλλά σίγουρα, οι γεννήτριες στατικών τοποθεσιών είναι μια επιλογή που μπορεί και πρέπει να εξεταστεί κατά την κατασκευή εφαρμογών ιστού. Όλα εξαρτώνται από το περιεχόμενό σας και από το πόσο συχνά πρέπει να ενημερώνετε το περιεχόμενο του ιστότοπού σας. Εάν έχετε δυναμικό, διαρκώς μεταβαλλόμενο περιεχόμενο, η προσέγγιση αυτή είναι απίθανο να ταιριάζει στις ανάγκες σας. Εάν το περιεχόμενό σας είναι σταθερό και οι ενημερώσεις μπορούν να αντιμετωπιστούν σε μια καθημερινή κατασκευή για παράδειγμα, τότε θα σας συνιστούσα να σκεφτείτε την προσέγγιση.
Μπορεί επίσης να είναι επωφελής όταν βρίσκεστε σε επίπεδο επιχείρησης και πρέπει να συνεργαστείτε με πολλά σημεία επαφής, όπως ψηφιακή σήμανση, εφαρμογές για κινητά, στατικές τοποθεσίες και περίπτερα. Γίνεται πολύ ισχυρό όταν θέλετε το μάρκετινγκ να έχει τον έλεγχο του τρόπου εκτέλεσης των εκστρατειών μάρκετινγκ. Αποκτούν τη δυνατότητα να ελέγχουν το περιεχόμενο αυτών των διαφορετικών εφαρμογών χωρίς να χρειάζεται να υποβάλλουν κάθε φορά αίτημα αλλαγής.
Ondrej: Σας ευχαριστώ Adam για όλες τις πολύτιμες πληροφορίες σας σχετικά με την κατασκευή στατικών ιστότοπων. Είμαι σίγουρος ότι υπάρχουν πολλοί άλλοι που μπορούν να μάθουν από την εμπειρία σου.
Ifigenia Arampelou
