UI: Performance issue in `ProjectItem` component
In the ProjectItem component, we convert ProjectData to Project by using Project.loadFromCloud. This involves downloading all project files, but we only need the first sprite's costume for the ProjectItem thumbnail. Downloading all files causes a delay in displaying the thumbnail, affecting UX.
Possible solution: Download only the necessary data for the thumbnail, such as the first sprite's costume, instead of all files.
现在 Project 中的文件(图片、音频等)是通过 File(src/models/common/file.ts) 封装的,它们的加载会被推迟到被使用;此外 config(.json)与代码(.spx)文件的内容会被立刻加载,其中立刻读取 config 的内容是合理的,比如只有读取 sprite 的 config 内容才能知道它的“当前 costume”是什么;而对代码文件内容的读取是可以像图片、音频一样被延后的,这也会有助于我们实现 #369 —— 以 File 实例的形式持有 sprite/stage 的代码会可以自然地实现“未变更的代码不去重复上传”
总结一下,目前 ProjectItem 中应该会加载这些(来自 OSS 的)文件:
- 第一个 sprite 的“当前 costume”对应的图片文件:符合预期
- project 的配置:符合预期
- stage 的代码:可以被省掉 fix in #508
- 所有 sprite 的配置 & 代码:
- 所有 sprite 的代码可以被省掉 fix in #508
- 第一个 sprite 的配置符合预期
- 其他 sprite 的配置可以被省掉 fix in #617
其他 sprite 的配置可以被省掉(这个实现起来可能会稍微麻烦一点)TODO
还剩这个 TODO,低优先级解决
其他 sprite 的配置可以被省掉(这个实现起来可能会稍微麻烦一点)TODO
在 #617 中我们将配置(对应 JSON 文件)及代码内容 inline 到 files 中,因此配置不再需要单独向 OSS 请求