Skip to content

fix: improve LCP by SSR-ing welcome screen and preloading hero images#210

Open
hhvrc wants to merge 5 commits into
developfrom
fix/lcp-ssr-improvements
Open

fix: improve LCP by SSR-ing welcome screen and preloading hero images#210
hhvrc wants to merge 5 commits into
developfrom
fix/lcp-ssr-improvements

Conversation

@hhvrc

@hhvrc hhvrc commented Jun 11, 2026

Copy link
Copy Markdown
Contributor
  • SSR the welcome screen for new visitors using a cookie read in +layout.server.ts
  • Unmount it via a close callback once dismissed
  • Add <link rel="preload"> and fetchpriority="high" to hero SVGs on the home page and welcome screen
  • Migrate welcome state from localStorage to cookies so the server can skip rendering it on return visits
  • Fix hasSeenWelcome() to check cookies so the deferred tour prompt still works for new users

@hhvrc hhvrc self-assigned this Jun 11, 2026
Copilot AI review requested due to automatic review settings June 11, 2026 14:53
@hhvrc hhvrc added the enhancement New feature or request label Jun 11, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR aims to improve LCP for first-time visitors by server-rendering the welcome screen based on a cookie, and by preloading/prioritizing hero SVGs so critical imagery is available earlier in the render path.

Changes:

  • SSR-gate the welcome screen via +layout.server.ts and unmount it via a close callback from +layout.svelte.
  • Migrate “welcome seen” state from localStorage to a cookie (with a localStorage fallback for migration) and update checks accordingly.
  • Add <link rel="preload"> and fetchpriority="high" to key SVG assets on the home page and welcome screen.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 5 comments.

Show a summary per file
File Description
src/routes/WelcomeScreen.svelte Converts welcome rendering to be parent-controlled (SSR-visible), adds preload + fetchpriority, and introduces a close() prop for unmounting.
src/routes/+page.svelte Preloads and prioritizes the home page hero SVGs for faster first paint/LCP.
src/routes/+layout.svelte Conditionally mounts/unmounts WelcomeScreen based on SSR-provided data.showWelcome.
src/routes/+layout.server.ts Reads the welcome cookie to decide whether the welcome screen should be SSR-rendered.
src/lib/tour/onboarding-state.ts Switches welcome state to cookies (with migration fallback) and updates hasSeenWelcome()/markWelcomed().

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/routes/WelcomeScreen.svelte Outdated
Comment thread src/routes/+layout.server.ts Outdated
Comment thread src/lib/tour/onboarding-state.ts
Comment thread src/lib/tour/onboarding-state.ts
Comment thread src/lib/tour/onboarding-state.ts Outdated
LucHeart
LucHeart previously approved these changes Jun 11, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.

Comment thread src/lib/tour/onboarding-state.ts
Comment thread src/routes/+layout.server.ts
Comment thread src/routes/+layout.server.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants