Support » Plugin: Autoptimize » Inline and Defer CSS extreme render blocking

  • When I use the Inline and Defer CSS option (with CriticalCSS enabled) the css file generated has much more of a wait time — especially on mobile. It’s the only thing I am getting that isn’t positive out of keeping the Inline and Defer CSS option on. Is there anyway to minimize this? Can I preload this file?

    • This topic was modified 5 months, 4 weeks ago by clonemykey.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    OK, so first of all; the deferred full CSS is not render-blocking, as you have the “above the fold CSS” doing the initial rendering. check the pagespeed insights opportunities and you’ll indeed no longer see the CSS marked as being render-blocking šŸ™‚

    But as the full CSS is loaded with media-type print (to ensure it is not render-blocking), browsers will load it with lower priority (allowing other assets with higher priority to be loaded sooner) and thus indeed taking longer to load. Additionally you seem to be using a CDN, which might add to the time it takes to load the asset if not present on the CDN yet?

    That being said; you can use below snippet to preload the CSS-file(s) and test the difference (it will have higher priority, but as such might compete with other resources in low-bandwidth context);

    
    add_filter( 'autoptimize_fitler_css_preload_and_print', '__return_true' );

    hope this helps,
    frank

    Thread Starter clonemykey

    (@clonemykey)

    Appreciate it, I’ll give that a try. With the brand new GTMatrix now using lighthouse at a much more granular level than PageSpeed a whole new list of areas to fix are coming up. The CSS file that I misspoke and said was render blocking is listed as “waiting” in the waterfall of GTmatrix for 300ms.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.