Next.js 适合什么网站

Next.js 是 2026 年默认的 React 框架——但内容站默认选它,会浪费速度、托管费和你的周末。这里讲什么情况下真的应该选它。

一听到 React,下意识就想到 Next.js——但真正该问的不是”我要不要 React”,而是”我要不要一个把服务端渲染、客户端交互、边缘 runtime 揉在一起的混合框架”。如果答案是不要,那就是给自己挖坑。这篇讲清楚什么信号说明真该用它。

问题背景

Next.js 15 + App Router 确实能打:React Server Components、partial prerendering、streaming、edge runtime、Vercel 深度集成。但几乎每篇独立开发者”我选了 Next.js”的复盘都同一个结尾——“早知道用 Astro / Hugo / WordPress,我站 99% 是静态的,花三个周末跟 RSC 死磕”。这个框架奖励的是产品交互面,不是博客文章。

用 30 行代码看清差异

Next.js 真正发挥作用的页面长这样:

// app/dashboard/page.tsx —— RSC + 按请求拉数据 + edge 流式
import { Suspense } from 'react';
import { getUser } from '@/lib/auth';
import { getOrders } from '@/lib/db';

export default async function Dashboard() {
  const user = await getUser();          // 仅服务端、绑定到本次请求
  const orders = await getOrders(user.id);
  return (
    <>
      <h1>Hi {user.firstName}</h1>
      <Suspense fallback={<p>Loading recent orders…</p>}>
        <OrderList orders={orders} />
      </Suspense>
    </>
  );
}

而 Astro 真正擅长的内容页是这样:

---
// src/pages/blog/[slug].astro —— 构建期生成一次,HTML 直出
import { getEntry } from 'astro:content';
const post = await getEntry('blog', Astro.params.slug);
const { Content } = await post.render();
---
<h1>{post.data.title}</h1>
<Content />

仪表盘必须长得像第一段,你需要 Next.js。绝大多数页面长得像第二段,就不需要。

判断标准

  • 大部分页面有登录状态驱动(dashboard、收藏、个性化流)。
  • 需要实时或 streaming UI(聊天、分段输出、实时数据)。
  • 日常写 React,想前后台、官网用一套心智模型。
  • 会跑请求级服务端逻辑(个性化 SSR、A/B 测试、按地理位置出内容)。
  • 后端 API 想和前端紧密集成成一个 serverless 整体。

快速结论

站长得像 App 而不像杂志,选 Next.js。如果绝大多数页面都能预渲染成 HTML、动态部分只有联系表单和搜索,Astro 上线更快、托管更便宜。真的需要用户态、RSC 或 streaming,Next.js 的复杂度才值。

实操步骤

  1. 把站上每种页面列出来,分类成静态、按用户动态、交互式 App 三种。
  2. 90% 以上是静态,停。先试 Astro 或其它 SSG,撞墙再回来考虑 Next.js。
  3. 动态页列出数据来源,判断要请求时渲染还是构建时渲染就够。
  4. 估算函数执行——免费档 SSR 在中等流量就可能限速,对照 Vercel function / edge 配额。
  5. 一个下午分别用 Next.js 和 Astro 做同一个页面,体感告诉你哪个顺手。
  6. 按 prototype 体感决定,不是按博客热度。50 页和 500 页时各重评一次,内容站经常后悔早期选了 SSR。

容易踩的坑

  • 把 Next.js 当 SSG 用——能 output: 'export',但等于砍掉半个框架,那为什么不直接 Astro。
  • 低估 App Router 学习成本——RSC、客户端 / 服务端边界、缓存层、use client 规则,Pages Router 老手照样栽。
  • 默认 Vercel 永久免费——Hobby 有带宽和函数执行上限,一上 HN 首页就触发。
  • “大家都用所以选它”——流行度不能替代工具和场景匹配度。

这篇适合谁

做产品型站(SaaS dashboard、AI 聊天工具、市场平台)的独立开发者,React + 服务端逻辑 + streaming 真的派上用场。

这篇不适合谁

纯内容站(博客、文档、落地页),Markdown 更新为主、几乎不需要请求时计算。选 Astro / Hugo / Eleventy。

FAQ

  • 博客用 Next.js 是不是杀鸡用牛刀?: 基本是。博客 99% 是静态 HTML。Astro JS 更少、build 更快、部署更便宜。除非博客是套在真 App 上的副产物。
  • Next.js 能纯静态输出吗?: 能,output: 'export',但同时砍掉 SSR、ISR、image optimization、middleware。这种情况就该问自己为什么还用 Next.js。
  • Next.js 会拖累 Core Web Vitals 吗?: 不是天然就拖累,但 RSC 和大客户端 bundle 会。Astro 默认 JS 更少,LCP / INP 起跑就快一截。
  • Pages Router 死了吗?: 没死,2026 还支持,但新功能都在 App Router 上。新项目直接 App Router,除非有特殊理由。

相关阅读

标签: #独立开发 #Next.js #建站策划 #对比 #入门