himself65

> 并指导一二

这里面有很多可以深度挖掘的东西。

如果要深挖 React ，18 、19 出了这么多 API ，简单扫了一下你这里面大多数可以迁移到新的 API 优化一些（比如 useSyncExternalStore 、useTransition……），多读读官网 docs ，很多基本的 pitfall 全在你项目里面出现了一遍（ deps 、useEffect……）

状态管理你都没有做，点一下按钮状态都丢了，这些你考虑过吗……

从工程化角度说，你这里面代码风格挺乱的，有时候 style 有时候 css in js ，文件命名……这下下来 eslint 、prettier 你有配吗

从前端角度说，这个项目目前是一个 CSR-only app ，你这个可以有 SSR 你可以尝试，React 出了 RSC 你可以尝试，Streaming UI 你可以做，怎么随便点一下整个屏幕都白了……另外 Vite 有很多自定义的 API 可以自己搭一个 server 玩玩……

随便说几句

只看 React 部分的话，写法有点过时了。
从整个前端质量看的话，属于是没有什么复杂度的 CRUD project ，里面也没有多少比较深的前端技术

同意#15 的观点，你这个 React 用法是有问题的，你需要把 processor 的初始化放在 React 外面。举个例子

```ts
const processor = buildProcessor()
const Component =() => {}
```

如果不能 SSR 那就判断一下 typeof window === "undefined"。
如果是一个异步，包一个 use(promise)

useEffect 是连接外部状态的一个 hook ，那这个东西来初始化整个数据其实是不符合 React 的思路

https://react.dev/reference/react/useEffect#connecting-to-an-external-system

那这个举例，server 是 React UI 之外的已经有的东西，connection 才是 useEffect 去 establish 的事情

可以试试 lit 。
个人感觉大部分库对于 shadow dom 的支持还是很差的，

作为在美国的来提点建议
1. 租车，除非你在像芝加哥、纽约这种大城市（公共交通间隔短且可以到达任何地方），如果你在西海岸，出门逛街吃饭一定要有个车，不然特别特别远，Uber 打车三四回也抵得上租一天车了。一般我推荐 Avis 。用国内驾照就可以租车（还需要给美国固定的地址和名字一样的信用卡）
2. 保险，租车保险医疗保险都得买上
3. 电话卡，Google Fi 这种比较简单，当然去 Best Buy 这种店也能买到电话卡
4. 付款，绝大多数店都支持 Apple Pay ，绑定 visa 或 master card 就行。也可在线下银行柜台办一张储蓄卡就能用（ p.s. 储蓄卡不能拿来租车）
5. 多买点零食放冰箱，如果不是大城市，晚上不会有餐厅开门的，24 小时超市一般也很远

@reallynyn 帝国时代 4 用了 AVX 指令集，是无法模拟的

@Slurp 谢谢，我们项目用的是 graphql

这个 idea 不错，我提出几个建议：

1. 用 SWC 或者 babel 实现
2. 自定义 transform 的函数，因为实际生产环境大都是包装了一层 console.log ，比如（ npm/debug 之类的）

swr 是一个网络无关的异步数据获取库，你可以拿来跑任何异步函数。
在你说的这个例子里面，你可以在顶层写一个 fetcher(key)，包装了 fetch api ，然后三个部分都可以间接 /直接调用这个 API