fix: Improve loading experience with proper page-ready signaling #378
+404
−256
Conversation
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
- Replace pathname-based loading hide with explicit page-ready signal - Loading overlay now persists until page content is actually rendered - Add 10-second safety timeout to prevent infinite loading states - Add memoization to ClimbCard, BoardRenderer, and BoardLitupHolds - Add Suspense boundary with skeleton fallback to board layout - Create PageReadySignal component to signal when pages are ready This fixes the "freeze" at the end of loading where the overlay would disappear before the page content was rendered, causing a blank screen. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Convert string keys from Object.keys() to numbers for LitUpHoldsMap indexing. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The component uses AntD components which need to be client-side rendered. Also use modular antd imports for better tree-shaking. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Re-add pathname change detection with 2-second delay as fallback - Use refs to track loading state for reliable timeout checks - Keep 10-second ultimate timeout as safety net The loading will now hide: 1. Immediately when signalPageReady() is called 2. After 2 seconds when pathname changes (fallback) 3. After 10 seconds no matter what (safety net) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add ClimbCardTitleSkeleton matching horizontal layout with V grade - Add BoardRendererSkeleton with board background and hold circles - Add CardActionsSkeleton with action button placeholders - Use theme tokens for consistent styling 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Use actual AntD Card actions prop with real icons (muted color) - Simplify board renderer skeleton to just a placeholder area - Match the card structure: header, body, actions - Adjust sizes for better visual match 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Remove unnecessary Promise.all wrappers around single promises in layout.tsx and page.tsx - Remove leftover debugger statement in board-config-live-preview.tsx
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
- Convert BoardPageSkeleton to server component (removed 'use client')
- Use Ant Design Skeleton components instead of custom divs
- Improve ClimbCard memo comparison:
- Add areActionsEqual helper for proper array comparison
- Handle empty arrays case (actions={[]})
- Add fallback boardDetails comparison by identifiers
- Better structured comparison logic with early returns
Ant Design Skeleton components with animations require client-side rendering. The server component approach caused hydration errors.
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.
This fixes the "freeze" at the end of loading where the overlay would
disappear before the page content was rendered, causing a blank screen.
🤖 Generated with Claude Code
Co-Authored-By: Claude Opus 4.5 noreply@anthropic.com