Optimize Google Fonts

🚀 From WP Rocket version 3.7 this feature is automatically enabled on new installations!

In this Article

About this optimization

When you use Google Fonts on your website this is what happens:

  1. There is an initial HTTP request to the Google font stylesheet, hosted at fonts.googleapis.com. There is usually 1 request per font that you have chosen.
  2. Then from within that stylesheet, the font itself is referenced and has to be downloaded, from fonts.gstatic.com

Optimize Google Fonts does three things to optimize these requests.

  1. If there are multiple requests to Google Fonts on the page, they will be combined into a single request. This will slightly reduce the number of overall HTTP requests. 
  2. Adds the display=swap parameter to the request, to satisfy PageSpeed's recommendation to ensure text remains visible during webfont load. This optimization will be applied even if there is only a single font request on your page. 
  3. Adds the preconnect resource hint to the request to improve load time of the fonts:
    <link href="https://fonts.gstatic.com" crossorigin rel="preconnect" />

This optimization is applied on all pages - both cached and uncached

Heads up! Ultimately, each font you use on your site has to be downloaded by the visitor's browser. The more fonts you use, the longer this takes. This option doesn't change that. It simply provides a small optimization to the requests. You should still be careful about adding too many fonts to your site :)

Unoptimized font requests

In the below screenshot there are 2 separate requests for Google fonts (click for full-size image).

Optimized font request

Here you can see both requests have been combined into a single request with the display=swap parameter added (click for full-size image).

The preconnect hint is also added: 

Updating from previous versions

If you updated to version 3.7 and did not previously have the option enabled, it won't be enabled after update. 

If you wish to activate it after updating, please visit the Tools tab and use the button provided:

Deactivate this option

If you wish to disable this option, you may do so with the helper plugin below.

📥   Download (.zip):  WP Rocket | Disable Google Font Optimization
Developers: You can find the code for this plugin on GitHub.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.