Millised on viis frontend arenduses marsruhtamise rakendamiseks?

On kaks peamist viisi front-endis marsruhtimise rakendamiseks:

1. Kliendi marsruhtimine: Marsruhtimine toimub otse brauseris JavaScripti abil.

   • Tööpõhimõte: Navigatsiooni ajal ei värskenda lehte täielikult. JavaScript muudab URL-i brauseri aadressiribal (kasutades History API-d) ja laadib või joonistab dünaamiliselt vajalikud komponendid või lehekülje osad.
   • URL-i seisund:
     • Kasutab History API-d (pushState, replaceState). URL on puhas, ilma #-ta.
     • Võib kasutada hašši (#) URL-is (vana meetod):
   • Eelised:
     • Parandab kasutajakogemust (kiirem üleminek, ilma täieliku värskenduseta).
     • Sobib ühe lehe rakendustele (SPA).
   • Puudused:
     • Vajab täiendavat serveri konfiguratsiooni, et õigesti töödelda otse URL-iga sisenemisi (nt fallback index.html-ile).
     • SEO probleemid võivad tekkida, kui sisu renderdatakse ainult kliendi poole (lahendatakse SSR või eelrenderimisega).
   • Populaarsed teegid/rakendused: React Router, Vue Router, Angular Router.

2. Serveripoolne marsruhtimine: Marsruhtimine toimub täielikult serveri poolt.

   • Tööpõhimõte: Iga uus URL-i päring saadab brauser serverile päringu. Server töötleb päringu, määrab, millist sisu tagastada, ja saadab tervikliku HTML-lehe kliendile. Brauser värskendab lehte täielikult.
   • URL-i seisund: URL vastab tegelikule ressursile serveris.
   • Eelised:
     • Lihtsam rakendada mitmeleheküljelisi rakendusi.
     • Hea indekseerimine otsingumootorite poolt, kuna sisu on kohe saadaval.
     • Ei vaja JavaScripti põhiliseks navigeerimiseks.
   • Puudused:
     • Aeglasem üleminek lehtede vahel, kuna toimub täielik uuesti laadimine.
     • Vähem interaktiivne kasutajakogemus võrreldes SPA-ga.
   • Näited: Traditsioonilised veebirakendused, kus iga URL vastab eraldi failile või marsruudile serveris (nt PHP, Python Django/Flask, Node.js Express jms).

Kaasaegsetes front-end rakendustes, eriti SPA-des, on kliendi marsruhtimine standard. Serveripoolne marsruhtimine kasutatakse sagedamini mitmeleheküljeliste saitide puhul või koos kliendi marsruhtimisega SEO parandamiseks (nt SSR).