cancel
Showing results for 
Search instead for 
Did you mean: 

Performance issue using font

Performance issue using font

Dear All,

 

My client has created a website, developing a React application that incorporates Adobe Font. This application is being integrated into a webpage for the benefit of their customers.

 

Whenever we tried to use Adobe Font we got a performance issue using the Google speed test.

 Is there any recommended setting for the fonts so that we don't get performance issues during the page load?

1 REPLY 1

Re: Performance issue using font

Here are some recommendations for improving font performance in Magento when using Adobe Fonts to avoid page speed issues:

1. Limit the Number of Fonts - Only include font families/weights absolutely necessary for the desired design. Fewer custom fonts means fewer requests.

2. Set Optimal cache TTL for Font Files - Configure the browser cache expiry duration for Adobe Font files to 1 year using `.htaccess` rules. This prevents repeat downloading of static assets.

3. Preload Key Fonts - Use `<link rel="preload">` to prioritize loading of essential fonts that impact above-the-fold content first.

4. Enable GZIP Compression - GZIP compressing font file transfers can reduce transfer size by 50-70% making delivery faster over the wire.

5. Convert Fonts to WOFF2 - WOFF 2.0 Web Font format offers 30% better compression than formats like TTF/OTF. Use the WOFF2 versions fonts predominantly.

Additionally, utilizing a Magento optimized Managed Hosting provider is vital for the best page speed results. Their global CDN and fine-tuned server caching layers minimize origin requests to accelerate font delivery from locations nearest end-users. Expert configuration guarantees excellent performance for custom fonts.