How to Optimize Fonts and Improve Loading Performance

This guide documents the actual Font Optimization settings available in ZiziCache and explains how each option improves performance and user experience.

Where to configure

1. Open ZiziCache → Fonts.
2. Enable Font Optimization.
3. Configure the options listed below and save.

Font Optimization Settings

• Enable Font Optimization — Master switch that enables all font optimization features.
• Add font-display: swap — Shows fallback text while fonts load to prevent invisible text (FOIT).
• Optimize Google Fonts — Hosts Google Fonts locally for better privacy and performance.
• Auto-detected Font URLs (read-only) — Shows automatically detected critical font URLs. Use Detect fonts & Generate CSS to populate this list. Auto-detection is available when Google Fonts optimization is enabled.
• Manual Font URLs — Add your own font URLs to preload (one per line). These are added after auto-detected fonts.
• Only preload WOFF2 fonts — Limits preloading to WOFF2 for best compression and broad modern support.
• Enable Font Debug Logging — Outputs detailed font optimization information to the browser console and WordPress logs.
• Automatic Font Optimization — Automatically regenerates optimized CSS based on collected font statistics (respects page cache lifespan).

Font Statistics

ZiziCache collects font usage data to help you reduce unused fonts and variants.

• Detected Fonts table — Lists fonts, pages, weights, and type (Google, Local, Other).
• Summary badges — Font families and total variants counters.
• Detect fonts & Generate CSS — Collects font statistics and triggers optimized CSS generation.
• Reset statistics — Clears collected font data and resets counters.

Language & Unicode-Range Priority

Prioritizes unicode ranges for the selected language to reduce font payload size and improve loading times.

• Auto — Detects language from WordPress locale.
• Latin, Cyrillic, Greek, Vietnamese, Arabic, Hebrew, Japanese, Korean, Chinese (Simplified), Chinese (Traditional), Thai, CJK
• Preserve all subsets — Conservative option for multilingual sites.

Advanced Font Settings (Developer Hooks)

ZiziCache exposes hooks to customize font behavior programmatically:

• zizi_cache_font_preload_urls — Modify the list of fonts to preload.
• zizi_cache_before_font_optimization — Execute code before font optimization runs.
• zizi_cache_after_font_optimization — Execute code after font optimization runs.

Benefits

• Faster text display and improved perceived performance.
• Lower CLS by preventing layout shifts during font loading.
• Improved LCP by preloading critical fonts.
• Better privacy and reliability when hosting Google Fonts locally.

Tips

• Limit font families and variants to what your design really needs.
• Preload only above-the-fold fonts for the best performance balance.
• Use debug logging temporarily for troubleshooting, then disable it.