Open youngBrain1893 opened 1 week ago
当前组件的 activate 和 freeze 两个阶段 组件渲染 和 eventBus 执行 顺序不一致,是否可保持统一
activate -> freeze: 先触发 eventBus,等待 1s 触发 freeze(冻结 React 组件) 相关代码:https://github.com/CJY0208/react-activation/blob/master/src/core/Keeper.js#L98-L113
this.eventBus.emit(LIFECYCLE_UNACTIVATE) const listeners = [...this.listeners] listeners .reverse() .forEach(([, listener]) => run(listener, [LIFECYCLE_UNACTIVATE])) // 缓存后,延迟冻结,保证各项后续处理得以进行,如关闭弹窗等 clearTimeout(this.freezeTimeout) this.freezeTimeout = setTimeout(() => { flushSync(() => { this.safeSetState({ freeze: true, }) }) }, 1000)
freeze -> activate: 立即触发 unfreeze(React 组件渲染),而后在 eventBus 相关代码:https://github.com/CJY0208/react-activation/blob/master/src/core/Keeper.js#L90-L93
// 激活后,立即解冻 this.safeSetState({ freeze: false, }) this.eventBus.emit(LIFECYCLE_ACTIVATE)
问题:由于先解冻,在触发 eventBus,从 freeze 到 activate 阶段第一次渲染无法感知到是缓存态的渲染还是已经激活后的渲染 我们的业务场景上使用 use-query-params(需要在缓存时使用进入缓存前的值(保证进入缓存到 freeze 的 1s 内不触发额外 url 变更响应),激活后使用最新的值)
不太明白你的场景是什么,能具体举例说明吗?听起来是缓存时延迟 freeze 导致了你们的 useQueryParams 获取了异常值,解冻时取到的值可能存在问题
当前组件的 activate 和 freeze 两个阶段 组件渲染 和 eventBus 执行 顺序不一致,是否可保持统一
activate -> freeze: 先触发 eventBus,等待 1s 触发 freeze(冻结 React 组件) 相关代码:https://github.com/CJY0208/react-activation/blob/master/src/core/Keeper.js#L98-L113
freeze -> activate: 立即触发 unfreeze(React 组件渲染),而后在 eventBus 相关代码:https://github.com/CJY0208/react-activation/blob/master/src/core/Keeper.js#L90-L93
问题:由于先解冻,在触发 eventBus,从 freeze 到 activate 阶段第一次渲染无法感知到是缓存态的渲染还是已经激活后的渲染 我们的业务场景上使用 use-query-params(需要在缓存时使用进入缓存前的值(保证进入缓存到 freeze 的 1s 内不触发额外 url 变更响应),激活后使用最新的值)