为什么选择 Astro？
Astro 是一个以内容为中心的 Web 框架，其核心优势在于 Islands Architecture：只有真正需要交互的组件才会发送 JavaScript 到浏览器，其余部分完全静态化。
这意味着你可以：
- 使用 React/Vue/Svelte 等主流组件库
- 同时获得接近纯 HTML 的加载性能
- 在单个项目中混用不同框架
Islands Architecture 实战
---
// 静态渲染，零 JS
import StaticComponent from './StaticComponent.astro';
// 仅在客户端可见时加载
import InteractiveChart from './Chart.tsx';
---
<StaticComponent />
<InteractiveChart client:visible />
client:visible 指令会将组件的 JS 推迟到它进入视口才加载，非常适合图表、复杂交互等场景。
性能指标
经过优化的 Astro 站点通常可以达到：
- LCP < 1.2s
- TBT < 50ms
- CLS = 0
部署到 Cloudflare Pages
Astro 可以通过 astro build 生成纯静态文件，直接部署到 Cloudflare Pages：
- 连接 Git 仓库
- 构建命令：
npm run build - 输出目录：
dist
完成！
希望这篇文章对你有所帮助。如果有任何问题，欢迎在下方留言或发邮件联系我。