Error Prioritize visible content

  • Resolved RebellionNT1

    (@rebellionnt1)


    8 years ago

    Hi,

    I have a problem with google page speed, after installing Autoptimize this is the error displayed by my site:

    “Prioritize visible content
    Your page requires additional complete network directions to process featured content at the top of the page. For optimal performance, it reduces the amount of HTML needed to process that content.
    It took 134.4 KB of HTML response to process the content of the top half of the page. This involves 4 round trips in the network. Prioritize the content of the top half of the page so that it can be processed with only the HTML required for the first 2 round trips.
    We were unable to process any final content from the top half of the page with the supplied HTML in 2 round-trip cycles”

    I do not know how I can fix it, what I do is that if I look at the source code of my site at the top there is a lot of code.

    My site is: luengos.es

    Best Regards,

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

    (@futtta)

    that’s google telling you that you have too much CSS to inline all of it. to fix, you should look into the (more complex) “inline & defer”-option, about which there’s more info in the FAQ @rebellionnt1.

    frank

    Thread Starter RebellionNT1

    (@rebellionnt1)

    Hi Frank,

    And is it possible to fix the error? Is it very complex to do?

    I have read the FAQ but I do not know how to fix it.

    Best Regards

    Plugin Author Frank Goossens

    (@futtta)

    it is possible, but it can get rather complex. the main thing is finding out what the “critical css” is, something AO can’t do for you. from the FAQ;

    What is the use of “inline and defer CSS”?
    CSS in general should go in the head of the document. Recently a.o. Google started promoting deferring non-essential CSS, while inlining those styles needed to build the page above the fold. This is especially important to render pages as quickly as possible on mobile devices. As from Autoptimize 1.9.0 this is easy; select “inline and defer CSS”, paste the block of “above the fold CSS” in the input field (text area) and you’re good to go!
    –
    But how can one find out what the “above the fold CSS” is?
    There’s no easy solution for that as “above the fold” depends on where the fold is, which in turn depends on screensize. There are some tools available however, which try to identify just what is “above the fold”. This list of tools is a great starting point. https://jonassebastianohlsson.com/criticalpathcssgenerator/ is a nice basic solution and https://criticalcss.com/ is a premium solution by the same developer. Alternatively this bookmarklet (Chrome-only) can be helpful as well.

    ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Error Prioritize visible content’ is closed to new replies.