Fix Render-Blocking Font Loading

How to optimize donafp.com

Next.js SiteScore: 46/100Analyzed May 2026Re-analyze this site

Fix Render-Blocking Font Loading

High Impact+25 points estimated

Why It Matters

Google Fonts are blocking first paint for 1.65 seconds, severely delaying LCP and FCP.

How to Fix

Add font-display: swap to Google Fonts URLs and preload critical font files. In Next.js, use next/font/google to automatically optimize font loading with proper fallbacks. Consider self-hosting fonts for better control over loading strategy.

0Poor

What This Score Means

A score of 46 falls in the "Poor" range (50-89). While it is better than poor (0-49), you should aim for 90+ to provide an optimal user experience and maximize SEO benefits.

This site is slower than approximately 35% of similar sites. The main issues affecting performance are image optimization, JavaScript execution time, and layout stability.

Addressing these issues could improve your conversion rate by 15-20% and boost your search engine rankings.

Core Web Vitals Analysis

LCP

Largest Contentful Paint

7.0s
Poor

Good: < 2.5s

Measures how long it takes for the main content to appear on screen

INP

Interaction to Next Paint

953ms
Poor

Good: < 200ms

Measures how quickly the page responds to user interactions

CLS

Cumulative Layout Shift

0.00
Good

Good: < 0.1

Measures visual stability - how much content shifts during page load

AI Performance Analysis

This Next.js/React site has poor performance with a score of 46/100. The biggest problem is render-blocking font requests from Google Fonts, which are delaying page loading by 1.65 seconds and causing your Largest Contentful Paint to reach a sluggish 7 seconds. The site is also suffering from excessive JavaScript execution time (1.7 seconds) and has 55KB of unused JavaScript code that could be removed. Optimizing font loading by preloading or self-hosting fonts, reducing unused JavaScript, and compressing images could improve your score by 30+ points and dramatically enhance user experience.

Other Optimization Recommendations

Optimize JavaScript Bundle Size

High Impact+18 points estimated

Why It Matters:

Heavy JavaScript parsing takes 900ms and creates 990ms of blocking time, preventing user interactions.

How to Fix:

Enable Next.js tree shaking by importing only used components. Use dynamic imports with next/dynamic for non-critical components. Remove unused code from framework chunks and consider code splitting at route level to reduce initial bundle size.

Eliminate Element Render Delay

High Impact+15 points estimated

Why It Matters:

LCP element has 3.2 second render delay causing the poor 7-second LCP score.

How to Fix:

Move critical CSS inline or use Next.js built-in CSS optimization. Ensure the LCP text element loads without JavaScript dependencies. Use Next.js Image component with priority prop for above-the-fold images to prevent layout shifts.

Keep Your Site Fast After Optimization

Once your site is optimized, maintain that speed. Use DeployHQ for zero-downtime, automated deployments—so performance fixes and updates go live safely every time, without breaking your site.

Explore DeployHQ →Trusted by engineering teams shipping high-performance sites

Want to Analyze YOUR Website?

Get AI-powered performance insights with actionable fixes in 30 seconds

More Next.js Speed Tests

Next.js Performance Resources

Frequently Asked Questions