Autoptimize 2.0 changes to JS order

The changes to position of non-aggregated scripts were too touchy in the new version (esp. as by default inline JS is not aggregated), so I disabled that for now. I might re-enable that in the next minor release, but only when inline JS is aggregated.

frank

Okay, maybe you could give an option to leave certain js scripts in the header? But my guess is the ignore scripts line already does that

ignore scripts indeed is used by is_moveable() to exclude scripts from being moved around, which works fine.

but given that (for new installations) the defaults are:
* not to aggregate inline JS and CSS (to avoid problems with cache size due to page-specific inline JS and to avoid problems with inline CSS loosing priority)
* to force JS in head (to avoid non-aggregated inline JS failing due to missing code in late-loaded optimized JS)

the risk was that non-aggregated (mostly inline) code got moved around and messed up the loading order.

but it’s good to challenge me on this ??

frank

Ah I see, alright thanks for the info Frank ??

You’re doing great work on this plugin – it is the one plugin that has single handedly improved pagespeed scores by a significant amount.

The latest version moving some of the .js files back into the header did mess with the scores a bit, but no biggie!

The latest version moving some of the .js files back into the header did mess with the scores a bit

well, assuming you are aggregating inline JS, you could try this small change; open up wp-content/plugins/autoptimize/classes/autoptimizeScripts.php and on line 348 change

private function ismovable($tag) {
	return false;

into

private function ismovable($tag) {
	if ($this->include_inline !== true) {
		return false;
	}

this re-enables moving JS to the footer. if this works, it will probably end up in AO 2.0.1 ??

frank

Wow that works! I’d suggest that you make an option to turn this modification on or off though, in 2.0.1, just in case that it breaks scripts for some people.

View post on imgur.com

nah, it’s pretty safe as it only allows code to be moved when inline JS is aggregated, which actually is the way AO 1.9.4 (and before) worked. so no option needed (there’s too many options already, really).

just committed on GitHub, thanks for challenging me! ??

frank

Alright that’s great then!

Btw, I am having trouble using Autoptimize to inline “Above the Fold” CSS – I tried using https://jonassebastianohlsson.com/criticalpathcssgenerator/ to get the Critical Path CSS using this option simply breaks my site, multiple scripts don’t work properly.

Any ideas on how to fix this? There may be a better way for me to obtain the FULL CSS code for my site, just not sure how to do it.

errr … if you inline above the fold CSS your JS breaks? or do you mean the generated criticalpath-css messes up the layout of your page?

I think the whole layout breaks, I don’t believe using Critical Path CSS can break js? But it did appear that everything wasn’t working right.

I don’t believe using Critical Path CSS can break js?

well, it shouldn’t (although the deferred CSS is loaded using JS and an error in that could theoretically break other stuff) ??

But it did appear that everything wasn’t working right.

well, getting the right “critical CSS” can be … difficult. be sure to copy/paste the entire autoptimized CSS into the tool and see if that yields better results. alternatively you could also try this bookmarklet (chrome only) to try to extract above-the-fold CSS.

frank

Yea that’s exactly what I did, I completely copied all the autoptimized CSS and pasted it into the tool. It broke the entire layout with the elements displayed all over the place.

I couldn’t find a way to get the bookmarklet to work.

use the generated criticalCSS, but add this to it:
#tab_slide_content{display:none;}

the result will be … better ??

frank

Hmm that fixes it partly, but it removes the tab slide entirely.

Also even with that fix the image sizes on the front page are all out of whack ??

I guess I’ll have to give up on this aspect of the optimization… 99%/92% on GTmetrix is good enough for me ?? Thanks for your help Frank!