Does your website belong to the 89% that use Google Fonts? Did you know that as soon as you start using externalised fonts such as Google Fonts, you run the risk of performance problems linked to Third Parties? Google Fonts are, in fact, part of the critical page rendering path: they are a required resource for text display.
With images taking up ever more space on our webpages, it is ever more crucial to keep their weight to a minimum, especially on mobile. According to HTTP Archive, the average webpage in 2019 displays approximately 1 MB of images (median), and the images on a page account for 900 KB out of 1,700 KB (53%).
Once you have inevitably compressed it, how do you serve an image in the right dimensions for different screen sizes? In the wake of our predictions in favour of srcset, we decided to set ourselves a new webperf challenge for 2019: resizing images!
Following a healthier, lighter diet also applies to CSS, and the latter will become heavy if it has to put up with base64-encoded fonts. Fasterize helps you optimize your loading times by outsourcing fonts instead of embedding them in CSS, a critical resource that the browser needs to load as quickly as possible. The result? Pages are displayed faster thanks to a better Start Render.
Maybe you’ve already heard people talking about Early Hint? Or perhaps the HTTP 103 code? This feature, which is currently being standardized by the W3C, can be used to preload page resources even before receiving the first byte of content. Unfortunately, currently, HTTP 103 is very rarely used by browsers, despite the benefits it offers in terms of loading speed. To address this, our technical team has developed an optimization that allows our customers to preload a non-cacheable page’s resources – we’d like to introduce you to Early Hint!
When you’re holding Sales promotions or on Black Friday/Cyber Monday, or any trafic peak or laod peak period, an overflow page – or traffic easing system – allows you to define a maximum number of active sessions to keep your servers up and running, thus minimizing the loss of potential customers. This feature, which we call Traffic Limiter on our platform, is available for all our users, and is easy to enable from the dashboard.
In our article Webperf: Optimizing font loading, we demonstrated the impact that font loading can have on site performance.
In particular, we noticed that the Speed Index and the Start Render fell by an average of 5 to 10% when fonts were not loaded.
When it comes to font optimization, the tool that’s generally recommended is Font-Squirrel. It’s a fantastic tool, but it does have the drawback of being manual. So we decided to retain its best features to develop our own automatic font optimization engine.
Here, we’ll cover:
Have you heard about Insight, the Fasterize solution that allows you to analyse rapidly and for free the speed of your website? Thanks to Insight, you could be taking the first step towards the optimization of your web performance: a preliminary diagnosis which is essential to make your website faster, improve the user experience and thus generate more business. Here's how and why you should use it without moderation.
It is often difficult to get the right trade-off between image quality and loading speed.
The ideal solution would be for each image to be adapted on a user-by-user basis: be that clipping it perfectly to the user's device screen, stripping metadata of any unnecessary information or, of course, ensuring that it is displayed with optimum image quality. But achieving this soon becomes something of a black art.
Given this challenge, our technical team has pored over the plethora of best practices and advanced libraries out there to ensure that Fasterize implements the very best in image compression algorithms.
In this article, we present an overview of the various methods used.