ADR-0004 · Фронтенд SvelteKit 2 + PWA

Статус: принято · 2026-06-22

Контекст. lab-фронт — плоский Svelte 5 + Vite (без роутера); analytics-ui — SvelteKit 2 + adapter-static. Оба на Svelte 5 + Tailwind 4. Нужно выбрать оболочку для dicechess-play. Темы, которые нравятся в аналитике, оказались чистым CSS + один стор — переносятся в любой Svelte-проект и выбор не определяют.

Решение. SvelteKit 2 + Svelte 5 (runes) + Tailwind 4 + adapter-static + PWA (@vite-pwa/sveltekit) — стек как у analytics-ui. Тема-система (app.css + themeStore.svelte.ts + boot-скрипт app.html, 7 тем) копируется из аналитики.

Последствия.

  • Файловый роутинг/layouts SvelteKit закрывают рост сайта (лобби → игра → история → профили → турниры) без ручного роутера.
  • Единый стек с аналитикой → переиспользование компонентов (PlayerSearch, GameCard) и тем без переходников.
  • prerender публичных страниц по флагу (OG-превью для ссылок-вызовов на фазе 4), оставаясь статическим SPA.
  • Play-компоненты lab (Svelte 5 runes) переносятся почти 1:1.
  • PWA: устанавливаемое приложение + офлайн-игра с локальным движком.

Альтернативы. Плоский Svelte+Vite (как lab) — форк копипастой, но придётся прикручивать роутер на второй странице. Смена фреймворка (React/Vue) — выбрасывает готовые компоненты и тему, без плюсов.

🔗 02 Архитектура — авторитет и стек