Ποιοι είναι οι τρόποι υλοποίησης του routing στην…

Υπάρχουν δύο βασικοί τρόποι υλοποίησης του routing στο frontend:

Routing στην πλευρά του πελάτη: Το routing διαχειρίζεται απευθείας στον browser μέσω JavaScript.
- Αρχή λειτουργίας: Κατά την πλοήγηση, η σελίδα δεν φορτώνει πλήρως ξανά. Το JavaScript αλλάζει το URL στη γραμμή διευθύνσεων του browser (χρησιμοποιώντας το API History) και φορτώνει ή ξανασχεδιάζει δυναμικά τα απαραίτητα components ή τμήματα της σελίδας.
- Κατάσταση URL:
  - Χρησιμοποιεί το API History (pushState, replaceState). Το URL είναι καθαρό, χωρίς #.
  - Μπορεί να χρησιμοποιεί hash (#) στο URL (παλαιότερη προσέγγιση με #).
- Πλεονεκτήματα:
  - Βελτιωμένη εμπειρία χρήστη (ταχύτερες μεταβάσεις, χωρίς πλήρη επαναφόρτωση).
  - Κατάλληλο για εφαρμογές μιας σελίδας (SPA).
- Μειονεκτήματα:
  - Απαιτεί πρόσθετη διαμόρφωση του διακομιστή για σωστή διαχείριση άμεσων προσβάσεων μέσω URL (π.χ. fallback σε index.html).
  - Μπορεί να υπάρχουν προβλήματα SEO αν το περιεχόμενο αποδίδεται μόνο στην πλευρά του πελάτη (λύνεται με SSR ή pre-rendering).
- Δημοφιλείς βιβλιοθήκες/πλαίσια: React Router, Vue Router, Angular Router.
Routing στην πλευρά του διακομιστή: Το routing διαχειρίζεται πλήρως στην πλευρά του διακομιστή.
- Αρχή λειτουργίας: Σε κάθε αίτημα για μια νέα URL, ο browser στέλνει ένα αίτημα στον διακομιστή. Ο διακομιστής επεξεργάζεται το αίτημα, καθορίζει ποιο περιεχόμενο πρέπει να επιστραφεί και στέλνει μια πλήρη HTML σελίδα στον πελάτη. Ο browser φορτώνει ξανά πλήρως τη σελίδα.
- Κατάσταση URL: Η URL αντιστοιχεί στον πραγματικό πόρο στον διακομιστή.
- Πλεονεκτήματα:
  - Απλή υλοποίηση για εφαρμογές πολλασελίδων (MPA).
  - Εξαιρετική ευρετηρίαση από τις μηχανές αναζήτησης (SEO), καθώς το περιεχόμενο είναι έτοιμο άμεσα.
  - Δεν απαιτεί JavaScript για βασική πλοήγηση.
- Μειονεκτήματα:
  - Αργότερες μεταβάσεις μεταξύ σελίδων λόγω πλήρους επαναφόρτωσης.
  - Λιγότερη διαδραστικότητα σε σύγκριση με SPA.
- Παραδείγματα: Κληρονομιά από παραδοσιακές web εφαρμογές, όπου κάθε URL αντιστοιχεί σε ένα αρχείο ή διαδρομή στον διακομιστή (π.χ. PHP, Python με frameworks όπως Django/Flask, Node.js με Express κ.ά.).

Στις σύγχρονες εφαρμογές frontend, ειδικά στα SPA, το routing στην πλευρά του πελάτη είναι το πρότυπο. Το routing στην πλευρά του διακομιστή χρησιμοποιείται συχνότερα για πολυσέλιδες ιστοσελίδες ή σε συνδυασμό με το routing στην πλευρά του πελάτη για βελτίωση του SEO (π.χ. SSR).

Ποιοι είναι οι τρόποι υλοποίησης του routing στην ανάπτυξη frontend;