seo Question posted in
Some basic information to get you started with this can be found here.

How to eliminate 'Render-blocking JavaScript' error for mobile – SEO

Recently I tested my site for mobile friendliness, mobile speed, and desktop speed.I got shocked with the results of my desktop and mobile speed which are too poor like 48/100 and 40/100 respectively, with the error,

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

and then i removed the unwanted content getting loaded in my page and also added a defer at the end of my tag,then with this changes the error got suppressed for Desktop and my score increased to 82/100 for desktop and 68/100 for mobile.
That’s fine up to now but the problem is the same error still remains with my mobile speed,

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

I dont know why error still remains with mobile speed when it was fixed with desktop.Can any one please help me with a suggestion.Thanks in advance.

Tags:

2

Answers


  1. 0

    don’t include you js file in between <head> tag instead include them at end of body tag

    I recommend you to compress and minified all you js in one file and css in one file to reduced http request and add expiry header using .htaccess

    and this might help you https://varvy.com/pagespeed/render-blocking-css.html

    additionally I suggest you to refer this link https://developer.yahoo.com/performance/rules.html

    1. Make Fewer HTTP Requests
    2. Use a Content Delivery Network (CDN)
    3. Add Expires or Cache-Control Header
    4. Gzip Components
    5. Put Stylesheets at Top
    6. Put Scripts at Bottom
    7. Avoid CSS Expressions
    8. Make JavaScript and CSS External
    9. Reduce DNS Lookups
    10. Minify JavaScript and CSS
    11. Avoid Redirects
    12. Remove Duplicate Scripts
    13. Configure ETags
    14. Make Ajax Cacheable
    15. Flush Buffer Early
    16. Use GET for Ajax Requests
    17. Postload Components
    18. Preload Components
    19. Reduce the Number of DOM Elements
    20. Split Components Across Domains
    21. Minimize Number of iframes
    22. Avoid 404s
    23. Reduce Cookie Size
    24. Use Cookie-Free Domains for Components

    etc

    Login or Signup to reply.
  2. 0

    When you put the CSS files in your heading <head> section, then browser can’t load other resources until they did not get (render) css files from your server.

    Google already said on their article, if you have small css files then put it internally into head section, so browser don’t need to request another HTTP GET request to your server and it will use CSS directly from your <style>.yourcsscode{}</style> tag.. And if your css file is big then use javascript to render it asynchronously (Example already included in above link).

    For javascript use asyn tag like this <script async src="my.js"> and if your javascript is small then use it internally so you can save another HTTP GET request.

    The whole thing here is, your browser need to wait to load other resources untill they did not get css and javascript files from server. Rahul provided too many points which does not solve this problem but it is useful if you consider to optimize your pagespeed.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search