今天，读这篇 React Server Components: the Good, the Bad, and the Ugly 并且做一些笔记。
总体上，作者是对 RSC 持积极态度。
mayank.co/blog/react-server-components/
The Good / 优点
可以在组建中直接运行服务端代码去数据，是一个进步。而且可以兼容不同框架的 data loader。
有效减少客户端代码体积。直接从服务端获取渲染好的内容带来更好的用户体验。
The almost good / 算是优点
可以运行服务端代码，相当于实现了一个类似 RPC 的机制。服务端代码可以响应用户操作，比如处理表单。
另外一个好处是，我们不再必须写 fetch 了。
The bad / 缺点
当制作表单时，如果需要 disable 按钮，我们需要把它放到一个独立的组件。因为获取表单内容需要客户端 hook useFormStatus()。
同样的，表单中可能也需要显示错误信息，这个也会用到 useFormSratus()，所以这部分逻辑也要被移动到一个客户端组件中。
但是，问题是：
- 相关的代码被分散到多个组件
- 服务端函数的参数变了，现在需要先传当前状态（参考第二张截图）
- useFormState 的官方文档提供的示例，是错误的（作者的吐槽）
还有，
- 到处需要写 use client
- 在嵌套基层的客户端组件里面，调用服务端组件，可能会需要处理 prop 传递
- 很多组件无所谓运行在哪里，但很可能仍旧被打包到客户端，就因为被某个客户端组件 import 了
所以你需要费一点心力，才能正确减少客户端代码体积。
The Ugly / 丑陋的东西
- NextJS 在服务端组件中，并没有使用原生的 fetch
- 你无法使用 request object，也不能设置 headers, cookies, status codes, redirect 等。除非使用 middleware
- 这些问题，在旧版 nextjs 中不存在
The uglier / 更丑陋的东西
如果说 server side component 能减少客户端代码体积，上面的缺点还好说。但实际上，正相反。
Next.js 12：压缩后 70KB
Next.js 14：压缩后 90KB，解压缩之后 300KB
也就是说，只要用 nextjs，这是能做到的最小的体积了。
要记住，不是所有的用户都有很好的硬件和新版浏览器。大量的 JS 实际上更容易影响用户的使用。
如果你因为要写 nextjs 而买了 Macbook Pro M3，你要意识到这么做哪里不对。
RSC 并不直接输出 HTML，而是一个中间态，叫 RSC payload。也就是说，页面的 HTML 一份，RSC payload 代码还有一份，都被发送到客户端。
不是说好减少客户端代码体积吗？怎么还加倍了呢？
Closing thoughts/ 总结
- RSC 是一个积极的方向，因为可以统一两端的语言。
- React 并没有努力解决在客户端开发时候的一些不足，更像是一个被废弃的 FB 项目
React 存在大量问题还没有被解决（见截图）
重要的是，这些问题不是已有问题，而且 React 带来的新问题！其他框架，比如 Svelte, Solid, Preact, Qwik, Vue, Marko 等，不存在大部分 React 的问题。
从这一点来说，React 更像是技术债（哇，好严重的指控）。因为，要想解决这些问题，就要去掉 React。
我理解开源项目并非必须要解决所有人的问题，但考虑到 React 和 Next.js 都是为大型公司设计并由这些公司开发（这也是他们在市场推广中经常强调的一点），所以我认为对它们的批评是合理的。
目前的状况，React 和 NextJs 已经被绑定得太过分了，二者的界限变得很模糊。一些 API 渐渐和 web 标准不一致了。Nextjs 不像 Remix 那样尊重 web 标准。
