fix(projects): render project loading shell immediately - #514
Merged
huyanxius merged 2 commits intoAug 21, 2026
Conversation
The aggregated project request leaves the page blank until list data arrives. Render the create entry and pixel-matrix project placeholders while the request is pending. Users retain project context without restoring per-project preview requests.
The loading shell must remain visible before project data resolves. Gate the project request and assert the create entry, placeholders, and accessible status. The regression test also verifies cleanup when real cards replace the shell.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
xyh202131
approved these changes
Aug 21, 2026
xyh202131
left a comment
Contributor
There was a problem hiding this comment.
已复核当前提交:项目列表请求期间立即呈现可访问的加载壳与新建入口,数据返回后原位替换,不恢复逐项目请求瀑布;加载、错误、分页与清理行为有测试覆盖。当前 CI 全部通过且无未解决审查线程。
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
项目中心现在会在
/projects请求返回前立即呈现新建项目入口和三张项目卡片骨架,避免聚合请求期间页面近乎空白,同时保留单请求性能优化。Why
PR #431 将项目预览聚合进项目列表请求后,页面速度明显提升,但请求返回前只剩一行“正在读取项目…”;创建入口和项目布局会整块延后出现,形成突兀的空白等待。
Changes
Implementation
PixelMatrix作为预览区加载反馈,元数据使用低对比静态占位。/projects请求,不恢复逐项目/characters请求,也不新增动画依赖或样式文件。role="status"、aria-busy="true"暴露加载状态,并将装饰骨架从辅助技术中隐藏。Verification
npm test -- src/pages/projects/index.test.tsx:1 个测试文件、9 个测试通过。npx oxfmt --check src/pages/projects/index.tsx src/pages/projects/index.test.tsx:2 个文件通过。npx oxlint src/pages/projects/index.tsx src/pages/projects/index.test.tsx:通过,无错误。VITE_API_BASE_URL=/api npm run build:类型检查与生产构建通过;仅保留既有 chunk-size 警告。git diff --check:通过。/projects的真实浏览器检查:加载骨架稳定显示,视觉验收通过。Screenshots
Desktop
Scope
Related Issues
Closes #510
Refs #431