Question

你的 Astro 项目代码必须被渲染为 HTML 才能在网页上显示。

Astro 页面、路由和 API 端点可以在构建时预渲染或者在请求路由时由服务器按需渲染。通过 Astro 群岛，你也可以在必要时包含一些客户端渲染。

在 Astro 中，大部分处理都是在服务器上进行，而非浏览器中。这通常使你的网站或应用在性能羸弱的设备或在较慢的互联网连接上查看时比客户端渲染更快。同时，服务端渲染的 HTML 不仅快速、对 SEO 友好，并且还默认支持无障碍。

服务器 output 模式

你可以在你的 output 配置中设置你的页面如何渲染。

预渲染

默认的渲染模式是 output: 'static'，它在构建时为你的所有页面路由创建 HTML。

在这种模式下，你的整个站点将被预渲染，服务器将提前构建所有页面，并准备好发送给浏览器。对于每个访问者，都会发送相同的 HTML 文档，而更新页面内容需要全站重新构建。这种方法也被称为静态站点生成（SSG）。

默认情况下，所有 Astro 项目都被配置为在构建时预渲染（静态生成），以提供最轻量级的浏览器体验。浏览器无需等待任何 HTML 构建，因为服务器无需按需生成任何页面。你的网站不依赖后端数据源的性能，一旦构建完成，只要你的服务器正常运行，它就会作为静态站点一直对访问者开放。

静态站点可以包含 Astro 群岛。比如在其他静态的、预渲染的页面中，你也可以选择你喜欢的 UI 框架 来编写用于交互式 UI 组件（或者甚至是完全嵌入的客户端渲染应用！）。

Astro 的 视图过渡动画 API 在 static 模式下也可用，用于在页面导航中进行动画和状态持久化。静态网站也可以使用 中间件 来拦截和转换请求的响应数据。

提示

Astro 的默认 static 模式是一个强大的、有现代感的选择，适用于内容优先的网站，这些网站通常更新并不频繁，并向所有访问者显示相同的页面内容。

按需渲染

Astro 的其他两种输出模式可以配置为按需渲染你的部分或所有页面、路由或 API 端点：

• output: 'server' 用于大部分或全部按需路由的高度动态网站。
• output: 'hybrid' 用于大部分静态网站，但仍有一些按需路由。

由于它们是按访问生成的，所以这些路由可以为每个访客定制。例如，按需渲染的页面可以向已登录的用户显示他们的账号信息，或者显示最新更新的数据，而无需全站重建。请求时，在服务器上按需渲染也被称为服务端渲染（SSR）。

如果你需要以下功能，可以考虑在你的 Astro 项目中启用 server 或 hybrid 模式：

• API 端点：创建作为 API 端点的特定页面，用于数据库访问、身份验证和授权等任务，同时将敏感数据隐藏在服务端。

• 受保护的页面：通过在服务器上处理用户访问，以限制对页面的访问。

• 频繁更改的内容：生成单个页面时无需静态重建你的网站。当页面的内容频繁更新时，这是非常有用的，例如动态调用 fetch() 从 API 获取的数据。

server 和 hybrid 输出模式都允许你在你选择的 UI 框架 中包含 Astro 群岛 以增加交互性（甚至可以嵌入整个客户端渲染的应用！）。通过 中间件 和 Astro 的 视图过渡动画 API，用于动画和在路由导航中保持状态，甚至可以创建高度交互的应用。

提示

Astro 的按需服务器渲染提供了真正的应用体验，而无需客户端单页应用的 JavaScript 开销。