Context 让你与整个 subtree 共享一个值，而无需通过每个级别传递 props（prop drilling）。你创建一个 context，用其 Provider 包装一个 subtree，任何后代都可以用 useContext 读取它。
jsx
= ();
() {
(
);
}
() {
theme = ();
;
}
低频率、"全局式" 的数据，许多组件需要：theme, current user, locale, feature flags。
当 Provider 的 value 改变时，每个 消费该 context 的组件都会重新渲染——没有办法只订阅它的一部分。两个实际后果：
// ❌ a NEW object every render → all consumers re-render every time
<Ctx.Provider value={{ user, setUser }}>
// ✅ memoize the value so it only changes when it really changes
const value = useMemo(() => ({ user, setUser }), [user]);
<Ctx.Provider value={value}>
对于频繁变化或大型状态，将 context 分成较小的片段，或使用支持选择性订阅的 store（Zustand/Redux）。Context 是一个依赖注入工具，不是完整的状态管理器。