Render-blocking JavaScript and CSS in above-the-fold content

  • Resolved Darkozza

    (@darkozza)


    11 years, 7 months ago

    Hello,

    I guess you’ve seen that topic title already 🙂

    Actually I ticked just the option “Optimize JavaScript Code”, because with CSS and HTML optimization options the things are are getting a bit worse as I see.

    The problem is that the site speed performance is not getting any better – http://online-id.net

    and in Google PageSpeed Insights the first thing to consider is: Eliminate render-blocking JavaScript and CSS in above-the-fold content

    and in GTmetrix the most important issue is: Defer parsing of JavaScript.

    I’m using Autoptimize with Quick Cache plugin and on other sites they give some really good results, although “Eliminate render-blocking JavaScript and CSS in above-the-fold content” and “Defer parsing of JavaScript”

    I’ll be thankful to any suggestions how to solve that JavaScript speed performance problems.

    Thank you in advance!

    All the best!
    D.

    https://ww.wp.xz.cn/plugins/autoptimize/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Frank Goossens

    (@futtta)

    11 years, 7 months ago

    Well, had a quick look and Autoptimize is not active at all, so can’t really suggest anything but activate it, can I? 😉

    But let me give some quick general pointers;

    • take into account only aggregates local JS/CSS, so render-blocking external JS/CSS will remain render blocking (e.g. google fonts)
    • If you enable “force JS in head” (as an easy fix for JS errors), you effectively are making the aggregated JS blocking. Your site will be quicker (as all JS is aggregated & minified), but Pagespeed Insights will still complain.
    • If you exclude some JS from being aggregated or if you use “look only in head”, the JS excluded will remain render blocking

    hope this clarifies things a bit,
    frank

    Thread Starter Darkozza

    (@darkozza)

    11 years, 7 months ago

    Thank you for the answer and for the general pointers!

    I did untick the Optimize JavaScript Code option, because the site is live and the portfolio items were missing 🙂

    Now I ticked it back together with both advanced settings options Force JavaScript in <head> and Look for scripts only in <head>, couse that the only way for the portfolio to work. And with both JS advanced options activated GTmetrix shows even slower loading time and Google PageSpeed Insights shows worse results.

    I’m a bit confused, but like you say it might be just site speed checking tools groundless complains 🙂

    Thank you!

    Plugin Author Frank Goossens

    (@futtta)

    11 years, 7 months ago

    The best way to check impact is to do comparative tests on http://www.webpagetest.org/, doing 5 testruns there and comparing the median results between your site with and without AO active. Webpagetest measures real, objective speed, whereas PageSpeed Insights merely tries to score the use of best practices.

    frank

    Thread Starter Darkozza

    (@darkozza)

    11 years, 7 months ago

    Thanks again!

    As I see I should consider optimizing images.

    All the best,
    Darko

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Render-blocking JavaScript and CSS in above-the-fold content’ is closed to new replies.