Sobes.tech
Interjú segítség
Források
Interjú előkészítése
Források
Álláskeresés
Források
Jogi
Vissza a kérdésekhez
Middle

Milyen módszerek léteznek a routing megvalósítására a frontend fejlesztésben?

sobes.tech MI

Válasz az MI-től

Két fő módszer létezik a routing frontend oldali megvalósítására:

  1. Kliensoldali routing: A routing közvetlenül a böngészőben JavaScript segítségével történik.

    • Működési elv: Navigáció során az oldal nem töltődik újra teljesen. A JavaScript módosítja a böngésző címsorában lévő URL-t (History API használatával), és dinamikusan betölti vagy újrarajzolja a szükséges komponenseket vagy oldalrészeket.
    • URL állapota:
      • A History API-t (pushState, replaceState) használja. Az URL tiszta, # nélkül.
      • Használhat hash-t (#) az URL-ben (elavult megközelítés a #-szel).
    • Előnyök:
      • Jobb felhasználói élmény (gyorsabb átmenetek, teljes újratöltés nélkül).
      • Alkalmas egylapos alkalmazásokhoz (SPA).
    • Hátrányok:
      • További szerver konfigurációt igényel a helyes közvetlen URL hozzáférések kezeléséhez (pl. fallback beállítása index.html-re).
      • SEO problémák léphetnek fel, ha a tartalom csak kliens oldali rendereléssel készül (megoldható SSR vagy pre-rendering segítségével).
    • Népszerű könyvtárak/frameworkök: React Router, Vue Router, Angular Router.

  2. Szerveroldali routing: A routing teljes egészében a szerveren történik.

    • Működési elv: Minden új URL kérésnél a böngésző kérvényt küld a szervernek. A szerver feldolgozza a kérést, meghatározza, milyen tartalmat küldjön vissza, és egy teljes HTML oldalt küld a kliensnek. A böngésző teljesen újratölti az oldalt.
    • URL állapota: Az URL megfelel a szerveren lévő valódi erőforrásnak.
    • Előnyök:
      • Egyszerű megvalósítás többoldalas alkalmazásokhoz (MPA).
      • Kiváló indexelés keresőmotorok által (SEO), mivel a tartalom azonnal elérhető.
      • Nem igényel JavaScriptet az alapvető navigációhoz.
    • Hátrányok:
      • Lassabb átmenetek az oldalak között a teljes újratöltés miatt.
      • Kevesebb interaktivitás a SPA-hoz képest.
    • Példák: Hagyományos webalkalmazások öröksége, ahol minden URL egy külön fájlhoz vagy szerveroldali útvonalhoz tartozik (pl. PHP, Python Django/Flask, Node.js Express stb.).

A modern frontend alkalmazásokban, különösen SPA-kban, a kliensoldali routing az alapértelmezett. A szerveroldali routing inkább többoldalas webhelyekhez vagy a SEO javításához használatos, gyakran a kliensoldali routing-kal kombinálva (pl. SSR).

KorábbiKövetkező