add preloadFonts function to Front controller

Author: yuriipavlov

src/Base/Hooks.php

@@ -91,6 +91,8 @@ public static function initHooks(): void
         add_action('wp_enqueue_scripts', [Handlers\Front::class, 'loadFrontendJsData']);
         add_action('style_loader_src', [Handlers\Front::class, 'addFileTimeVerToStyles'], 20, 2);
         add_action('send_headers', [Handlers\Front::class, 'addNoCacheHeaders']);
+        // Preload critical fonts to avoid layout shift on load
+        add_action('wp_head', [Handlers\Front::class, 'preloadFonts'], 0);
         // Change excerpt dots
         add_filter('excerpt_more', [Handlers\Front::class, 'changeExcerptMore']);
         // Add GTM code

src/Handlers/Front.php

@@ -18,6 +18,32 @@
  */
 class Front
 {
+    /**
+     * Preload critical webfonts to reduce FOIT/FOUT and layout shift
+     *
+     * @return void
+     */
+    public static function preloadFonts(): void
+    {
+        // Only run on the frontend and not in admin or feed requests
+        if (is_admin() || is_feed() || is_robots()) {
+            return;
+        }
+
+        $fonts = [
+            'fonts/roboto/roboto-v30-latin-regular.woff2',
+            'fonts/roboto/roboto-v30-latin-500.woff2',
+        ];
+
+        foreach ($fonts as $relativePath) {
+            $href = SK_ASSETS_URI . $relativePath;
+            $path = SK_ASSETS_DIR . $relativePath;
+            $ver  = file_exists($path) ? filemtime($path) : null;
+            $hrefWithVer = $ver ? add_query_arg('ver', $ver, $href) : $href;
+            echo '<link rel="preload" href="' . esc_url($hrefWithVer) . '" as="font" type="font/woff2" crossorigin="anonymous">' . "\n";
+        }
+    }
+
     /**
      * Load critical assets before blocks assets
      *