Support » Plugin: Autoptimize » Remove unused css suggested by google pages speed

  • Resolved raachotrekkers

    (@raachotrekkers)


    Hi. Google pagespeed is asking me to remove unused css. I’m getting this message on almost all of my pages/post. The code coverage tab on Google developer tool is showing 92.7% of the autoptimize css was unused.

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

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

    (@optimizingmatters)

    the short answer; AO just combines your original CSS and can’t (and shouldn’t) remove any of that.

    the longer answer:
    unused CSS is a curse in environments such as WordPress (or Joomla or Drupal or …) as each theme/ plugin adds CSS which covers all of the use cases where the plugin (or theme) can be used in. this means that each individual CSS-file on your site has _a lot_ of code in it that isn’t strictly needed on a random page of your site (or may even not be needed on your site at all).

    there currently is no way to automate the removal of unneeded CSS, but you might be able to get some improvement using e.g. “plugin organizer” to only allow plugins to work on specific pages) and by creating a child theme that only has the CSS needed for your site (you’ll have to dequeue the parent theme CSS though).

    hope this clarifies,
    frank

    Thanks Frank.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    you’re welcome 🙂

    hi there. similar topic for me. when i use sitevelocity crticial css almost all of my code is critical. so when i inline and defer the critical css the problem is i have the ‘remove unused css’. then when i switch to inline all css i have 2 of 1-lined css to render blocking. is there a way to solve this issue?

    • This reply was modified 10 months, 4 weeks ago by mybunnyb.
    Plugin Author Optimizing Matters

    (@optimizingmatters)

    maybe try another tool to generate your CCSS?

    hey,
    i also tried this one:
    https://jonassebastianohlsson.com/criticalpathcssgenerator/
    similar result, 30k letters was decreased to about 27k.
    The issue is when the critical css is inlined and deferred the same css code is also included in the AO css. Is there a way to prevent that? I tried to exclude the css in wp-content folder but it didnt really work out.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    It is normal for the full CSS to also have the critical CSS in it, the critical CSS is only for the initial rendering.

    The unused CSS is being reported as being Autoptimize’s, but AO merely aggregates all the CSS provided by your theme & plugins, so if you (really) want to tackle “remove unused CSS” then you should look into your theme & plugins (you might be able to get some improvement using e.g. “plugin organizer” to only allow plugins to work on specific pages). Moreover the unused CSS will likely be different for different pages (or parts of your site), so that would lead to different autoptimized CSS-files being loaded on different pages.

    My suggestions; don’t obsess over GPSI “opportunities” but focus on real spead (time to first byte, time to start render/ significant paint, onLoad time, …) instead 🙂

    hope this clarifies,
    frank

    mistake :))

    • This reply was modified 10 months, 4 weeks ago by mybunnyb.
    Plugin Author Optimizing Matters

    (@optimizingmatters)

    well, it boils down to the fact that the CSS added by your theme & plugins dictate how much CSS is on your site. Autoptimize cannot decide what is used or not used and hence cannot remove unused CSS, so if you want to cut down on CSS used you’ll have to review theme & plugins, removing un-important ones (assuming they indeed add CSS) and/ or replacing them with less “heavy” ones?

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Remove unused css suggested by google pages speed’ is closed to new replies.