Jetpack Boost: Failure to generate Critical CSS

  • Resolved chasclifton

    (@chasclifton)


    4 years, 9 months ago

    I was trying out Jetpack Boost for my blog. It failed to generate Critical CSS abd produced this error message.

    Failed to generate Critical CSS

Hmm, looks like something went wrong. We're still seeing an unexpected error. Please reach out to our support to get help.

This URL is redirecting to a different page:

    http://blog.chasclifton.com/

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Contributor Mark (a11n)

    (@thingalon)

    4 years, 9 months ago

    Hi there,

    Thanks for writing in. That error message means that WordPress thinks your site lives at “http://blog.chasclifton.com/ “, but that URL redirects to “https://blog.chasclifton.com/ “. (Note the difference between http and https).

    It should be pretty easy to fix.

    Can you please check your “Site Address (URL)” setting under “Settings > General” in your WordPress admin screen. Please make sure that the URL there matches your site’s real address (complete with “https:// ” at the start).

    Let me know if you still run into trouble with that fix.

    Cheers
    — Mark George
    Jetpack Boost Developer

    • This reply was modified 4 years, 9 months ago by Mark (a11n).
    Thread Starter chasclifton

    (@chasclifton)

    4 years, 9 months ago

    I am aware of the difference between http and https, but I was not up to speed on the Settings > General stuff, so thakns for that.

    I will give Boost a try again.

    Thread Starter chasclifton

    (@chasclifton)

    4 years, 9 months ago

    Right now, with only “Lazy image loading” activated, my desktop score is 99 but my mobile score is 66 — where it was before I installed Boost, within a point or two.

    Thread Starter chasclifton

    (@chasclifton)

    4 years, 9 months ago

    Updating those URLs caused the “Optimize CSS loading” to work; however, my Mobile score fell from 66 to 60 afterwards, so maybe it is not such a good idea?

    deathlynotes

    (@deathlynotes)

    4 years, 9 months ago

    Hello @chasclifton

    Could you retry de-activating and re-activating the Jetpack Boost settings (Optimize CSS loading, Defer non-essential JS, and Lazy load images) and then refresh the Overall score, please?

    Let me know if you have any questions.

    My best regards,

    Michelle C.

    Thread Starter chasclifton

    (@chasclifton)

    4 years, 9 months ago

    Michelle C —

    Since I had the WP Touch plugin for mobile useres activated, I tried with it and without it.

    1.WP Touch on/Boost off 66 mobile, 85 desktop

    2. All 3 parts of Boost activated, WP Touch activated: 54 mobile, 99 desktop

    3. All 3 parts of Boost actviated, WP Touch de-activated: 63 mobile, 97 desktop

    3. Boost de-activated and WP Touch de-activated: 75 mobile, 91 desktop.

    What do you make of that?

    Thanks for your help,

    Chas

    Plugin Contributor Mark (a11n)

    (@thingalon)

    4 years, 8 months ago

    Hi again Chas,

    Thanks for writing in with your experiment results.

    I’ve done some research, and I think I may be onto the problem. I think that our “Optimize CSS Loading” feature is not compatible with WPtouch.

    Most sites adapt to mobile devices without altering the main page content – by using “responsive” style rules. However, it looks like WPtouch serves up different HTML page content for mobile vs. desktop browsers (most likely based on the user-agent header).

    The WPtouch documentation includes a page on how to configure various caching plugins to work around their approach. Unfortunately, at this stage there is no way to configure Jetpack Boost to make the same accommodation when generating Critical CSS (for the “Optimize CSS Loading” feature).

    When generating Critical CSS for your site, Jetpack Boost does not alter your browser’s user-agent headers – and so it will not trigger WPtouch’s alternate HTML view for mobile devices. As a result, your Critical CSS will only take the “desktop” version of your site into account.

    We will investigate ways we can work around this kind of issue in future versions of Jetpack Boost.

    In the meantime, it seems that our “Optimize CSS Loading” feature may not be compatible with WPtouch.

    It may be possible to work around the issue by generating your Critical CSS from a mobile device (i.e.: visiting wp-admin on your phone and following the usual procedure to generate Critical CSS). However, as that will only consider the “mobile” version of your page, it may similarly impact the performance of your site on desktops.

    Otherwise, I recommend leaving the “Optimize CSS Loading” feature off for now – and keeping an eye on future Jetpack Boost releases which may offer solutions to this problem.

    Cheers
    — Mark

    • This reply was modified 4 years, 8 months ago by Mark (a11n).
    Kevin

    (@kevinsandlingmailcom)

    4 years, 5 months ago

    My Optimize CSS Loading also fails, with the following message and error:

    Failed to generate Critical CSS
    An unexpected error has occurred. As this error may be temporary, please try and refresh the Critical CSS.
    Error: Failed to construct ‘URL’: Invalid URL

    I’ve refreshed several times, but no joy. I’ve checked the settings you mentioned for the originator of this post, and all are correct.

    Suggestions?

    Thank you!
    Kevin

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

The topic ‘Jetpack Boost: Failure to generate Critical CSS’ is closed to new replies.

Tags