Mark (a11n)
Forum Replies Created
-
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, 10 months ago by Mark (a11n).
Hey @thomasjarvisdesign,
Apologies for my slow reply, and thank you so much for being willing to share information about your site!
I’ve taken a look, and I think I know why Critical CSS wasn’t helpful to your site.
Your LCP seems to occur after your logo image (https://www.ashbybasketball.co.uk/wp-content/uploads/2017/08/Ashby-Aztecs-basketball-logo-156×156.png) loads. According to a Lighthouse report, your logo image doesn’t have an explicit width or height set (in your HTML or CSS), so it can’t figure out the overall layout of your front page until it loads the image.
It’s a shame browsers aren’t smart enough to infer the size of the image from its filename. 😉
If you are familiar with CSS, it may be worth adding some custom CSS to your site (via Appearance > Custom CSS) which specifies the width and height of your logo image, allowing browsers to finalize the page layout before the logo image finishes loading.
I’m always on the lookout for new ways that Jetpack Boost can help users out, so thank you for letting me look at your site as a case study. I hope my tip helps you get that little bit of extra performance out of your site. 🙂
- This reply was modified 4 years, 12 months ago by Mark (a11n).
Hi there,
Thanks for your in-depth review of your experience with Jetpack Boost.
Website optimization is complicated, and not all solutions are right for all sites, but information like this will help us improve Jetpack Boost over time.
I would be interested to learn more about which element(s) were most important to your LCP score, and how Critical CSS affected it. Would you be willing to share the URL of the site you had negative results with?
If you are uncomfortable sharing that information in a public forum, please drop me an email at JetpackBoost@Automattic.com, and I’ll take a look.
Hi again @maria-grace,
Thanks for sticking with us while we investigated. After diving through the plugin source code for WP Fastest Cache, I think I’ve figured out the problem you’re running into.
It looks like WP Fastest Cache’s “Combine CSS” option is not compatible with Jetpack Boost’s “Optimize CSS” option.
When using optimized CSS, Jetpack Boost figures out the most important CSS to render your page as quickly as possible and embeds it directly in your page. Then, it uses a trick involving a small bit of JavaScript to tell your browser not to hold up rendering your page while the rest of your CSS files load. This is called “deferred loading” – and helps ensure your page displays as quickly as possible.
However, WP Fastest Cache’s “Combine CSS” feature filters your page’s HTML source – and replaces all links to CSS files with one link to its combined CSS file. The trouble is that WP Fastest Cache doesn’t recognize Boost’s little “deferred JS” trick, and ends up generating a CSS link which is never used (its media type is set to “print”).
As a result, only Jetpack Boost’s optimized CSS loads at all – which only includes the stuff that appears on your page when it is first displayed on your screen. i.e.: that won’t include elements that appear later, like dropdown menus.
We will investigate a proper fix for this issue in future versions of Jetpack Boost – but in the mean time, these two options can’t be used together.
Please either leave the “Optimize CSS” option in Jetpack Boost off, or alternately turn off the “Combine CSS” option in WP Fastest Cache.
Hi @christinajonson,
I’m sorry to hear you’ve run into trouble with Boost.
May I ask where you ran into this issue – was it when you clicked the “Get Started” button while setting up Jetpack Boost?
A “500” error usually indicates that something has crashed on your server. Unfortunately, the only place to get more information about that will be in your server logs.
Most hosting providers give users access to their server logs either through a cPanel interface, or as a file in your FTP or SSH access. Can you please refer to your hosting provider’s documentation for where to find your server logs, and check for an error message?
It may be worth re-attempting the action that failed just before checking your logs, so that you have a fresh error message to look for in there.
If you can’t find your server logs, you may need to contact your hosting provider’s support team for help finding the error.
Hi @thiayo
Fantastic; that indicates that your site now has Critical CSS successfully generated. I can confirm that I now see it loading on your site (as listed in the original post).
If you would like to confirm, look for the following in your page source:
style id="jetpack-boost-critical-css"Forum: Plugins
In reply to: [Jetpack Boost - Website Speed, Performance and Critical CSS] css errorI’m sorry to hear that you’re still having trouble. An “HTTP 409” error is uncommon – especially when loading a page via HTTP GET.
It usually means the server (i.e.: your WordPress site) is reporting some kind of conflict while trying to load the specified URL.
Would you mind letting me know what WordPress plugin you are using your for contact form? That way I can investigate for potential compatibility issues with Jetpack Boost. Based on the HTML attributes on your contact form, it looks like you may be using Grunion Contact Form, which has not been tested on WordPress > 3.3.2. Is that correct?
If you try to generate Critical CSS for your site, then visit the URL which failed (including the “?jb-critical-css-gen=…” GET parameter), does your browser receive a 409 error? The information on that error page may contain clues as to what has gone wrong.
Finally, it may also be worth checking your server logs to see if there is any further information about that 409 error and what may be behind it. Depending on your hosting provider, there may be a logs section in a cPanel interface, or you may have SSH or FTP access to view log files directly. Please refer to your hosting provider’s documentation for how to find and view your server logs.
Hi @wppit,
Would you mind opening a new thread for this issue? I’ve taken a quick look, and can’t see anything broken with W3 Total Cache + Jetpack Boost.
Would you mind including your site URL so that we can check it out in detail? If you’re not comfortable sharing your site URL, please email us at JetpackBoost@Automattic.com so that we can take a look.
Hi @reececvo,
Thanks for trying Jetpack Boost! 🙂
This error message usually occurs when our metrics servers aren’t able to communicate with your site to send a speed score to you.
If you use a Web Application Firewall service such as CloudFlare, or a WordPress plugin to restrict access to your site – can you please configure a rule to allow access to your site from 35.188.32.9? Our speed scores are always returned from that address.
If you are not using a service or plugin to protect your site from unwanted traffic, would you please ask your webhost to check if the traffic from 35.188.32.9 is being blocked?
Hi @irinashl,
That’s strange; Google PageSpeeds and Jetpack Boost should give similar scores for the same site.
Could you please let us know the URL of your website so that we can look into why the scores are so different?
If you would prefer not to share your site URL on a public forum, please send us an email at JetpackBoost@Automattic.com. Please include a link to this forum post for context.
Hi @thiayo,
Thanks for your response, and apologies for our delayed response.
In the above set of images and posts, there are three different error messages mentioned. Each have a different meaning:
Timeout while reading https://………….?jb-generate-critical-css=……..
This error indicates that Jetpack Boost was unable to load the given URL within 60 seconds, and so gave up waiting.
When you see this error, you can try to visit the specified URL to see if the page loads successfully, or if it takes a long time.
Failed to verify page at https://…………. ?jb-generate-critical-css=……..
This error indicates that Jetpack Boost either received a blank page, or the wrong page while trying to load the specified URL. That can happen if the URL timed out (as above), if there was an error while rendering the page, or if the URL redirects to a different place.
When you see this error, you can try to visit the specified URL to see if it redirects anywhere, or if any content loads successfully.
(from your screenshot):
HTTP 500 error received while communicating with the serverThis error indicates that your server hit an error while trying to load the specified URL. The error may be logged in your server’s logs – which your hosting provider may offer you through their web portal, cpanel, or SSH interfaces. If you are unsure where to look for your webserver logs, please contact your hosting provider for help getting information about a “500 error”.
In all three cases, Jetpack Boost is having trouble loading the specified URL in order to generate Critical CSS for them. The path you mentioned in your latest reply – “index.php/confinement-de-31-personnes-apres-la-decouverte-du-9eme-cas-de-covid-19-en-mauritanie/1770/?jb-generate-critical-css=065439c3c5” does not look like a path generated by a plugin, and it doesn’t look like it should redirect to another URL.
Can you visit that page on your site, and check how long it takes to load, and if any errors occur while trying to load it? Is there anything unusual about the page?
If you find the specified URL loads quickly and without issue, it is also worth trying it in “incognito” / “private browsing” mode to view the page as logged out users without the benefit of cached data see the page. You can find instructions for using incognito / private mode in most browsers here: https://www.howtogeek.com/269265/how-to-enable-private-browsing-on-any-web-browser/
Hi @maria-grace
Thank you for staying with us and working through these problems with us. I really appreciate your time and effort.
I’ve run some tests on my own test sites using the same combination of plugins and themes that you are using on your site. So far, I haven’t been able to reliably recreate the problem you have described – though I did briefly manage to get the menus to fail to load.
In order to recreate that problem, I:
- Ensured WP Fastest Cache was enabled, with “Minify HTML”, “Minify Css” and “Combine Css” all enabled
- Turned on Jetpack Boost’s “Optimize CSS Loading” feature
- Reloaded my test site.
However, the problem only occurred once. When I visted the WP Fastest Cache settings page, and told it to clear its cache, the problem cleared up and I was unable to recreate the situation.
Can I please ask you to try turning on “Optimize CSS Loading” one more time – but clear WP Fastest Cache’s cache immediately afterward? That may clear up the problem.
If not, would you mind letting me know which features you have enabled in WP Fastest Cache, to help me recreate the same problem?
Finally, I know this is an odd request – but you can please check if your menus show a small down arrow to the right of their labels when broken? If the small down arrow is visible, then I know we are debugging a JavaScript issue. If the small down arrow has been replaced by an empty square or other symbol, then I know we are looking at a CSS loading issue.
Thanks again for bearing with us, and I hope we can get to the bottom of this.
Forum: Plugins
In reply to: [Jetpack Boost - Website Speed, Performance and Critical CSS] Optimizing CSSHi @paontheweb. Thanks for taking Jetpack Boost for a spin!
Based on the error message you have received, it looks like Boost is getting confused by the URL https://www.wewhoserved.com/user-list-item redirecting to your homepage. That page was added to your site by the plugin “UsersWP”.
We will aim to include a fix for this issue in a future release of Jetpack Boost; we would like to ensure that Boost works alongside other plugins without issue.
- This reply was modified 5 years, 2 months ago by Mark (a11n).
- This reply was modified 5 years, 2 months ago by Mark (a11n).
- This reply was modified 5 years, 2 months ago by Steven Stern (sterndata).
Hi @mikka23. Thanks for your interest in Jetpack Boost!
1. Under the hood what is being used to generate the critical CSS? I’ve tested a few different packages and I would be interested to know how that is currently working.
Jetpack Boost uses its own custom-built Critical CSS generator. We considered pre-existing libraries for the task, but couldn’t find any that supported all the features we needed.
It will also help me understand how changing the viewport + user agent of the request might be done.
Jetpack Boost generates Critical CSS using three pre-defined viewport sizes; the most common mobile, tablet and desktop screen sizes. At the moment, there isn’t any official support for configuring it to use different screen sizes. However, if there is demand for it, we could add a filter to allow users to override its viewport sizes.
Our Critical CSS generator uses an invisible iframe in your wp-admin area to render your site at various viewport sizes. The user-agent string is supplied automatically by your browser, and I’m not aware of any reliable way to override that.
2. Related to the above, how is the CSS read/passed on while it is generating the critical CSS? During my tests it seems like sometimes the full CSS is not being read when generating the critical path, which results in the critical CSS being very small/unrepresentative and therefore results in large CLS. Especially true if the styles are being loaded in page rather than in a separate CSS file.
Our Critical CSS generator doesn’t include inline styles. Its goal is to find the most important CSS rules for rendering your “above-fold” content in external CSS files, and bring them inline – so that your browser can render your page as quickly as possible.
I would be happy to investigate any case where our Critical CSS generator fails to find important rules in external CSS files. If you do find such cases, please let me know the URL where the issue occurs so that I can check it out.
3. Are there any usage limits/rate limiting?
There are no usage limits on our Critical CSS generator. It runs wholly in your browser, so you can run it as frequently as you need to.
I am seeing what looks like some problems with icon CSS in critical. For example:
Would you mind sending me the URL where you have seen this issue, so that I can take a look?
Hi @alidarknaster. Thanks for trying Jetpack Boost! I’m sorry to hear that you have run into issues.
The error message tells me that your web server is unable to contact the WordPress.com API servers to setup a Jetpack connection. In order to use Jetpack Boost, your web server needs to be able to make requests to https://public-api.wordpress.com .
I’m afraid I don’t know which domains are blocked from Iran. If your site is hosted in Iran, then its access to other hosts will be subject to the laws of that country.
Your web hosting provider may be blocking outgoing HTTPS connections from your site. I recommend that you contact your hosting provider to ask them if outgoing HTTPS connections are blocked, and if your site should be able to access the WordPress.com API at https://public-api.wordpress.com
Your hosting provider should also be able to assist you with whether or not the local laws in the country your site is hosted may affect its access WordPress.com
