Перейти к содержанию

Рендеринг на стороне сервера (SSR)

Этот пакет входит в семейство экспериментальных пакетов Lit Labs. Руководство по использованию программ Labs в производстве см. на странице Lit Labs.

Рендеринг на стороне сервера (SSR) - это техника генерации и обслуживания HTML ваших компонентов, включая теневой DOM и стили, до загрузки и выполнения их реализаций JavaScript.

Вы можете использовать SSR по целому ряду причин:

  • Производительность. Некоторые сайты могут работать быстрее, если они сначала отображают статический HTML, не дожидаясь загрузки JavaScript, а затем (по желанию) загружают JavaScript страницы и гидрируют компоненты.
  • SEO и веб-краулеры. В то время как основные поисковые системы отображают страницы в браузерах с полной поддержкой JavaScript, не все веб-краулеры поддерживают JavaScript.
  • Надежность. Статический HTML отображается, даже если JavaScript не загружается или у пользователя отключен JavaScript.

Для более глубокого погружения в концепции и техники серверного рендеринга в целом, смотрите Rendering on the Web на web.dev.

Lit поддерживает рендеринг на стороне сервера с помощью пакета Lit SSR. Lit SSR преобразует компоненты и шаблоны Lit в статическую HTML-разметку в небраузерных JavaScript-окружениях, таких как Node. Она работает без полной эмуляции DOM браузера и использует преимущества декларативного формата шаблонов Lit для обеспечения высокой производительности, низкого времени до первого байта и поддержки потоковой передачи.

Lit SSR - это низкоуровневая библиотека, которую вы можете использовать непосредственно в своем сервере или генераторе сайтов на базе Node. Посмотрите пример использования Lit SSR в сервере Koa.

Также было опубликовано несколько интеграций, которые позволяют Lit SSR работать "из коробки":

Статус библиотеки

Эта библиотека находится в стадии активной разработки с некоторыми заметными ограничениями, которые мы надеемся устранить:

  • Не поддерживается работа с асинхронными компонентами. См. проблему #2469.
  • Поддерживаются только Lit-компоненты, использующие теневой DOM. См. выпуск #3080.
  • Декларативный теневой DOM пока не реализован во всех основных браузерах, хотя полифилл доступен. Подробнее об этом читайте в client usage.
  • Также открыто обсуждение ElementRendererRegistry для взаимодействия с другими пользовательскими элементами.

Комментарии