我为什么放弃了 React（或许你也该试试）🔥

本以为能简化一切的框架，却让我的代码库变成噩梦内容提要：在使用 React 开发四年、构建了 20 多个生产应用之后，我决定转向 Svelte，并且再也没有回头。

崩溃的瞬间上个月，我花了六个小时调试一个"简单"的表单组件------问题出在 useState 无法立即更新。这是 React 的老毛病，就连资深开发者都容易踩坑。

那一刻我突然意识到：我花在对抗 React 上的时间，比实际开发功能还要多。

数据不会说谎来看一组我从 React 切换到 Svelte 后的项目对比：

打包体积： React + Redux：847kb Svelte：23kb

构建时间： React：45 秒 Svelte：3 秒

代码行数： React：2847 行 Svelte：892 行（实现相同功能）打包体积减少了 97%，构建速度快了 15 倍。

开发体验的革命 React 版本：

javascript 复制代码

const [count, setCount] = useState(0);
const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);

useEffect(() => {
  setLoading(true);
  fetchData()
    .then(data => {
      setCount(data.count);
      setLoading(false);
    })
    .catch(err => {
      setError(err.message);
      setLoading(false);
    });
}, []);

Svelte 版本：

svelte 复制代码

<script>
  let count = 0;
  let promise = fetchData();
</script>

{#await promise}
  加载中...
{:then data}
  {count = data.count}
{:catch error}
  {error.message}
{/await}

Svelte 不仅代码更简洁，而且更易读。

React 的问题出在哪？

虚拟 DOM 的谎言都说虚拟DOM能让React更快，其实不然。它反而增加了开销。Svelte 直接编译为操作原生 DOM 的 JavaScript，运行时性能提升 3 倍。
生态圈的陷阱 React 生态庞大但碎片化。状态管理？Redux、Zustand、Context 等几十种选择。样式方案？CSS-in-JS、CSS Modules、Styled Components... 选择太多反而无从下手。
无止境的学习曲线 Hooks、Context、Suspense、Concurrent Mode、Server Components... React 不断叠加新概念。用了四年 React，我每周还在遇到新问题。

真希望早点知道的事默认高性能

javascript 复制代码

// React：处处需要手动优化
const MemoizedComponent = React.memo(({ data }) => {
  const expensiveValue = useMemo(() => 
    processData(data), [data]
  );

  return <div>{expensiveValue}</div>;
});

// Svelte：默认高效
<script>
  export let data;
  $: expensiveValue = processData(data);
</script>

<div>{expensiveValue}</div>

内置动画效果

svelte 复制代码

<script>
  import { fade, slide } from 'svelte/transition';
  let visible = true;
</script>

{#if visible}
  <div transition:fade>
    <p transition:slide>零配置的顺滑动画</p>
  </div>
{/if}

在 React 中实现同样的效果，可能需要引入 200kb 的动画库。

迁移现实考量 "但是生态兼容怎么办？"

问得好。这是我的发现：

组件库：SvelteKit UI、Carbon Components Svelte
状态管理：内置 Store（轻量且强大）
路由：SvelteKit（比 Next.js 更优秀）
测试：Vitest 完美兼容
TypeScript：一等公民支持

实际效果切换至 Svelte 后： ✅ 部署速度提升 3 倍 ✅ 打包体积减少 95% ✅ 开发时间减少 40% ✅ Bug 反馈减少 60% ✅ 团队满意度大幅提升

一个令人不安的真相 React 正在成为 2024 年的 jQuery：对于大多数应用场景过于复杂，依靠惯性和大厂支持维持生命。

而 Svelte 只是简洁地工作。

不需要绞尽脑汁，不需要深陷性能优化的漩涡，没有依赖地狱。

写出来的代码，就是你想要的样子。

接下来怎么做？我不是说 React 一无是处。对于拥有大型 React 代码库的团队，迁移可能并不现实。

但对于新项目？每次我都选 Svelte。

开发界正在慢慢觉醒：

GitHub 新仪表板：使用 Svelte 构建
Apple 开发者文档：基于 SvelteKit
纽约时报：正在迁移至 Svelte

亲自尝试不必听信我的一面之词。用周末时间尝试用 Svelte 构建些东西：

bash 复制代码

npm create svelte@latest my-app
cd my-app
npm install
npm run dev

我保证你也会经历和我一样的"震撼时刻"。

你怎么看？继续坚守 React 还是尝试新选择？欢迎在评论区分享你的观点 👇