Skip to content

fix: replace render-blocking @import with <link> tags for Google Fonts#866

Open
Pcmhacker-piro wants to merge 1 commit into
SAPTARSHI-coder:mainfrom
Pcmhacker-piro:fix/render-blocking-fonts-844
Open

fix: replace render-blocking @import with <link> tags for Google Fonts#866
Pcmhacker-piro wants to merge 1 commit into
SAPTARSHI-coder:mainfrom
Pcmhacker-piro:fix/render-blocking-fonts-844

Conversation

@Pcmhacker-piro
Copy link
Copy Markdown

  • Removed @import url('...Inter...') from core/base.css (render-blocking)
  • Added <link rel=preconnect> + <link rel=stylesheet> for Inter font
    to README Quick Start, full HTML example, and granular imports
  • Updated docs/index.html with the same font <link> tags in <head>

Closes #844

Pull Request Description

CSS @import is render-blocking — it halts CSS parsing until the
font stylesheet downloads. Replaced with tags in HTML so
fonts start downloading immediately (no dependency on CSS parsing).

Type of Change

  • ✨ New animation / hover effect
  • 🧩 New component
  • 📝 Documentation improvement
  • 🐛 Bug fix in an existing submission
  • Other (describe below)

Performance fix — removes render-blocking font @import.

Submission Checklist

N/A — this PR fixes core framework files, not a user submission.

Notes for Maintainer

Users who add the CDN link without the Inter font will get
system font fallback (graceful degradation). Font preconnects
reduce DNS + TCP round trips before the font stylesheet is fetched.

- Removed @import url('...Inter...') from core/base.css (render-blocking)
- Added <link rel=preconnect> + <link rel=stylesheet> for Inter font
  to README Quick Start, full HTML example, and granular imports
- Updated docs/index.html with the same font <link> tags in <head>

Closes SAPTARSHI-coder#844
@Pcmhacker-piro
Copy link
Copy Markdown
Author

hey @SAPTARSHI-coder i fixed your assign issue so please check it

@SAPTARSHI-coder SAPTARSHI-coder added accepted Contribution approved for integration into EaseMotion CSS animation Animation effects, hover interactions, motion ideas, transitions component New UI components (buttons, cards, modals, tooltips, badges) enhancement New feature or request good first issue Good for newcomers GSSoC-26 Official GSSoC 2026 issue gssoc:approved Approved for GSSoC contributions integrated Successfully merged and included in the framework level:intermediate Requires moderate project understanding type:feature New functionality or enhancement labels Jun 2, 2026
@Pcmhacker-piro
Copy link
Copy Markdown
Author

heyy @SAPTARSHI-coder
i fixed the issue so pls check it

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

accepted Contribution approved for integration into EaseMotion CSS animation Animation effects, hover interactions, motion ideas, transitions component New UI components (buttons, cards, modals, tooltips, badges) enhancement New feature or request good first issue Good for newcomers gssoc:approved Approved for GSSoC contributions GSSoC-26 Official GSSoC 2026 issue integrated Successfully merged and included in the framework level:intermediate Requires moderate project understanding type:feature New functionality or enhancement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

### Google Fonts @import in base.css Is Render-Blocking

2 participants