Text rendering cost.
WHAT FONTS COST
A download per family and weight, and potentially a delay before text appears.
WHAT TO DO
Limit families and weights to those actually used Use modern compressed font formats Subset to the characters needed, where practical Preload critical fonts
WHAT TO CONFIGURE
How text behaves while the font loads.
WHAT THE OPTIONS ARE
Text invisible briefly, then shown Text shown immediately in a fallback, then swapped
WHAT TO PREFER USUALLY
Showing text immediately.
WHY
Invisible text is worse than differently styled text.
WHAT TO CHECK
That the fallback does not shift the layout dramatically when swapped.
WHAT STYLES COST
Blocking rendering until downloaded.
WHAT TO DO
Keep stylesheets small Remove unused rules Consider inlining what is needed for the initial view
WHAT TO AVOID
Importing stylesheets from within stylesheets, which serialises downloads Very large frameworks where a fraction is used
WHAT TO AUDIT
How much of your stylesheet is actually used.
