Preconnect and Font Optimization
Font Optimization for Ekvastra.in:
Using display=swap
with a font stylesheet provides the use of font swap feature of modern browsers.
The following allows for faster font loading:
<link rel="dns-prefetch" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
2022 April update: I have taken the leap and self hosted the font. So it is one font specified in the one css that I already use and it downloads one woff2 file from my server. This eliminates connection to 2 more servers and download of 4 more files. That is significant! I have also moved away from swap and taken the risk of display=block to reduce Cumulative Layout Shift.
I also use link preload in my html header to load the font file in parallel with the CSS.