React 状态管理中最常见的错误,不是过早引入 Zustand,而是错误地使用 Context,然后把因误用导致的问题归咎于 Context。 每个调用 useContext(SomeContext) 的组件,只要上下文的值发生变化就会重新渲染——哪怕变化的那部分跟这个组件毫无关系。 比如定义了一个包含用户信息、侧边栏开关状态、通知列表的大对象 AppContext,导航栏组件只取 user 字段,但只要通知每 30 秒推送一次,导航栏也会被迫跟着重绘。这就是大多数对 Context 性能抱怨的根源。 问题出在“把所有状态塞进一个上下文”。按更新频率拆开就好: 用户身份只在登录退出时变化,可以单独一个 UserContext。侧边栏开闭只是界面交互,频率也低,放进 UIContext。通知列表每隔几十秒刷新,赋予独立的 NotificationContext。这样拆分后,导航栏只在用户信息更新时才重新渲染,不再被通知打扰。不用任何额外库,大部分 Context 性能问题就消失了。 Context 特别适合那些稳定且被全局依赖的值。比如主题,大多在一个会话中只切换一次;认证用户信息,只在登录注销时变动;界面语言,同样是低频操作。它们的共同点是:稳定。
![]()
特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.