Skip to content

fix: prevent leaderboard rank numbers flashing wrong positions on initial load#556

Open
saurabhhhcodes wants to merge 1 commit into
indresh404:mainfrom
saurabhhhcodes:fix/leaderboard-rank-flash
Open

fix: prevent leaderboard rank numbers flashing wrong positions on initial load#556
saurabhhhcodes wants to merge 1 commit into
indresh404:mainfrom
saurabhhhcodes:fix/leaderboard-rank-flash

Conversation

@saurabhhhcodes

Copy link
Copy Markdown

Description

Fixes #552

The leaderboard uses Firestore onSnapshot which fires twice on page load:

  1. First with cached data (instant) — sorting may be incomplete
  2. Then with correct server data

Previously, the loading state was removed after the first callback, causing the rank numbers to display incorrect positions for a brief moment before jumping to the correct order.

Change

  • Only hide the loading spinner when the data comes from the server (snapshot.metadata.fromCache === false)
  • Added a 5-second safety timeout so offline users don't see a permanent spinner

Testing

  • Load the leaderboard — no more rank flicker on initial render
  • Rank numbers should appear stable from the moment data is shown

…tial load

Wait for Firestore server data before hiding loading state. Cache data may
be unsorted/partial, causing rank numbers to flash incorrect values before
jumping to correct positions. Uses snapshot.metadata.fromCache with a 5s
safety timeout as fallback for offline scenarios.

Closes indresh404#552
@vercel

vercel Bot commented Jun 16, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ranker-hub Ready Ready Preview, Comment Jun 16, 2026 11:53am

@github-actions github-actions Bot added backend Backend/Firebase related changes bug Something isn't working enhancement New feature or request frontend Frontend related changes (HTML/CSS/JS/React) gssoc GirlScript Summer of Code gssoc26 GirlScript Summer of Code 2026 nsoc NSoC NSoC'26 NSoC 2026 pending-review PR is pending review labels Jun 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backend Backend/Firebase related changes bug Something isn't working enhancement New feature or request frontend Frontend related changes (HTML/CSS/JS/React) gssoc GirlScript Summer of Code gssoc26 GirlScript Summer of Code 2026 nsoc NSoC NSoC'26 NSoC 2026 pending-review PR is pending review

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: Leaderboard rank numbers flash wrong positions for a second on page load

1 participant