在 Cloudflare 上怎么选技术栈？给新手的一篇清晰说明

一句话定位

如果你准备把产品部署到 Cloudflare，这篇指南帮你快速判断：内容站用 Astro，轻后端/API 用 Hono，常规产品型全栈应用优先 React Router；只有明确需要 Next.js 生态时，再用 Next.js + OpenNext。

很多人一上来就被这些名字绕晕：Astro、Hono、React Router、Next.js、OpenNext、Durable Objects……看起来都能做网站，但它们解决的问题并不一样。

对新手来说，真正难的不是“不会写代码”，而是不知道该先用哪套组合，才不会把自己带进不必要的复杂度里。

这篇文章我想做一件很具体的事：不从框架宣传页出发，而是从你下午要做的项目出发。你要做内容站、API、产品后台，还是已有 Next.js 项目迁移？不同目标，对应的首选技术栈其实差别很大。

TL;DR（先抄作业）

更新时间：2026-04-15

• 博客、文档、营销站、SEO 页面：优先用 Astro。
• API、Webhook、边缘服务、AI 中转层：优先用 Hono。
• 新手做 SaaS / Dashboard / 产品 MVP：优先用 React Router + Hono 模板。
• 已有 Next.js 项目，或明确需要 App Router / RSC / Server Actions / ISR：用 Next.js + OpenNext。
• 如果你只是因为“Next.js 很流行”才想选 Next.js：先停一下，Cloudflare 上新项目通常有更轻的选择。

为什么这个问题会让新手卡住

新手选 Cloudflare 技术栈时，最常见的误区不是“技术太少”，而是“选项太多，而且名字都像是同一个层级”。

但实际上，这几类东西并不在同一层：

• Astro / React Router / Next.js 更像是你怎么组织页面和前端应用。
• Hono 更像是你怎么写 API、Webhook 和边缘后端。
• OpenNext 不是一个新框架，而是把 Next.js 适配到 Cloudflare Workers 的桥。
• Durable Objects、D1、KV、R2 则是你在 Cloudflare 上存状态和数据的能力。

所以更好的判断顺序，不是“我喜欢哪个框架”，而是：

1. 你的项目主要是内容，还是产品？
2. 你的核心复杂度在页面，还是在后端/API？
3. 你是新项目，还是已经有一套既有技术栈要迁移？

把这三个问题想清楚，技术栈往往就不难选了。

快速决策树

只想最快做决定，可以按这个顺序问自己：

1. 这个项目主要是内容、文章、文档、Landing Page 吗？
   → 用 Astro。
2. 这个项目主要是 API、Webhook、轻量后端、边缘逻辑吗？
   → 用 Hono。
3. 这个项目是带登录、表单、Dashboard、数据库的产品界面吗？
   → 先用 React Router + Hono。
4. 你已经有 Next.js 项目，或非 Next.js 不可吗？
   → 用 Next.js + OpenNext。
5. 你需要实时房间、多人协作、在线聊天、游戏状态同步吗？
   → 在上面的前端栈之外，加 Durable Objects。

如果你现在就要开工，我会怎么帮你做决定

如果你把需求丢给我，我通常会先这样分：

第一类：内容型项目

比如博客、教程站、文档站、产品官网、课程说明页、SEO 落地页。

这类项目最重要的是：

• 页面加载快
• 搜索引擎友好
• 写内容和维护内容方便
• 不要为了少量交互引入过重的应用框架

这种情况下，我几乎都会先推 Astro。因为它的默认思路就是：能静态就静态，能少发 JS 就少发 JS。

这也是为什么很多内容站放到 Cloudflare 上时，Astro 会比 Next.js 更像“顺手的工具”，而不是“功能最全但也更重的工具”。

第二类：后端/API 型项目

比如：

• 飞书、微信、Stripe、Resend 的 Webhook
• AI 模型中转层
• 登录鉴权接口
• 文件上传签名接口
• 边缘缓存和转发逻辑

这类项目你未必需要一个完整的页面框架。你需要的是：路由清楚、中间件好写、和 Workers 运行时兼容、部署简单。

这种情况下，Hono 往往是最顺的选择。它够轻，也很符合“在 Worker 里写 HTTP 服务”的感觉。

第三类：产品型项目

比如 SaaS MVP、用户后台、管理面板、内部工具、带登录和数据库的产品页面。

这类项目通常同时需要：

• React 组件体系
• 路由
• 表单
• 登录
• API
• 数据库
• UI 组件库

这时候如果你还是用 Astro 做主体，通常会开始觉得“能做，但不够顺”。而如果你直接上 Next.js，又有可能在 Cloudflare 上承担一些你当前根本用不到的复杂度。

所以对大多数新手来说，这类项目我更推荐先用 React Router + Hono，尤其是 react-router-hono-fullstack-template 这种已经把前端和 API 骨架搭好的模板。

第四类：已有 Next.js 项目，或者非 Next.js 不可

有一种情况非常明确：你不是在重新选，而是在延续已有选择。

比如：

• 项目本来就是 Next.js 写的
• 团队已经大量使用 Next.js App Router
• 业务依赖 Next.js 特有的能力或插件生态
• 你已经在围绕 Server Actions、RSC、Route Handlers 组织代码

这时候就不要为了“Cloudflare 更轻”硬换框架。

直接走 Next.js + OpenNext，通常是更务实的路线。

选型总表

先看项目，再看框架：一个更实用的判断方式

很多教程喜欢从框架特性开始讲，比如 SSR、RSC、Islands、Edge Runtime。

这些当然重要，但如果你是第一次做 Cloudflare 项目，更实用的做法是反过来问：

1. 我的页面是不是以“读”为主？

如果用户进来主要是阅读内容、看介绍、搜索资料，而不是频繁操作后台，那优先考虑 Astro。

一句话说：读多于写，Astro 往往就对了。

2. 我的核心工作是不是处理请求？

如果你的主要任务是接 webhook、鉴权、转发请求、拼接模型 API、写边缘逻辑，那优先考虑 Hono。

一句话说：请求多于页面，Hono 往往就对了。

3. 我的项目是不是“像一个产品”而不是“像一个网站”？

如果它有账号体系、表单、控制台、工作区、数据列表、操作流，那就别再把它当成内容站来设计了。优先考虑 React Router + Hono。

一句话说：交互多于展示，React Router/Hono 往往更顺。

4. 我是不是已经被 Next.js 绑定了？

如果答案是“是”，那别绕了。直接用 OpenNext 把 Next.js 跑在 Cloudflare Workers 上。

一句话说：已经是 Next.js，就继续 Next.js。

OpenNext 和 React Router + Hono 怎么选

这是最容易纠结的一组。

选 Next.js + OpenNext，如果你符合这些情况

• 你已经有一个 Next.js 项目，要迁移到 Cloudflare Workers。
• 你明确需要 App Router、React Server Components、Route Handlers、Server Actions、ISR。
• 你的团队非常熟 Next.js，不想换心智模型。
• 你能接受多一层 OpenNext 适配，并愿意用 preview 在 workerd 运行时里测试。

启动命令：

pnpm create cloudflare@latest my-next-app --framework=next

或者按 OpenNext 文档显式指定 Workers：

pnpm create cloudflare@latest my-next-app --framework=next --platform=workers

选 React Router + Hono，如果你符合这些情况

• 你是新项目，不需要继承 Next.js 代码。
• 你要做的是 Dashboard、后台、工具型产品、SaaS MVP。
• 你希望前端路由和后端 API 更直接：React 负责界面，Hono 负责 /api/*。
• 你希望模板自带 Tailwind / shadcn/ui，少花时间搭 UI 基础设施。

启动命令：

pnpm create cloudflare@latest -- --template=cloudflare/templates/react-router-hono-fullstack-template

一个最常见的误判：把 Next.js 当成默认答案

很多人会下意识觉得：React 项目 = Next.js。

这在很多场景里没错，但放到 Cloudflare 上，最好再多问一句：我真的需要 Next.js 的这些能力吗？

如果你并不需要：

• App Router
• React Server Components
• Server Actions
• Next.js 特定插件生态
• 已有 Next.js 代码资产

那你其实是在为“可能用得到”付出复杂度，而不是为“现在必须用”付出复杂度。

对新手来说，最稳的起步方式通常不是最强，而是最少多余层。

这也是为什么我会说：新项目里，Next.js 应该是“明确需要再上”，而不是“默认就上”。

Astro、Hono、Next.js 的边界

Astro：内容优先，不是“弱”

Astro 很适合内容站，不是因为它只能做静态站，而是因为它默认让你少发 JS。博客、文档、课程站、产品营销页，通常都是 Astro 的舒适区。

如果后面需要表单、登录、少量动态接口，可以再接 Workers、Hono 或 Astro 的 Cloudflare adapter，不用一开始就上重型全栈框架。

Hono：后端优先，不是完整产品框架

Hono 更像一个轻量 Web 后端框架。它适合写 API、Webhook、鉴权中间件、AI 中转、文件上传签名、边缘缓存逻辑。

如果你要做完整产品界面，可以让 Hono 只负责 API，再搭配 Vite React、React Router 或 Astro。

Next.js：功能强，但别默认上

Next.js 很强，尤其是你需要 App Router、RSC、SSR/SSG/ISR、复杂数据加载和 Next 生态时。

但在 Cloudflare 上，它通常意味着你要理解 Next.js → OpenNext → Workers 这层适配链路。对新手来说，如果项目并没有 Next.js 专属需求，React Router/Hono 往往更清爽。

几个典型场景，我会直接怎么选

场景 1：我要做一个教程站 / 文档站

直接选 Astro。

原因很简单：内容是主角，性能和 SEO 很重要，页面大多数时候不需要复杂客户端状态。

场景 2：我要做一个收款页 + 产品介绍页

先选 Astro。如果后面有表单提交、支付回调、邮件通知，再用 Hono 或 Workers API 去补动态部分。

场景 3：我要做一个用户后台

直接选 React Router + Hono。

这类项目最怕的是一开始把主要精力花在框架兼容和 SSR 心智负担上，而不是先把业务流跑起来。

场景 4：我要做一个 AI 工具

如果它主要是：

• 一个输入框
• 调模型
• 展示结果
• 保存少量历史

那通常可以从 Hono + React Router 或官方 AI 模板起步。

如果只是做 API 中转或 Agent/BFF，甚至只用 Hono 都够了。

场景 5：我已经有 Next.js 项目，想迁到 Cloudflare

直接走 Next.js + OpenNext。

迁移项目时，最重要的通常不是“理想中的最佳栈”，而是最少重写成本。

数据库和存储怎么顺手搭

框架只解决“代码怎么组织”。Cloudflare 上还要按数据形态选存储：

我的新手推荐组合

如果你下午就要开工，我会这么选：

• 做内容/教程/营销页：Astro。
• 做产品后台/MVP：react-router-hono-fullstack-template。
• 做 API/自动化/AI 中转：Hono。
• 已有 Next.js 包袱：OpenNext。

最后给新手一个真正够用的结论

如果你看完还是有点纠结，那就记住这一版最短答案：

• 先做站点内容：Astro
• 先做 API 和自动化：Hono
• 先做产品 MVP：React Router + Hono
• 已经在 Next.js 上：OpenNext

不要把这件事想成“我要选一个最先进、最万能、未来五年都不后悔的框架”。

更现实的目标是：选一个能让你这一版产品最快上线、最少踩坑、以后也还能接着长大的技术栈。

延伸资源

• Cloudflare Workers：Astro 官方指南
• Cloudflare Workers：React Router 官方指南
• Cloudflare Workers：Hono 官方指南
• Cloudflare Workers：Next.js 官方指南
• OpenNext Cloudflare Adapter
• Cloudflare Workers Templates

如果你还在搭整体独立开发环境，可以继续看 独立开发者工具栈。