什么是 Astro？

Astro 是一个现代化的静态站点生成器，专注于内容驱动的网站。

核心概念

岛屿架构

Astro 使用岛屿架构（Islands Architecture），默认输出纯 HTML，交互组件按需加载。

Content Collections

内容集合提供类型安全的 Markdown 管理方式：

import { getCollection } from 'astro:content';
const projects = await getCollection('projects');

文件路由

src/pages/ 目录中的文件自动映射为路由：

pages/
├── index.astro       → /
├── projects/
│   ├── index.astro   → /projects/
│   └── [...slug].astro → /projects/xxx/

性能特性

• 默认零 JavaScript
• 自动图片优化
• 部分水合（Partial Hydration）

与 React/Vue 比较

特性	Astro	React	Vue
构建方式	SSG/SSR	CSR/SSR	CSR/SSR
输出	HTML	JS Bundle	JS Bundle
学习曲线	低	中	低