Learn how to add an HTML <rel=preload> tag to the header in WordPress.
A function that I have used to enable preloading CSS effectively is:
/**
* @snippet Update preloading CSS on WordPress site
*/
function add_rel_preload($html, $handle, $href, $media) {
if (is_admin())
return $html;
$html = <<<EOT
<link rel='preload' as='style' onload="this.onload=null;this.rel='stylesheet'"
id='$handle' href='$href' type='text/css' media='all' />
EOT;
return $html;
}
add_filter( 'style_loader_tag', 'add_rel_preload', 10, 4 ); Similarly you could try this for JS and Webfonts, but this has only been tested with CSS.