🐛 Bug - Brief visual glitch appears at top of Tina-docs pages on hard refresh or slow network

[0xharkirat]

Requested by: @0xharkirat via YakShaver.ai 🦬
cc: @Marxoz, @isaaclombardssw, @0xharkirat, @adamcogan, @joshbermanssw

Hi Team!

  🟥  Watch the video (1 min 30 sec)

  Url from screen share: https://tina.io/tinadocs/docs

Pain

When loading Tina-docs pages on a slow network or performing a hard refresh, an unexpected and visually broken UI element briefly appears at the top of the page. This flicker is noticeable during hard reloads (Cmd+Shift+R / Ctrl+Shift+R) and when navigating away from and back to Tina-docs. The issue is transient but visible enough to negatively impact perceived quality and user experience.

Acceptance Criteria

1. No unexpected or broken UI elements appear at the top of the page during initial load.
2. Hard refresh (Cmd+Shift+R / Ctrl+Shift+R) does not show any visual glitches.
3. Navigating away from Tina-docs and returning does not show the visual artifact.
4. Behavior is consistent across normal and throttled (e.g., Slow 4G) network conditions.
5. Fix is verified in latest supported browsers.

Reproduce Steps

1. Open the Tina-docs website.
2. Open browser developer tools and set network throttling to 'Slow 4G'.
3. Perform a hard refresh (Cmd+Shift+R on Mac or Ctrl+Shift+R on Windows).
4. Observe a brief, broken-looking UI element at the top of the page.
5. Navigate to another page (e.g., homepage) and return to Tina-docs.
6. Observe the same visual glitch appearing briefly again.

Screenshot

Figure: UI artifact briefly flashes at top of DinoDocs on hard refresh