Blog

Introducing Automatic Font Preload in Akamai Ion’s Adaptive Acceleration

June 18, 2019 · by Carm Janneteau ·
Categories:

Akamai Adaptive Acceleration, the performance-optimization feature set included with Ion, now has a new capability: Automatic Font Preload. This new capability, like all of the Adaptive Acceleration capabilities, is a low-touch, automated approach that’s designed to give you instant website optimization and acceleration.

What is font preload? (And what happens behind the scenes?)

Preloading is a mechanism by which a CDN edge server can inform a browser about a needed resource (in this case, a font) for rendering a page without waiting for the browser to fully process all the resources for that page. Preloading allows the CDN edge server to suggest that the browser download a resource before the browser has processed the base request, which ultimately improves document load time. 

As an example, let’s look at a Google font: typically, a page would have to include a CSS file that references the font. Before a browser could fully render the page, all of the following needs to happen:

  • The page must be processed
  • The CSS file must be fetched
  • That CSS must be parsed
  • The font must be requested 

That’s a lot of activity, and it takes a long time. But if you’re using Adaptive Acceleration's Automatic Font Preload, the fetch starts — and, as a result, the font arrives — sooner. Specifically, when Adaptive Acceleration detects that a font is needed for a page, it tells the CDN edge server to include a preload header pointing at the required font. That means the browser can start downloading the font earlier than in a traditional setup as outlined in the four bullet points above.

Getting started with Automatic Font Preload

If you're already using Adaptive Acceleration, there's no action needed; Automatic Font Preload is already working for you. If not, let's get you started. Just like the other automated capabilities within Adaptive Acceleration, Automatic Font Preload is an easy-to-enable, low-touch optimization. Here’s all you need to do to begin:

  1. Ensure you have Adaptive Acceleration enabled as part of your Akamai Ion config. To do this, open Akamai Control Center, go to your Ion config, and add the Adaptive Acceleration behavior. The font preload capability is automatically enabled as part of this process.
  2. With Adaptive Acceleration enabled, you can check which resources are preemptively pushed, preconnected and preloaded (which will now include fonts) through the Push, Preconnect, and Preload Report (see sample report below) on the Adaptive Acceleration policy page in Akamai Control Center.
    Screenshot - push preconnect report
    A sample Push, Preconnect, and Preload Report

     

If you’re an Akamai Ion customer, we encourage you to start using Adaptive Acceleration’s Automatic Font Preload today. If you’re not currently an Ion customer, we encourage you to sign up for a free trial of Ion that includes Adaptive Acceleration and much more here.

For more on Adaptive Acceleration, see our recent “Introducing the Adaptive Acceleration Reset Feature for Ion” blog post.

Carm Janneteau is a senior product manager at Akamai Technologies.