Τάσεις τεχνολογίας ανάπτυξης ιστοσελίδων 2019

Εισαγωγή

Ο ψηφιακός μετασχηματισμός καλύπτει όλο και περισσότερους διαφορετικούς τομείς της ζωής και των επιχειρήσεων κάθε χρόνο. Εάν μια επιχείρηση θέλει να είναι ανταγωνιστική, οι συνηθισμένοι ιστότοποι πληροφοριών δεν επαρκούν πλέον, χρειάζονται εφαρμογές για κινητές συσκευές και web που όχι μόνο παρέχουν στους χρήστες πληροφορίες, αλλά και τους επιτρέπουν να εκτελούν ορισμένες λειτουργίες: λήψη ή παραγγελία αγαθών και υπηρεσιών, παροχή εργαλείων.

Τάσεις τεχνολογίας ανάπτυξης ιστοσελίδων 2019

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

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

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

Εφαρμογή μιας σελίδας

Ας ορίσουμε λίγο την ορολογία. Το Single Page Application (SPA) είναι μια εφαρμογή Ιστού της οποίας τα στοιχεία φορτώνονται μία φορά σε μία σελίδα και το περιεχόμενο φορτώνεται όπως απαιτείται. Και όταν μετακινείστε μεταξύ των ενοτήτων της εφαρμογής, η σελίδα δεν επαναφορτώνεται πλήρως, αλλά μόνο φορτώνει και εμφανίζει τα απαραίτητα δεδομένα.

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

Αν πριν από μερικά χρόνια οι εφαρμογές μιας σελίδας ουσιαστικά δεν υποστήριζαν τη βελτιστοποίηση μηχανών αναζήτησης και χρησιμοποιούνταν κυρίως για τη δημιουργία προσωπικών λογαριασμών και πάνελ διαχείρισης, σήμερα η δημιουργία μιας εφαρμογής μιας σελίδας με πλήρη υποστήριξη για βελτιστοποίηση μηχανών αναζήτησης (SEO) έχει γίνει πολύ πιο εύκολη. Χρησιμοποιώντας εφαρμογές μιας σελίδας που αποδίδονται από διακομιστή σήμερα, αυτό το πρόβλημα έχει εξαφανιστεί εντελώς. Με άλλα λόγια, πρόκειται για την ίδια εφαρμογή μιας σελίδας, αλλά με την πρώτη αίτηση, ο διακομιστής δεν δημιουργεί απλώς δεδομένα, αλλά δημιουργεί μια σελίδα HTML έτοιμη για εμφάνιση και οι μηχανές αναζήτησης λαμβάνουν έτοιμες σελίδες με όλες τις μετα-πληροφορίες και τη σημασιολογική σήμανση .

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

Το να έχετε έναν σύγχρονο και γρήγορο ιστότοπο είναι πολύ καλό, αλλά επιτρέψτε μου να σας πω ειλικρινά: δεν μπορούν εύκολα να μετατραπούν όλες οι εφαρμογές σε εφαρμογές μιας σελίδας και η μετάβαση μπορεί να είναι ακριβή! Επομένως, πρέπει να καταλάβετε ποιος χρειάζεται μια τέτοια μετάβαση και γιατί.

Για να σας βοηθήσω να καταλάβετε, στον παρακάτω πίνακα θα δώσω μερικά παραδείγματα για το πότε η ανάπτυξη ή η μετάβαση σε ένα SPA είναι κατάλληλη και δικαιολογημένη και πότε δεν είναι.

ΣΧΕΤΙΚΑ

Εάν θέλετε να φτιάξετε μια σύγχρονη, γρήγορη εφαρμογή και θέλετε να χρησιμοποιήσετε όχι μόνο την έκδοση web, αλλά και την έκδοση για φορητές συσκευές ή ακόμα και για επιτραπέζιους υπολογιστές, και όλες οι διαδικασίες και οι υπολογισμοί πραγματοποιούνται σε έναν απομακρυσμένο διακομιστή ή σε διακομιστή cloud. Επιπλέον, έτσι ώστε όλοι οι πελάτες να έχουν μία διεπαφή αλληλεπίδρασης και να μην χρειάζεται να κάνετε κάθε τροποποίηση στον κώδικα διακομιστή κατά την προσθήκη ενός νέου πελάτη.

Για παράδειγμα: κοινωνικό δίκτυο, aggregators, πλατφόρμες SaaS (λογισμικό ως υπηρεσία cloud), αγορές

Εάν έχετε ένα κατάστημα ή μια υπηρεσία ιστού, ξέρετε ότι είναι αργή και οι άνθρωποι φεύγουν, θέλετε να το κάνετε πιο γρήγορο, κατανοείτε την αξία των πελατών και είστε έτοιμοι να πληρώσετε πάνω από ένα εκατομμύριο ρούβλια για μια αναβάθμιση.

Έχετε μια εφαρμογή για κινητά που χρησιμοποιεί το API του ιστότοπου, αλλά ο ιστότοπος είναι αργός και έχει πλήρη επαναφόρτωση περιεχομένου κατά τη μετακίνηση μεταξύ σελίδων

ΚΑΤΑ

Εάν το κοινό-στόχος σας δεν χρησιμοποιεί σύγχρονα προγράμματα περιήγησης και συσκευές.

Για παράδειγμα: συγκεκριμένοι εταιρικοί τομείς, όπως η ανάπτυξη εσωτερικών συστημάτων για τράπεζες, ιατρικά ιδρύματα και εκπαίδευση.

Διεξάγετε τις κύριες δραστηριότητές σας εκτός σύνδεσης και δεν είστε έτοιμοι να παρέχετε οποιεσδήποτε υπηρεσίες στο διαδίκτυο και απλά πρέπει να προσελκύσετε πελάτες.

Εάν έχετε ένα ηλεκτρονικό κατάστημα ή μια υπηρεσία ιστού που ήδη πωλεί καλά, δεν βλέπετε εκροές πελατών ή παράπονα

Εάν έχετε μια λειτουργική εφαρμογή που δεν μπορεί να προσαρμοστεί για SPA και απλά πρέπει να ξαναγράψετε τα πάντα από την αρχή και να χρησιμοποιήσετε άλλες τεχνολογίες και δεν είστε έτοιμοι να ξοδέψετε πολλά εκατομμύρια σε αυτό.

Για παράδειγμα: Υπάρχει μια εγκιβωτισμένη τοποθεσία ή κάποιο είδος αρχαίου, μονολιθικού κώδικα γραμμένου στο σπίτι.

Προοδευτικές εφαρμογές Ιστού

Οι προοδευτικές εφαρμογές Ιστού είναι το προϊόν της κοινής εξέλιξης μιας εγγενούς εφαρμογής και ενός ιστότοπου. Ουσιαστικά, πρόκειται για μια διαδικτυακή εφαρμογή που μοιάζει και συμπεριφέρεται σαν μια πραγματική εγγενής εφαρμογή, μπορεί να λαμβάνει ειδοποιήσεις push, να λειτουργεί σε λειτουργία εκτός σύνδεσης κ.λπ. Σε αυτήν την περίπτωση, ο χρήστης δεν χρειάζεται να κατεβάσει την εφαρμογή από το AppStore ή το Google Play, αλλά απλώς να την αποθηκεύσει στην επιφάνεια εργασίας.

Ως τεχνολογία ή προσέγγιση ανάπτυξης, η PWA αναπτύσσεται από το 2015 και πρόσφατα έχει αποκτήσει τεράστια δημοτικότητα στον τομέα του ηλεκτρονικού εμπορίου.

Μερικά παραδείγματα πραγματικής ζωής:

  • πέρυσι, το ξενοδοχείο Best Western River North κατάφερε να αυξήσει τα έσοδα κατά 300% μετά την κυκλοφορία ενός νέου ιστότοπου με δυνατότητα PWA.
  • Το Arabic Avito OpenSooq.com, αφού δημιούργησε την υποστήριξη PWA στον ιστότοπό του, μπόρεσε να αυξήσει τον χρόνο επίσκεψης στον ιστότοπο κατά 25% και τον αριθμό των δυνητικών πελατών κατά 260%.
  • η διάσημη υπηρεσία γνωριμιών Tinder μπόρεσε να μειώσει την ταχύτητα φόρτωσης από 11.91 δευτερόλεπτα σε 4.69 δευτερόλεπτα, αναπτύσσοντας ένα PWA· επιπλέον, η εφαρμογή ζυγίζει 90% λιγότερο από την εγγενή αντίστοιχη Android.

Το γεγονός ότι αξίζει να δοθεί προσοχή σε αυτήν την τεχνολογία υποδηλώνεται επίσης από το γεγονός ότι ένας από τους μεγαλύτερους κινητήρες για τη δημιουργία έργων ηλεκτρονικού εμπορίου, η Magento, κυκλοφόρησε μια πρώιμη έκδοση ανάπτυξης του PWA Studio το 2018. Η πλατφόρμα σάς επιτρέπει να δημιουργήσετε εξαρχής μια διεπαφή βασισμένη στο React για τις λύσεις ηλεκτρονικού εμπορίου σας με υποστήριξη PWA.

Συμβουλές για όσους έχουν ήδη ένα έργο Διαδικτύου ή απλώς μια ιδέα για μια νέα υπηρεσία με υποστήριξη για φορητές συσκευές: μην βιαστείτε να γράψετε μια πλήρη εγγενή εφαρμογή, αλλά πρώτα κοιτάξτε την τεχνολογία PWA. Αυτή μπορεί να είναι η καλύτερη σχέση ποιότητας-τιμής για το προϊόν σας.

Λίγο από την πρακτική. Για να δημιουργήσετε μια απλή εγγενή εφαρμογή ειδήσεων για κινητά, με την προϋπόθεση ότι έχετε ήδη έτοιμο διακομιστή REST, χρειάζεστε περίπου 200-300 ανθρωποώρες ανά πλατφόρμα. Με τη μέση τιμή αγοράς για μια ώρα ανάπτυξης να είναι 1500-2000 ρούβλια/ώρα, μια εφαρμογή μπορεί να κοστίσει περίπου 1 εκατομμύριο ρούβλια. Εάν αναπτύξετε μια διαδικτυακή εφαρμογή με πλήρη υποστήριξη PWA: ειδοποιήσεις push, λειτουργία εκτός σύνδεσης και άλλα καλούδια, τότε η ανάπτυξη θα διαρκέσει 200-300 ανθρωποώρες, αλλά το προϊόν θα είναι άμεσα διαθέσιμο σε όλες τις πλατφόρμες. Δηλαδή, μια εξοικονόμηση περίπου 2 φορές, για να μην αναφέρουμε το γεγονός ότι δεν θα χρειαστεί να πληρώσετε τέλη για τοποθέτηση σε καταστήματα εφαρμογών.

Χωρίς διακομιστή

Αυτή είναι μια άλλη σύγχρονη προσέγγιση στην ανάπτυξη. Λόγω του ονόματος, πολλοί άνθρωποι πιστεύουν ότι πρόκειται για πραγματικά ανάπτυξη χωρίς διακομιστή, δεν χρειάζεται να γράψετε κώδικα back-end και οποιοσδήποτε προγραμματιστής front-end μπορεί να δημιουργήσει μια πλήρη εφαρμογή web. Αλλά αυτό δεν είναι αλήθεια!

Κατά τη δημιουργία μιας εφαρμογής χωρίς διακομιστή, εξακολουθείτε να χρειάζεστε έναν διακομιστή και μια βάση δεδομένων. Η κύρια διαφορά αυτής της προσέγγισης είναι ότι ο κώδικας υποστήριξης παρουσιάζεται με τη μορφή συναρτήσεων cloud (άλλο όνομα για χωρίς διακομιστή είναι FaaS, λειτουργεί ως υπηρεσία ή Λειτουργίες-ως-Υπηρεσία) και επιτρέπει στην εφαρμογή να κλιμακώνεται γρήγορα και εύκολα. Κατά τη δημιουργία μιας τέτοιας εφαρμογής, ο προγραμματιστής μπορεί να επικεντρωθεί σε επιχειρηματικά προβλήματα και να μην σκεφτεί την κλιμάκωση και τη ρύθμιση της υποδομής, κάτι που στη συνέχεια επιταχύνει την ανάπτυξη εφαρμογών και μειώνει το κόστος της. Επιπλέον, η προσέγγιση χωρίς διακομιστή θα σας βοηθήσει να εξοικονομήσετε χρήματα σε ενοικιάσεις διακομιστών, καθώς χρησιμοποιεί ακριβώς όσους πόρους χρειάζεται για την ολοκλήρωση της εργασίας και εάν δεν υπάρχει φόρτωση, τότε ο χρόνος διακομιστή δεν χρησιμοποιείται καθόλου και δεν πληρώνεται.

Για παράδειγμα, η μεγάλη αμερικανική εταιρεία πολυμέσων Bustle κατάφερε να μειώσει το κόστος φιλοξενίας κατά περισσότερο από 60% κατά τη μετάβαση σε διακομιστή χωρίς διακομιστή. Και η εταιρεία Coca-Cola, όταν ανέπτυξε ένα αυτοματοποιημένο σύστημα για την πώληση ποτών μέσω μηχανημάτων αυτόματης πώλησης, κατάφερε να μειώσει το κόστος φιλοξενίας από 13000 $ σε 4500 $ ετησίως, μεταβαίνοντας σε Serverless.

Τα τελευταία δύο χρόνια, λόγω της καινοτομίας και των περιορισμών του, το Serverless έχει χρησιμοποιηθεί κυρίως για μικρά έργα, startups και MVP, αλλά σήμερα, χάρη στην εξέλιξη του λογισμικού, την ευελιξία και τη δύναμη της αποθήκευσης διακομιστών, αναδύονται εργαλεία που σας επιτρέπουν να καταργήσετε περιορισμούς, να απλοποιήσετε και να επιταχύνετε την ανάπτυξη εφαρμογών cloud .
Αυτό σημαίνει ότι τα επιχειρηματικά σενάρια επιχειρήσεων όπου ο εκσυγχρονισμός του cloud θεωρείτο προηγουμένως αδύνατος (για παράδειγμα, για συσκευές αιχμής, δεδομένα υπό μεταφορά ή κρατικές εφαρμογές) είναι πλέον πραγματικότητα. Καλά εργαλεία που δείχνουν πολλά υποσχόμενα είναι το kNative και το Enterprise χωρίς διακομιστή.

Ωστόσο, παρόλα αυτά, το Serverless δεν είναι μια ασημένια κουκκίδα για την ανάπτυξη διαδικτυακών εφαρμογών. Όπως κάθε άλλη τεχνολογία, έχει τα πλεονεκτήματα και τα μειονεκτήματά της και πρέπει να επιλέξετε αυτό το εργαλείο με κατανόηση και «όχι να χτυπάτε καρφιά με μικροσκόπιο» μόνο και μόνο επειδή είναι πιο προηγμένο τεχνολογικά.

Για να σας βοηθήσουμε να το καταλάβετε, ακολουθούν μερικά παραδείγματα για το πότε μπορεί να θέλετε να εξετάσετε το ενδεχόμενο του Serverless κατά την ανάπτυξη μιας νέας ή τη βελτίωση μιας τρέχουσας υπηρεσίας web:

  • Όταν η φόρτωση του διακομιστή είναι περιοδική και πληρώνετε για αδράνεια. Για παράδειγμα, είχαμε έναν πελάτη με ένα δίκτυο μηχανών καφέ και ήταν απαραίτητο να επεξεργαζόμαστε αιτήματα και να συλλέγουμε στατιστικά στοιχεία μόνο μερικές εκατοντάδες ή χιλιάδες φορές την ημέρα, και τη νύχτα ο αριθμός των αιτημάτων έπεσε σε αρκετές δεκάδες. Σε αυτήν την περίπτωση, είναι πολύ πιο αποτελεσματικό να πληρώνετε μόνο για την πραγματική χρήση των πόρων, γι' αυτό προτείναμε και εφαρμόσαμε μια λύση σε Serverless.
  • Εάν δεν σκοπεύετε να βουτήξετε στις τεχνικές λεπτομέρειες της υποδομής και να πληρώσετε επιπλέον για τη ρύθμιση και τη συντήρηση διακομιστών και εξισορροπητή. Για παράδειγμα, όταν αναπτύσσετε μια αγορά, δεν γνωρίζετε ακριβώς ποια θα είναι η επισκεψιμότητα ή το αντίστροφο - σχεδιάζετε πολλή κίνηση και έτσι ώστε η εφαρμογή σας να είναι βέβαιο ότι θα αντέξει το φόρτο, τότε το Serverless είναι μια εξαιρετική επιλογή.
  • Εάν χρειάζεται να εκτελέσετε κάποια συμβάντα ροής στην κύρια εφαρμογή, γράψτε πλευρικά δεδομένα σε πίνακες, εκτελέστε μερικούς υπολογισμούς. Για παράδειγμα, συλλέξτε αναλυτικά δεδομένα ενεργειών χρήστη, επεξεργαστείτε τα με συγκεκριμένο τρόπο και αποθηκεύστε τα σε μια βάση δεδομένων.
  • Εάν χρειάζεται να απλοποιήσετε, να ενοποιήσετε ή να επιταχύνετε την τρέχουσα λειτουργία της εφαρμογής. Για παράδειγμα, δημιουργήστε υπηρεσίες βελτίωσης της απόδοσης για εργασία με εικόνες ή βίντεο, όταν ο χρήστης ανεβάζει βίντεο στο cloud και μια ξεχωριστή λειτουργία χειρίζεται τη διακωδικοποίηση, ενώ ο κύριος διακομιστής συνεχίζει να λειτουργεί κανονικά.

Εάν χρειάζεται να επεξεργαστείτε συμβάντα από υπηρεσίες τρίτων. Για παράδειγμα, επεξεργαστείτε απαντήσεις από συστήματα πληρωμών ή ανακατευθύνετε δεδομένα χρήστη στο CRM για να επιταχύνετε την επεξεργασία των αιτημάτων από πιθανούς πελάτες
Εάν έχετε μια μεγάλη εφαρμογή και ορισμένα τμήματα της εφαρμογής μπορούν να υλοποιηθούν πιο βέλτιστα χρησιμοποιώντας μια γλώσσα διαφορετική από την κύρια. Για παράδειγμα, έχετε ένα έργο σε Java και πρέπει να προσθέσετε νέα λειτουργικότητα, αλλά δεν έχετε ελεύθερα χέρια ή η υλοποίηση σε μια δεδομένη γλώσσα μπορεί να διαρκέσει περισσότερο και υπάρχει ήδη λύση σε άλλη γλώσσα, τότε το Serverless μπορεί να σας βοηθήσει και με αυτό.

Αυτή δεν είναι ολόκληρη η λίστα εργαλείων και τεχνολογιών που αξίζουν προσοχής· απλώς μοιράστηκα τι χρησιμοποιούμε εμείς οι ίδιοι καθημερινά στην εργασία μας και γνωρίζουμε ακριβώς πώς μπορούν να βοηθήσουν τις επιχειρήσεις.

Πηγή: www.habr.com

Προσθέστε ένα σχόλιο