如何消除Next.js中React Context的加载延迟问题？

我在React Context中存储客户端非敏感基础用户信息（如显示名、头像），并存入localStorage实现页面关闭/重载后的持久化，功能层面运行正常，但遇到以下核心问题：

• 为避免hydration mismatch错误，不得不禁用组件的SSR；
• 即使开启SSR，内容的hydration速度远慢于其他客户端组件，生产环境下也存在明显布局偏移。

我需要实现这些信息立即显示的效果，想确认当前存储方式是否有误，以及正确的实现方案。我已做过的尝试包括：

• 查阅Next.js中React Context的官方使用文档，未发现操作错误；
• 逆向分析next-themes的实现逻辑，但未能完全理解其规避延迟的机制；
• 改用Zustand替代Context，仍存在相同的短暂加载延迟问题，暂未找到Zustand用户的相关解决方案。

更新1 #

尝试多种方法消除延迟均未成功，目前暂时接受这是SSR的固有特性——服务端渲染页面会在客户端组件挂载前加载（生产环境下时间差会缩小）。观察到next-themes似乎通过等待检测到html标签和媒体查询后再显示页面来规避该问题。我已实现骨架组件避免布局偏移，但仍希望找到能让信息立即加载的方案。

更新2 #

在测试环境中改用Zustand替代Context，依旧存在相同的短暂加载延迟问题，想了解Zustand用户是如何解决该问题的，目前尚未找到成功案例。

内容的提问来源于stack exchange，提问作者Zev Ross