Μετάβαση σε Nuxt 4

Nuxt 2 to Nuxt 3 migration, the same app, server-rendered and indexable by Google

Η μετάβαση σε Nuxt 4 από Nuxt 2, Nuxt 3 ή Vue SPA ξεκινά από τον έλεγχο της αφετηρίας. Το Nuxt 2 έφτασε στο τέλος επίσημης υποστήριξης στις 30 Ιουνίου 2024 και το Nuxt 3 στις 31 Ιουλίου 2026. Για κάθε αφετηρία εξετάζω ξεχωριστά τη διαδρομή, τα modules, το rendering και τα διαθέσιμα tests.

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

Στις παλιότερες εκδόσεις έχουν σταματήσει οι επίσημες διορθώσεις. Σε εφαρμογές όπου το rendering γίνεται στον browser, η Google μπορεί να εκτελέσει JavaScript, αλλά αυτό συμβαίνει σε δεύτερο στάδιο και δεν εκτελούν όλοι οι crawlers JavaScript.

Η υποστηριζόμενη έκδοση επιτρέπει διαφορετικό rendering ανά διαδρομή: server-side rendering, pre-rendering ή υβριδική προσέγγιση.

Αν θέλετε να προσθέσετε λειτουργίες AI στην εφαρμογή, ελέγχω αν πρέπει να προηγηθεί η αναβάθμιση ή αν μπορούν να προστεθούν στο υπάρχον codebase.

01
Τεχνικός έλεγχος

Ελέγχω την έκδοση, τα modules και plugins, το build setup, το rendering ανά διαδρομή και τα διαθέσιμα tests. Έτσι εντοπίζονται νωρίς οι ασυμβατότητες και προκύπτουν η διαδρομή της μετάβασης, τα βασικά ρίσκα και η εκτίμηση της δουλειάς.

02
Αρχιτεκτονική & σχέδιο

Ορίζω τη στρατηγική rendering ανά διαδρομή, τις αλλαγές στο routing, τις αντικαταστάσεις των modules και τον τρόπο διαχείρισης του state. Οι επιλογές για SSR, SSG και υβριδικό rendering καταγράφονται πριν αρχίσει η υλοποίηση.

03
Σταδιακή μετάβαση

Χρησιμοποιώ ενδιάμεσο στάδιο όταν αυτό μειώνει το ρίσκο. Σε εφαρμογή όπου το rendering γίνεται στον browser, μεταφέρω σταδιακά τις διαδρομές και τα components και προσθέτω server rendering μόνο όπου χρειάζεται.

04
Σταθεροποίηση & παράδοση

Στο τέλος μετρώ την απόδοση, ελέγχω το HTML που παράγουν το SSR και το pre-rendering, ολοκληρώνω την τεκμηρίωση και παρουσιάζω τις αλλαγές στην ομάδα. Παρέχω τεχνική εγγύηση για 30 ημέρες μετά την κυκλοφορία.

Τι σας δίνει η μετάβαση

  • Επιλογή rendering ανά διαδρομή και Core Web Vitals που μετρώνται πριν και μετά
  • Server-side rendering ή pre-rendering, ώστε το βασικό HTML να είναι διαθέσιμο πριν ο client εκτελέσει JavaScript
  • Codebase με TypeScript και διαχείριση state όπου ταιριάζει στις ανάγκες της εφαρμογής
  • Σαφής σειρά αλλαγών, ώστε να γνωρίζετε ποια στάδια επηρεάζουν τις εκδόσεις και τα deploys
Nuxt 3 migration: Core Web Vitals before and after, LCP 4.8s down to 1.2s
Nuxt 3 rendering strategy: SSG, ISR, SSR and Nitro server routes in one codebase
Η εφαρμογή μας δουλεύει ακόμη. Γιατί να κάνουμε μετάβαση τώρα;

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

Εξαρτάται από το προϊόν και τις σελίδες που σας ενδιαφέρουν. Η Google μπορεί να εκτελέσει JavaScript. Με το server-side rendering ή το pre-rendering, όμως, το αρχικό HTML είναι ήδη διαθέσιμο πριν από το δεύτερο στάδιο του rendering, όπου εκτελείται JavaScript. Αυτό δεν εγγυάται καλύτερη κατάταξη. Μετρώ πρώτα την υπάρχουσα εφαρμογή και προτείνω αλλαγή μόνο όπου υπάρχει συγκεκριμένος λόγος.

Δεν υπάρχει σταθερή διάρκεια. Εξαρτάται από το σημείο εκκίνησης, τα modules και plugins, το rendering και την κάλυψη των tests. Μετά τον τεχνικό έλεγχο στέλνω συγκεκριμένη εκτίμηση για χρόνο και κόστος.

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

Επικοινωνία

Αθήνα, συνεργασία εξ αποστάσεως με ομάδες σε Ευρώπη & ΗΠΑ

info@offline-web.com

Μέσω της φόρμας επικοινωνίας, χωρίς κλήση
Τιμή και χρονοδιάγραμμα

    Πώς δουλεύει
    1. Πείτε μου για το έργο σας παρακάτω.
    2. Σας στέλνω με email μερικές γρήγορες ερωτήσεις, περίπου 2 λεπτά.
    3. Παίρνετε τιμή, χρονοδιάγραμμα και αντικείμενο έργου με email. Χωρίς κλήση.
    Ένα link με βοηθάει να εκτιμήσω πιο γρήγορα το έργο σας.

    Απαντώ συνήθως μέσα σε μία εργάσιμη, με τιμή, χρονοδιάγραμμα και αντικείμενο έργου.

    Ο ιστότοπος προστατεύεται από reCAPTCHA. Ισχύουν η Πολιτική Απορρήτου και Όροι Χρήσης της Google.