Какой знаешь подход к реализации Routing кроме Middleware

«Какой знаешь подход к реализации Routing кроме Middleware» — вопрос из категории Архитектура, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Один из популярных подходов — Component-Based Routing, используемый в библиотеках типа React Router. В этом случае маршруты определяются как компоненты, а логика навигации встроена в UI-слой.

Пример с React Router:

import { BrowserRouter, Routes, Route } from 'react-router-dom';

function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/about" element={<About />} />
      </Routes>
    </BrowserRouter>
  );
}

Альтернативы:

  1. Hash-Based Routing — маршруты в хеше URL (/#/about), не требует серверной поддержки.
  2. File-System Routing (Next.js, Nuxt) — маршруты генерируются автоматически на основе структуры папок.
  3. State-Driven Routing — управление через состояние приложения (например, в MobX/Redux).

Каждый подход выбирается в зависимости от требований к SEO, SSR или SPA.