The browser will hide the text for about 100ms and, if the font has not yet been downloaded, will use the fallback text. Gives the font face an extremely small block period and a short swap period.Īcts as a compromise between the auto and swap values. This is also known as a “flash of unstyled text” (FOUT). It instructs the browser to use the fallback font to display the text until the custom font has been fully downloaded. Gives the font face an extremely small block period.

This is also known as a “flash of invisible text” (FOIT). More accurately, the browser draws the text with an invisible placeholder and then swaps it with the custom font face as soon as it loads. Instructs the browser to briefly hide the text until the font has fully downloaded. This can be done via our setting called “ Override font rendering behavior,” found under the “ Fonts” tab in the NitroPack dashboard.Īllows the browser to use its default method for loading, which is most often similar to the block value. NitroPack now allows you to configure default font rendering behavior. Improving web performance, and especially font behavior is a challenging task.Īpart from all our effective features like: This hurts the user experience on your web pages and adds to why a site visitor might abandon your website. What happens is some browsers hide the text until the fonts are loaded to address this loading gap, resulting in a flash of unseen text. The issue occurs when the fonts you use on your page do not exist on your visitor’s device, meaning they first need to be downloaded to load. You just ran a performance audit on PageSpeed Insights, and Lighthouse has recommended: “Еnsure text remains visible during webfont load.”

Invisible text html