React 19 为何令人失望

2023 年 12 月，React 19.0.0 终于发布。但是经过一些实验之后，我决定暂缓升级我的 React 18 项目。React 19 带来了一些新变化，但总体而言它远未达到预期。

打包体积明显增大

创建一个最简单的 React 应用，React 19 的 minified+gzipped 打包体积比 React 18 增加了 12 kB，约 27%。从 React 16 以来，React 的打包体积就是一直在增长的，但是没有这次这么明显。

React 版本	打包体积 minified	打包体积 minified+gzipped
16.14.0	133.16 kB	41.92 kB
17.0.2	134.15 kB	43.45 kB
18.3.1	143.87 kB	46.34 kB
19.0.0	186.49 kB	58.96 kB

如果和 Preact 对比，它在实现了兼容 React 绝大部分功能的前提下，minified+gzipped 打包体积仅有 6.84 kB。React 19 是 Preact 的 8 倍还多。

依然缺少 ES Module 支持

在 2025 年，在所有人都在拥抱 ESM 的时候，React 19 仍然是一个 CJS 格式的库。我觉得没有必要进一步解释这有多糟糕。React 团队要么是没有能力，要么是没有兴趣支持 ESM。而不管是哪一种原因，都说明这个团队已经不适合领导 React 这样重大项目的开发。

Action & Form：越来越像一个框架

React 19 的发行日志中有一半篇幅在解释 Action 和 Form 相关的内容。

// React 19 表单代码示例
function ChangeName({ name, setName }) {
  const [error, submitAction, isPending] = useActionState(
    async (previousState, formData) => {
      const error = await updateName(formData.get("name"));
      if (error) {
        return error;
      }
      redirect("/path");
      return null;
    },
    null,
  );

  return (
    <form action={submitAction}>
      <input type="text" name="name" />
      <button type="submit" disabled={isPending}>Update</button>
      {error && <p>{error}</p>}
    </form>
  );
}

如果你恰好用过 Next.js 或 Remix 框架，你会发现 React 实际上就是将这些框架的功能拿了过来。

// Remix 表单代码示例
export async function loader({ request }) {
  return getProjects();
}

export async function action({ request }) {
  const form = await request.formData();
  return createProject({ title: form.get("title") });
}

export default function Projects() {
  const projects = useLoaderData();
  const { state } = useNavigation();
  const busy = state === "submitting";

  return (
    <div>
      {projects.map((project) => (
        <Link to={project.slug}>{project.title}</Link>
      ))}

      <Form method="post">
        <input name="title" />
        <button type="submit" disabled={busy}>
          {busy ? "Creating..." : "Create New Project"}
        </button>
      </Form>
    </div>
  );
}

Next.js 和 Remix 作为特定用途的 SSR 框架，提供一些高级功能无可厚非。但是 React 从一开始宣称自己不是一个框架，现在是否正在向一个框架转变呢？如果是的话，那 React Router 的能力要不要也拿过来？上面提到的体积问题会不会更严重？什么时候能引入模块化设计？

再说回 React 19 的 Action & Form 特性，我觉得它出现的最大意义是在简单表单场景，不需要为每个 input 创建 state，解决 React 没有双向绑定而导致的渲染性能问题。但是它的功能实在过于简陋，不支持自定义输入组件，缺少字段校验，无法根据一个字段的 value 控制其他字段的展示/隐藏。稍复杂一点的场景，还是需要 react-form-hooks 之类的工具。这个特性整体给我的感觉是比较鸡肋的，可应用的场景非常有限。

你可能不需要的 SSR 功能

除了上面提到的 Action & Form，React 19 剩下的新功能，包括 React DOM Static API 和 Server Component 都是为 SSR 服务的。

我个人的观点是，除了内容型网站外，99% 的应用场景不需要 SSR。从计算成本和开发成本来看，都不划算。因此这部分新功能对我来说完全是鸡肋。

聊胜于无的改进

剩下的改进基本上都是一些可有可无