SOLVED: Custom fonts loading is very slow and create CSL on frontend

How To
1

Hello,

I’m developing a website and I want to use Google Fonts.
I have followed the procedure described here to store them locally: Custom Fonts – Bricks Academy (bricksbuilder.io)

I added two custom fonts to Bricks in the WOFF2 format.

image
image3496×578 84.4 KB

However, I have noticed that the fonts are loaded veeery slowly on page loading, showing first a fallback/default font, which also creates Cumulative Shift Layout problems.

How is possible that the loading of self-hosted fonts takes more time than using Google Fonts?

Here is the website if you want to check it out by yourself: https://visiondev.it/

Does someone have any suggestions on how to improve the font loading speed?

I have also noticed that the fonts loading appears to happen very late in the waterfall

image
image2248×760 68.5 KB

Thank you!!

2

We’ve added a “Preload custom fonts” setting (Bricks » Settings » Performance) in Bricks 2.0 RC2, now available as a manual download in your account (see changelog).

Please let us know if you are still experiencing issues.

As with any pre-stable release, please do not use it on a production website. It is intended for testing in a local or staging environment only.