fix: preload Inter font and use font-display: optional

[franklinjavier]

Summary

• Preload the latin Inter woff2 font file so it's available before first paint
• Switch font-display from swap to optional — the browser uses the font if cached, otherwise sticks with the fallback, eliminating text reflow CLS

Test plan

• Hard refresh home page — H1 and body text should not reflow/shift
• Verify Inter font still loads and displays on subsequent navigations

Summary by CodeRabbit

• Performance
  • Optimized font loading through resource preloading to improve initial page performance
  • Adjusted font display rendering strategy for enhanced visual consistency

[netlify]

👷 Deploy request for tanstack pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	62d6d55

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 9ab39890-13be-4a52-9076-9d3cca5b0224

📥 Commits

Reviewing files that changed from the base of the PR and between e71479b and 62d6d55.

📒 Files selected for processing (2)

• src/routes/__root.tsx
• src/styles/app.css

---

📝 Walkthrough

Walkthrough

The changes optimize font loading performance by adding an Inter font preload link to the root route's head configuration and adjusting the font-display CSS property from swap to optional in the app stylesheet.

Changes

Cohort / File(s)	Summary
Font Loading Optimization src/routes/__root.tsx, src/styles/app.css	Added preload link for Inter font in root route head configuration with proper crossOrigin attribute. Changed font-display property from swap to optional for both Inter unicode-range variants in CSS to refine font rendering behavior during load.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A font so fleet, now preloaded with care,
From swap to optional, lighter than air,
Inter takes flight on the web's swift course,
Performance enhanced, of course, of course! 🚀✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately and concisely describes the two main changes: preloading the Inter font and updating font-display to optional for reducing layout shift.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}