OpenCart PageSpeed - Eliminate render-blocking JavaScript and CSS in above-the-fold content

Question

I've improved many issues that Google pagespeed tool reported and now the main issue is the following: Eliminate render-blocking JavaScript and CSS in above-the-fold content opencart

I am using OpenCart and didn't understand exactly how to fix the problem, and how exactly prevent from things to cause problems/dissappear/etc, after making this change..

Do you have a suggestion of how you deal with it? A specific JS that solved it? A tutorial that will clear things up for me?

I've tried a few on Youtube and Google but didn't understand exactly how to approach it.

Currently this is the site's status and last report from Google:

https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fswing-and-play.com%2F&tab=desktop

What exactly are you asking: what does that warning mean? or how to fix it in your site? — Tomer
– Tomer, Commented May 4, 2014 at 9:21
Please check this answer: stackoverflow.com/questions/18013648/… — prajosh
– prajosh, Commented Sep 11, 2014 at 11:20
Please check this post: stackoverflow.com/questions/18013648/… — prajosh
– prajosh, Commented Sep 11, 2014 at 11:22

Tomer · Accepted Answer · 2014-05-04 09:25:30Z

4

I'm not familiar with OpenCart, but basically what this warning means is that you have many js/css files loaded when the page loads.

this is blocking page rendering until all js/css files are loaded. In order to deal with it you need to do several things:

Concat js/css files into 1-2 files and minify them - that way you reduce the number of http requests and loading time of the page.
if possible, move js files to the bottom, right before the closing body tag.

answered May 4, 2014 at 9:25

Tomer

17.9k16 gold badges82 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

pixeline · Accepted Answer · 2014-05-04 09:25:54Z

1

well, you should first put all javascript at the end of the html file, just before the closing BODY tag. Failing to do so means that the browser will wait for the files to be downloaded before proceeding with rendering the screen, thus provoking a longer waiting time for the user. Then, you should combine them all to have just one file, thus only one http request. Then, you could minify them to save extra kilobytes.

answered May 4, 2014 at 9:25

pixeline

18.1k12 gold badges87 silver badges110 bronze badges

Collectives™ on Stack Overflow

OpenCart PageSpeed - Eliminate render-blocking JavaScript and CSS in above-the-fold content

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related