popcodeorg / popcodeorg/popcode
Preload next iframe to use for preview
还没有人认领这个 Issue。
- 主要语言
- JavaScript
- 星标
- 191
- 派生
- 143
- 平均合并
- 4 天 11 小时
- 30 天内合并 PR
- 5
描述
Each time the current project changes, we load up a new project in a fresh iframe. We also keep the previous iteration of the preview frame in the DOM until the new one is fully ready, to ensure the smoothest possible transition.
However, with #2107, loading the next frame is a bit heavier weight, because it loads an actual HTML page with a JavaScript bundle attached. While all the loaded content is static and should be thoroughly cached, the browser still needs to parse everything every time. So, let’s proactively load a fresh iframe with preview.html before we are ready to put a compiled project in it.
One wrinkle here is that the collection of frames we are showing currently is keyed on compiledProjectKey, which is only generated when we start to compile an iteration of the current project. However we want to render this preloaded frame in advance of any compilation starting. Having given it only a little thought, I think the move is probably to shift our semantics a little bit and rename compiledProjectKey to previewFrameKey (if I’m not mistaken this fits all current usage of that property); and then add a nextPreviewFrameKey to Redux state, which is “popped” off each time we initiate project compilation, and replaced with a freshly-generated one.
贡献指南
这个仓库没有索引到贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
调研方向
首先跟踪现有的 iframe 生命周期、compiledProjectKey 的使用方式,以及项目编译相关的 Redux 状态。查看 preview.html 和 #2107 中描述的行为。完成的标准是:在编译前加载一个全新的预览 frame,然后在编译后的项目准备就绪时重新使用它,同时不影响现有的过渡行为。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- javascript
- 领域
- frontend, web-dev
- Issue 类型
- 功能
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 35/100