Перейти к основному содержимому
Версия: 0.4

Ключевые концепции

@lite-ssr/vue разработан с целью сохранить максимальную совместимость с исходным Vue SPA-приложением, обеспечивая единый код для серверного и клиентского рендеринга. Библиотека предоставляет гибкие инструменты, которые интегрируются в ваш текущий стек технологий, не навязывая дополнительных ограничений.

💡 В отличие от стандартного подхода SSR в Vite (см. Vite SSR Guide), @lite-ssr/vue избавляет от необходимости разделять entry-файлы и явно указывать маршруты для серверной части.

Основные концепции​

1. Свобода архитектуры​

Мы стремимся предоставить максимальную свободу для разработчиков. С @lite-ssr/vue вы можете самостоятельно выбирать и настраивать любые Vue плагины.

Ниже приведены примеры работы с ключевыми фичами, популярными в других реализациях Vue SSR:

  • Роутинг: Мы не встраиваем vue-router по умолчанию. Вы можете подключить любой роутер или реализовать кастомное решение. Однако для упрощения работы, мы предусмотрели необходимый функционал на стороне SSR для правильной работы vue-router.
  • Работа с <head>: Вы можете использовать оригинальный unhead и реализовать собственную логику для SSR. Или использовать кастомное решение. Для упрощения мы также предлагаем готовую библиотеку @lite-ssr/vue-unhead, которая интегрирует unhead в ваш проект.
к сведению

Единственное требование для интеграции — замена стандартного createApp на его версию из @lite-ssr/vue.

2. Асинхронная инициализация приложения​

Библиотека поддерживает асинхронную инициализацию, позволяя гибко настраивать приложение:

  • Асинхронное получение конфигураций роутинга или плагинов на этапе инициализации приложения.
  • Динамическая настройка приложения без ущерба для серверного рендеринга.

Это делает @lite-ssr/vue особенно полезным для сложных приложений с динамическими зависимостями.

3. Управление асинхронными данными​

Работа с данными в SSR — одна из сложнейших задач. Мы предоставляем два подхода для её решения:

  • Асинхронные prefetch-сторы — definePrefetchStore: Позволяет получить данные на сервере, автоматически гидрировать их на клиенте и эффективно управлять состоянием. Этот подход обеспечивает лучшую производительность и более структурированную организацию данных.
  • Использование привычного useAsyncData: Подходит для быстрых и простых решений, но может повлиять на оптимизацию приложения.

Заключение​

Ключевые концепции @lite-ssr/vue направлены на то, чтобы дать разработчикам свободу в выборе инструментов и подходов, при этом обеспечивая мощный и эффективный серверный рендеринг. Библиотека не ограничивает вас в реализации, а лишь предоставляет инструменты, которые вы можете адаптировать под свои нужды.