Astro 孤岛架构:让内容快,也让首页炫
个人站点常有两个互相打架的诉求:内容页要极致轻量、秒开;首页又想要炫的交互动画。Astro 的孤岛架构(Islands)正好两头都顾。
默认零 JS
Astro 默认把页面渲染成纯 HTML/CSS,不带运行时 JS。文章页因此非常快。
需要交互的地方才「点亮」
只有标成交互的组件(岛)才会加载 JS,并可控制时机:
<Counter client:visible /> <Fancy client:idle />
对照表
| 场景 | 策略 |
|---|---|
| 博客正文 | 纯静态,零 JS |
| 首页动效 | 局部岛 + CSS 合成 |
| 阅读量 | 边缘函数异步拉取 |
这正是本站的取舍:门面可以炫,但内容永远快。