Autoptimize enabled still showing render blocking, how to fix it?

  • Resolved wpmhweb

    (@wppit)


    3 years, 7 months ago

    I have installed Async JavaScript and Autoptimize plugins. I enabled the Async JavaScript plugin, then in quick settings tried both option the Apply Async and the Apply Defer separately with Autoptimize, and Chrome lighthouse still shows rendering blocking problem, but now with the autoptimize css files.
    The Autoptimize plugin I just enabled the Optimize JavaScript Code and Optimize CSS Code with all the default settings, but again render blocking still happening. Most guides I checked only recommend default settings, and it works, but for me.
    How can I fix it?

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

    (@optimizingmatters)

    In Autoptimize look into the “inline & defer CSS” option, there’s more info in the AO FAQ.

    hope this helps,
    frank

    Thread Starter wpmhweb

    (@wppit)

    @optimizingmatters I see, my next question is: If I have multiple page and post templates, do I have to create the critical css for each post type and paste it below each one in the autoptimize plugin. Or when using something like jonassebastianohlsson.com/criticalpathcssgenerator only need to specify an URL and the tool will make the critical css for the entire site?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    when only using “inline & defer CSS” with the “above the fold CSS” form, you’ll need to have “critical CSS” that will be used on (and thus should “match”) all pages/ post types.

    if you use the “critical CSS” integration (which relies on the premium criticalcss.com service which is also by Jonas Ohlsson) you will automatically have CSS for each post type/ page.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Autoptimize enabled still showing render blocking, how to fix it?’ is closed to new replies.

Tags