服务器端渲染 (SSR)

该包是 Lit Labs 实验包系列的一部分。有关在生产环境中使用 Labs 软件的指南,请参见 Lit Labs 页面。

服务器端渲染 (SSR) 是一种在组件的 JavaScript 实现加载并执行之前生成和提供组件 HTML(包括影子 DOM 和样式)的技术。

您可以出于多种原因使用 SSR

  • 性能。如果网站首先渲染静态 HTML,而无需等待 JavaScript 加载,然后(可选)加载页面的 JavaScript 并水合组件,则某些网站可以渲染得更快。
  • SEO 和网络爬虫。虽然主要的搜索引擎网络爬虫使用启用完整 JavaScript 的浏览器渲染页面,但并非所有网络爬虫都支持 JavaScript。
  • 健壮性。即使 JavaScript 无法加载或用户禁用了 JavaScript,静态 HTML 也会渲染。

有关一般服务器端渲染概念和技术的深入探讨,请参见 web.dev 上的 网络渲染

Lit 通过 Lit SSR 包支持服务器端渲染。Lit SSR 将 Lit 组件和模板渲染为 Node 等非浏览器 JavaScript 环境中的静态 HTML 标记。它无需完全模拟浏览器的 DOM,并利用 Lit 的声明式模板格式来实现快速性能、实现低时间到首字节以及支持流式传输。

Lit SSR 是一个低级库,您可以在基于 Node 的服务器或网站生成器中直接使用它。查看 Koa 服务器中使用 Lit SSR 的示例

还发布了许多集成,它们使 Lit SSR 可以开箱即用地工作。

该库正在积极开发中,存在一些我们希望解决的显著限制。

  • 不支持异步组件工作。请参见问题 #2469
  • 仅支持使用影子 DOM 的 Lit 组件。请参见问题 #3080
  • 声明式影子 DOM 尚未在所有主要浏览器中实现,但可以使用 polyfill。在 客户端使用 中了解更多信息。
  • 关于 ElementRendererRegistry 与其他自定义元素的互操作性也存在开放的讨论。