Astro

Astro 简介

Astro 是一个面向内容驱动网站的现代 Web 框架，主打「强大的开发体验 + 轻量的输出结果」。它通过**岛屿架构（Islands Architecture）**让页面默认输出静态 HTML，只在需要交互的局部加载 JavaScript，从而显著降低首屏负担。

核心特性

岛屿架构与按需水合

• 页面主体在构建时渲染为静态 HTML
• 交互组件以「岛屿」形式独立水合，可按可见性、空闲时间等策略延迟加载
• 默认不向浏览器发送多余 JS，利于性能与 SEO

多框架组件支持

Astro 允许在同一项目中混用多种 UI 框架组件，官方提供对应集成：

• React、Preact、Vue、Svelte、Solid
• Alpine.js 等轻量方案

内容优先

• 内置内容集合（Content Collections）与 Markdown/MDX 支持
• 适合博客、文档、知识库等内容型站点
• 可结合 RSS、Sitemap 等官方集成完善站点能力

快速开始

官方推荐通过脚手架创建项目：

npm create astro@latest

也可以手动安装依赖：

npm install astro

更多用法可参考官方文档与在线起步模板。

生态与部署

Astro 提供丰富的官方集成，覆盖常见部署与能力扩展：

• 部署适配：Node、Vercel、Netlify、Cloudflare
• 能力扩展：MDX、Sitemap、RSS、Partytown
• 语言工具：VS Code 插件、语言服务器、类型检查

适用与注意

Astro 非常适合博客、文档、官网、营销页等内容型站点；若项目是重交互的单页应用，则需评估岛屿架构带来的开发模式差异。多框架混用虽灵活，但也会增加依赖与构建复杂度，建议按需引入。