为什么我选择 Astro 构建静态站点

为什么我选择 Astro

在 2024-2025 年选择前端框架时，我一直在寻找一个能在开发体验和最终性能之间取得平衡的方案。Astro 满足了我的所有要求。

核心优势

零 JS 默认

Astro 组件默认不发送 JavaScript 到浏览器。这意味着你的页面对用户来说几乎是纯 HTML，加载速度极快。

岛屿架构

对于需要交互的部分，可以用 React、Vue 或 Svelte 写“岛屿”组件。浏览器只在岛屿水合时下载 JS，而不是整页都带上框架代码。

Content Collections

Astro 的 Content Collections 用 TypeScript schema 验证 markdown 文件，让文章写作变成类型安全的操作：

import { defineCollection, z } from 'astro:content';

const blog = defineCollection({
  schema: z.object({
    title: z.string(),
    date: z.coerce.date(),
    tags: z.array(z.string()).optional(),
  }),
});

性能指标

Astro 静态站点的 Lighthouse 分数通常接近满分：

• Performance: 98-100
• Best Practices: 100
• SEO: 100

部署

Astro 生成的纯静态文件可以直接部署到 Cloudflare Pages、Vercel、Netlify 等任何静态托管服务，没有服务端运行时的负担。