Remove renderblocking javascript and css content

[inkredible]

Hello,

I noticed that IPS is eager to code according to best practices for web development. When checking any IP board forum you will notice one performance problem on all boards - renderblocking javascript and css code. If IPS can fix it it will significantly improve the pagespeed and hereby it will also positively affect the user experience and SEO results (as this is a SEO factor).

You can get more information or check your own forum using pagespeed insights: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Finvisionpower.com%2Fforums&tab=desktop

[Ryan Ashbrook]

There is a theme setting for this.

[inkredible]

4 minutes ago, Ryan Ashbrook said:

There is a theme setting for this.

Thanks I found it, even though it doesn't fix the CSS problem and possible HTML minifying. If one wants to optimize it to the top an auto compression for uploaded images (for profile pictures at least) might be an idea.

[rgf100]

There is a setting - overview - files - image settings - for the quality of images created by the site, but not the uploaded originals. 

Has anyone noticed any negative impacts of putting javascript in the footer? I'm seeing a less attractive but still functional editor toolbar, anything else?

What I'm doing is creating a child theme of the default, with only that setting changed. That'll let users opt for it if they prefer.

[Day_]

I have JavaScript in the footer but hasn't changed the editor, check your theme settings that it's set to default and not Moono

[rgf100]

Ha, thanks! I didn't even know that was an option. Not sure why it set the child theme to Moono but I've set it back now and the editor looks like it should.

[Day_]

When I run an update I create a new theme, easier that way than messing around with the templates, Moono is always set as the editor skin, no idea why. 

[Linguica]

Moving the CSS / JS hrefs to the bottom might make the page seem to load faster but it also introduces the FOUC problem. For instance on my forum's main index page I have recent status updates on the sidebar and having the CSS/JS load at the bottom results in a split-second flash of all the status updates being rendered in full before the javascript kicks in and truncates them down to a couple of lines.

It would be nice if IPS could recognize which CSS/JS are necessary for "above the fold" content and keep those above the page body while putting the rest at the bottom, but that's probably a pipe dream.

[The Old Man]

I have a content slider in a jQuery Pages block on one of my communities home pages and I find it stops working when I enable JS in the footer. Is there a way to fix that?

I know you can add aync to the import JavaScript line to make them load asynchronously so they don't hold up the page from loading, but on some scripts it seems to stop them from working.

[AL B]

Where are the settings for this?

[inkredible]

10 hours ago, AL B said:

Where are the settings for this?

In your theme settings :).