I’ve just run a google page speed test on a site I built with blocks and I’m getting a poor score of 53/100 fr page speed load on both the mobile and desktop versions of the site.
I’m getting the following messages:
This page is not optimized and is likely to deliver a slow user experience.
Please prioritize and apply the recommendations below: Is there a way to fix these things within blocs as the app writes the code for you?
Possible Optimizations
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Prioritize visible content
Leverage browser caching
Minify JavaScript [for this I have enabled the minify the javascript checkbox in the project settings]
One relatively simple step you can take would be to sign up for CloudFlare, which has built in options for much of this that can all be handled via an online user interface with a free option.
On a different note I wouldn’t be too obsessed by PageSpeed Insights, because it does have some limitations. As an example, it might hammer your score because half a dozen images could apparently be a fraction smaller, but it practically ignores the speed of your server. Google often makes a lot of contradictory demands as well.
CloudFlare will allow you to leverage the browser cache or failing that it can be done via .htaccess. It can also minify code and a lot more, but I’d be interested to know if there is any way to eliminate render blocking content above the fold and prioritise visible content.
In some cases it should be pointed out that these blocks combine to take just a fraction of a second, so it’s important to keep a sense of perspective.
This is tricky because the animation triggers in Blocs are handled by JS so if you move these after the HTML rendering, animations don’t work correctly when you first visit the site.
Just for the fun of it, I just tested the page I am currently working on.
Using the German language version of the Google page speed test, my site got 86/100 for desktop and 72/100 for mobile
Using the Englisch version, my site only got 79/100 for desktop and 71/100 for mobile
Weird, isn’t it? This can mean a couple of things.
a. Germans are faster (OK, there is the Autobahn (no speed limit!!!) but I didn’t know the internet is taking it )
b. The test of the English version of the test is run from a different server, goes through more hops to reach the site hosted in Germany and therefore the results are poorer (just a wild guess but seems a likely explanation)
May be the test is just going through a series of hops to reach your site as well?
For your comparison, here are the Possible Optimizations results I got:
Optimize images I already optimized the pictures. Further compression will result in image editing artifacts
Thanks for bringing this to our attention. This is a very important subject for all web designers/developers and people concerned with SEO.
I ran several test on my optimized website built in Blocs 3 and became concerned as well. I tried several sites that offer free checking in the results were pretty consistent low scores in many areas and what they consider errors.
I plan on going forward with the knowledge that you have and will try to enhance my Blocs built websites even more. I’m still in learning mode so vividly want to share information that will help us all we be grateful.
@wolfganghofer I have tested your site speed. Your site speed is really fast. Can you share what your have done to make the site load so fast in an above 1M page size?
I did nothing special. Just used blocs and compressed the images as usual. In the htaccess I switched on browsercache. And the provider has ssd-raids. I think that´s all.
Thank you. Your site is the first website I saw the test speed is 0.8s with a page size above 1M. Usually it will be 3-4s even 6s in a WP site. Amazing.
Oh no.
I was fairly happy until I ran a speed test.
I have an image heavy site at 7.5mb and got a desktop load speed of 3.1 seconds. Now I’m concerned it’s not fast enough.
If someone can see how fast it loads I’d be grateful.
I’ve run the images thru jpeg mini, but my work relies on a lot of images. That’s why I have so many galleries; both hosted and via an Instagram plugin (Elfsight).
Any advice for a novice would be appreciated.
Thanks Blocs fans.
If you really start drilling down into speed you can end up with a list a mile long. This is your business so you may well want to upgrade your web hosting, then make sure you are using the latest PHP version and enable Brotli with server compression for html and CSS etc. I use LiteSpeed servers with QUIC that are typically fast. Set up browser cache leverage if not done so already and consider enabling HSTS.
Also try to cut down on call outs to external sources like Google fonts, Vimeo and others. I notice that you have 11 content security policy errors listed on the home page that probably isn’t helping you. You could really give the whole site a bit of an audit to see what parts could be simplified and optimised.
Got it.
I’ve read some information about adding lines to an htaccess file.
Does this need to be done post export in an editor or can I do it within Blocs?
Also how do I implement gzip (or similar) as it seems most mentioned?
I’m finding it a bit above my paygrade🧐
Latest php now implemented
TSO Hastings seem to have a low latency time. It seems more to do with images. I’ll maybe try jpeg2000 , compress more, use fewer g fonts and minify everything.
)
