2022 年里做前端是怎样一种体验

今天在社区聊天群友说起 react 状态管理器时突然想起来了一篇旧文 2016 年里做前端是怎样一种体验，所以又模仿它跟着最近的新的技术写了一点。

问：最近我开始了一个新的 web 项目，不过老实说我已经好久没碰过这方面的代码了，之前只写过 vue2。听说前端的技术栈已经发生了极大的变革，不知道你现在是不是仍然处于最前沿的开发者阵列？
答: 是的，自从 hooks 出来之后，web 框架又发生了很多的变化。并且我刚从 Next.js Conf 2022 回来，因此我觉得我还是了解目前 Web 前端领域最新的面貌的。
问：不错不错，我的需求其实也不复杂，就是从后端提供的 REST 风格的 EndPoint 来获取用户活动数据并且将其展示在前端界面上。并且需要以列表形式展示，同时，列表要支持筛选排序等操作，对了，还要保证前端数据和服务端保持一致，以及能够做基本的编辑。其实就是简单的后台增删改查，按照我现在的理解，我打算用 vue2+axios 来抓取与操作数据，你觉得咋样？
答：不不不，现在估计已经没多少人使用 vue2 了吧。你可以试试 react，毕竟这是 2022 年了啊。
问：额，好吧，那 react 和 vue2 有什么区别啊？
答：react 是倾向函数式、不可变的框架，社区丰富，实践很多，而且 hooks 改变了一切。
问：不错不错，那我是不是就可以用 react+axios 来展示数据了呢？
答：额，你的应用需要处理任何的状态变更吗？
问：应该需要，有什么推荐么？我之前用过 vuex，听说 react 社区的是 redux？
答：都 2022 了，redux 早就过时了。试试新的基于 hooks 的状态管理器吧
问：举点例子？
答：分布式的用 jotai，集中的用 zustand，中后台无脑用 valtio，基本上 daishi kato 把你所有的需求都包了
问：好吧，我知道现在状态管理器很多了，听起来我应该用 valtio
答：是的，其实还有几十个我没说出来呢
问：那我是不是就可以用 webpack 创建一个项目开发了
答：额，现在 webpack 也过时了
问：过时了，那我要用什么？gulp？
答：webpack 太慢了，现在你应该用 vite、turbopack 之类的更快的构建工具
问：它们都是什么？
答：vite 是一个跨框架的打包工具，它基于 rollup+esbuild，比 webpack 快得多。turbopack 则是 webpack 作者基于 swc 重写的构建工具，比 vite 快 10 倍（就是还没能生产可用 #小声
问：你是不是专门一字排开名词来了？rollup 我了解，esbuild/swc 是什么？
答：esbuild/swc 是基于 native 编程语言写的编译器，它们分别使用 golang/rust 编写，比 babel 快 10~100 倍？
问：我之前用过 babel，插件很多，上一次你似乎推荐给我的就是这个？
答：时代在变化嘛～，就像 css 现在都已经过时了
问：嗯？css 过时了，那我怎么写样式？
答：试试 style-component？或者 tailwind？
问：我听说过 sass/less，但不知道这些是什么
答：style-component 是在 js 里写 css，它不需要单独的 css 文件，而且可以作为 js 值更容易复用。tailwind 则可以让你完全不写，只写 class 就好了，例如 w-9 h-9
问：听起来像是 style 内联样式？它们不是不推荐了么？
答：tailwind 不一样，你可以试试看
问：好吧，我只想写点简单的样式而已，不会太复杂
答：那好吧，你可以直接用 css-module 比较简单
问：我不想再纠结于这些名词了，再强调一遍，我只是想做个后台增删改查罢了。
答：那你可能根本不需要框架

PS1：redux 之前的流行似乎是因为 react 社区当时 FP 魔怔了
PS2：即便写 react 也有人并不喜欢 style-component/tailwind