slow loading

Not entirely sure what is wrong I’m afraid, never seen an impact that big. Could you start by just doing one optimization at a time (HTML, JS or CSS) each one after the other, to see which one is (are) slowing things down?

I do see that the homepage is … huge, with 6000+ lines of HTML, so that might slow things down tremendously, given the fact that the entire HTML is parsed in the output buffer. Not sure this is the problem though, just a thought for now.

Thanks for the fast response!

Unfortunately I did try optimizing one at a time, but to no avail.

I just wanted to see if anyone else had experienced anything like this before previously.

I’m also wondering if it is something with my host, wpengine.

I’m working on a few tweaks as seen here – https://www.markdescande.com/speed-up-wp-engine/

Guess we’ll see what happens.

well, the good news; if my hunch about the huge homepage is correct, other pages should be faster?

I also suspect that page caching is disabled on wpengine’s staging instances. As soon as caching kicks in, there should be no slowness any more, as the cached page would refer to known, pre-existing autoptimized css/js (ideally static .css/.js instead of .php as you configured it apperantly?).

Try not inlining all that CSS and not converting all image references to inline binary code.

The home page took about 32 seconds from start to finish for me.

It’s not a huge home page as rendered, but yeah, you have a friggin massive stylesheet with lots of stuff in there by prettyPhoto, which I think it like lightbox. If you don’t use prettyPhoto on all pages, see if you can not include that on every page, esp. the home page.

Many purchased themes, I’ve found, use a shotgun approach with their “features” – meaning they blast out every style and script for those features, whether you use them or not. Case in point: I’m using Alyeska on one site. Awesome theme with many different slideshow options for the home page. As it turns out, they load ALL the styles and ALL the scripts for ALL the slideshow types on every damn page. A little logic and commenting out e.g. nivo slider scripts and styles saved BIG TIME on all my site requests.

Also, are you using any caching plugin? WP Super Cache works great with Autoptimize.

Hi James, thanks for the advice.

I ended up using a plugin called Cleanerpress which enabled me to choose which links my other plugins should be active on. So no more wasted styles and scripts on pages that aren’t using them.

The Autoptimize plugin also is working amazingly! I think the issue was in fact the staging vs. production environments. Once I moved my site back to Prod, plus a few other tweaks, I’ve been able to reduce the requests to 24 with a load time of 493 ms.

Awesome plugin and thank you again for the quick response to my question.

cleanerpress, that one sounds particularly interesting! glad it works nycwolverine!

@nycwolverine

Have installed the cleanerpress plugin, but not so sure how to configure it smartly.

I would greatly appreciate any insights you would be willing to share.

Sounds like Plugin Organizer. Although I also found Plugin Organizer to be kind of unintuitive as far as filtering plugins based on the page or section of the site. I’ll have to check out cleanerpress.

@queertownabbey

There are two options.

First, you can select CleanerPress in main nav menu on the left. You would select the option to use the plugin on specific pages and then copy the url’s you want in the provided box.

The second option is to do it page by page. When you open a page, at the bottom of the page you will see a box for Cleanerpress where you can enable/disable plugins for the page.

Hope this helps.

@futtta

Not sure where to suggest a feature so I figured here might be ok since we have a dialogue going anyway.

Would it be possible to include a configuration whereby we could load the autoptimize created css and js files asynchronously?

I’ve gotten a few errors on a few speed tools (PageSpeed Insights, GTMetrix) and that was one of the recommendations.

My theme requires the css and js files to load above-the-fold or it breaks so putting the files into the footer won’t work.

Anyway, just thought I’d ask as maybe others have the same issue?

Either way thanks again for an awesome plugin.

I’m afraid loading above-the-fold and asynchronously are mutually exclusive nycwolverine.

Regarding CSS specifically; there are solutions to defer part of the CSS as described in this blogpost, but it’s not something easy to do. Inlining all CSS might be a better solution (but that depends on your context).