Astro：给现代网站准备的构建工具

文章目录Astro给现代网站准备的构建工具1、它解决了什么问题2、上手门槛3、生态和扩展4、适合哪些人Astro给现代网站准备的构建工具Astro 在 GitHub 上已经拿到 60.7K Star 了。它是一个网站构建工具主打的是用更少的 JavaScript 交出更快的页面。这年头前端框架都在往 bundle 里塞一堆运行时 JSAstro 反过来走——能在服务端渲染完的全部在服务端搞定客户端只留下真正的交互部分。1、它解决了什么问题大部分 React/Vue/Svelte 项目有个共同的问题不管页面多简单框架的运行时 JS 都得加载一遍。一个纯展示的博客页面可能为了一个交互按钮加载了上百 KB 的框架代码。Astro 的思路是岛屿架构。静态部分直接输出 HTML没有任何 JS。只有页面上的独立交互组件比如一个搜索框、一个轮播图才按需加载对应的框架代码。最终结果就是页面加载快JS 总量少。2、上手门槛Astro 对现有前端生态兼容得很好。React、Vue、Svelte、Solid、Preact 组件都可以直接放在同一个项目里用一个页面里混着几个框架的组件都行。创建一个新项目npmcreate astrolatest单文件组件叫.astro语法和 HTML 很像在---之间写服务端逻辑代码下面写模板。如果你写过 JSX上手没难度。3、生态和扩展官方维护了超过 20 个集成包覆盖了各种常见需求。Node.js 和 Vercel 适配器用来部署Sitemap 自动生成站点地图MDX 支持直接在页面里写 Markdown 组件RSS 给博客站点生成订阅源。文档站有专门的 Starlight 主题基于 Astro 但开箱即用。4、适合哪些人做博客、文档站、营销页这类以内容为主的站点想把 React/Vue 组件用在静态页面中但不想拖一堆 JS觉得 Next.js 太重、想要更轻量替代方案的团队Astro 的定位很明确——它不是要取代 React 或 Vue而是让这些框架在合适的场景做合适的事。内容归内容交互归交互不混在一起打包带走。而是让这些框架在合适的场景做合适的事。内容归内容交互归交互不混在一起打包带走。