1. 零 JavaScript 默认输出#

Astro 最吸引我的特性是”默认零 JS”。它会将模板编译为纯 HTML，不会向浏览器发送不必要的 JavaScript 代码。这对于以内容为主的博客来说至关重要。

根据官方数据，Astro 站点平均比同功能的 Next.js 站点快 40% 以上。

2. 岛屿架构#

Astro 独创的”岛屿（Islands）“架构允许你在静态页面中嵌入交互式组件，而且这些组件可以来自不同的框架：

1
---
2
import ReactCounter from '../components/ReactCounter.jsx';
3
import SvelteTimer from '../components/SvelteTimer.svelte';
4
---
5

6
<!-- 两个独立的交互岛屿 -->
7
<ReactCounter client:load />
8
<SvelteTimer client:visible />

这意味着你可以在同一个页面中混用 React、Vue、Svelte 组件，按需加载，互不干扰。

3. 基于内容集合的类型安全#

Astro 的内容集合（Content Collections）基于 Zod 做 schema 校验，在构建时就能发现 frontmatter 中的错误：

1
import { defineCollection, z } from "astro:content";
2

3
const posts = defineCollection({
4
  schema: z.object({
5
    title: z.string(),
6
    published: z.date(),
7
    draft: z.boolean().optional(),
8
  }),
9
});

如果你漏写了 title 字段，构建时就会报错，而不是等到线上才发现问题。

4. 强大的 Markdown 支持#

Astro 内置了对 Markdown 的全面支持，包括 frontmatter 解析、自动目录生成、以及通过 rehype/remark 插件扩展的能力。你可以轻松添加代码高亮、数学公式、自定义容器等功能。

5. 部署灵活#

Astro 的输出是标准的静态文件，可以部署到任何支持静态托管的平台。我目前部署在 Vercel 上，每次 git push 后自动构建，全程零配置。