Website update & performance

We have a BSS website built in 2017-2018 and it is time to update it and improve performance. The old code is currently opening with BSS 6.1.3. When I run Pagespeed Insights for Mobile we get 57 Performance, 65 Accessibility, 92 Best practices, 85 SEO. The report shows opportunities:
Reduce unused JavaScript 5.26s
Reduce unused CSS 2.55s
Eliminate render-blocking resources 0.94s
Defer offscreen images 0.75s
Serve images in next-gen formats 0.60s
Efficiently encode images 0.15s

The website is mysticseacaptain.com .
Will updating this website using the most recent BSS improve these results? Are there some tools & techniques available to make performance improvements. I think there are new tools for image optimization and being able to import websites in total while making components might help with this.

Also what suggestions are there for improving both website speed and SEO?
PS: It appears that reducing unused js and css have the best gains. How hard is that to do?

Thanks.

When I ran Lighthouse mobile on Chrome in an incognito window, I get the following…

Realize Lighthouse’s speed score is not truly indicative of real-world performance. It’s an approximation. It will often change from test to test. A lot depends on your ISP, your device, your location, the network traffic at a given time, and so on. On my phone, your website came up instantly, and was immediately interactive, so the 3.1s Time to Interactive is simply not accurate (at least in my case.) A score of 2.1 on the Speed Index is a LOT better than most websites out there.

In typical Google fashion, the biggest slowdown on your website is GOOGLE ITSELF - Their reCAPTCHA script! Isn’t that a hoot! Google’s own product is what causes the delay. But there’s very little you can do about it (aside from creating a separate page with your contact form, so the reCAPTCHA doesn’t get loaded on the home page.)

The other things slowing down your website are fairly trivial. You could replace all your images with webp images, and even use srcset to load smaller images on mobile, but to be honest, on a 4G or 5G connection, you’re not going to notice any difference between a page that ranks 77 and one that ranks 100.

In terms of pagerank in the search, Google “claims” faster loading pages get preference in the SERP, but I don’t believe them. I’ve seen plenty of pages with scores in the 20-40 range occupy the #1 spot in the SERP because they have better SEO in other areas than their competitors.

The main benefit you can get from updating your website would be to get more secure versions of JQuery and Bootstrap. Because you’re using tabbed content instead of separate pages, you are transferring a lot of data on page load. You might consider making the website into a multi-page site, so your homepage has less content on it. But again, I think your site loads fine as it is. I would consider updating it to a newer version of Bootstrap, and the latest version of jQuery.

1 Like

All of this is very valuable advice. Thank you!! I think I realized when building the website, that tabbed content loads everything, but liked the format. Separate pages would be a better approach for speed and perhaps I will do that. I wonder if I could delay all but the primary tab somehow, but as you say, the performance is ok for 4G/5G. I will try to make that recaptcha improvement for sure, putting it on a separate page and update BSS. Thank you again!

Aside from the tab with the photo gallery, your other tabs do not have much content, and don’t think they’re contributing to much delay in loading the page.

Personally, I’d make this a multi-page website with a separate page for the gallery and contact info. This will allow you to have a smaller payload on your home page, and improve your speed. I’d also combine the Map and Inquire tabs into one page (Contact Us) and I’d embed an actual Google map (as opposed to an image,) so visitors can benefit from all the features that come with Google Maps (directions, real-time traffic, transit time, etc.)

Upgrading to the latest version of Bootstrap (5.2) and jQuery will make your site more secure, and Bootstrap has made many improvements since version 3.x which you’re using now. The Carousel, for example, has many more features including touch (swipe) for mobile. If you’ve only ever used Bootstrap 3.x, the transition will involve a bit of learning curve, as Bootstrap became a “mobile-first” design framework starting with 4.x. 5.x also got rid of jQuery, so you have to manually enable it if anything on your site that requires jQuery (this is an option in the website settings under Design > Bootstrap.)

1 Like

@printninja All good advice. We will be doing what you suggest. Thanks so much. Rick

I have a lifetime license and am looking for a good place to host two tothree websites. I was considering a getting a new web hosting, and I am considering alternatives.

i see that we can direct our custom registered domain name from the IDS registrar to a Bootstrap Studio hosted website. Do I understand correctly that we can use a Bootstrap Studio website for this purpose? The first website would be mysticseacaption which is a reasonably simple website, Are they reasonably fast servers?

The other alternative would be to export the website as HTML: and CMS, and use new hosting provider’s less expensive “shared hosting” which does not have or allow javascript or other languages. The more expensive VPS hosting would allow us to load javascript. I would prefer to not have to use the VPS hosting, but I expect that using a Shared hosting would require me to export the Bootstrap Studio to HTML and then it would become less useable and attractive.

I’d very much appreciate some advise about what approach would be best. Thanks very much.
Rick

What hosting company are you using where the shared hosting does not allow JavaScript? That doesn’t make any sense at all. JavaScript support is fundamental to the internet.

If you are currently using hosting company for your websites, you may find switching to Bootstrap Studio’s free hosting to be restrictive. There are a number of things you cannot do with it that I would consider “deal breakers.” For example, you cannot upload any file types that are not importable into BSS. So PDFs, videos, audio files, etc are off the table.

You can get very inexpensive hosting (less than $10 a month) these days that is quite robust and supports numerous technologies. I’ve been using HostGator for the last 15 years with very few complaints.

1 Like

Dear printninja, Based on your suggestions I did just recently decide on siteground after looking into Hostgator, Imotion, Veerotech and Bluehost, it took me 3 days of research and then about 2 to get email and websites migrated and running. The third day consumed a bunch of niggly details and getting organized. The websites are considerably faster, but I am still going to update them. This was the first step, because I did not have ftp access before! I really do like siteground. We got a shared hosting “GrowBig” which was a little more than the others after renewal, but it offers excellent 24/7 support and chat and some unique features, mainly a curated panel for ease of use and excellent tutorial and help along with a very fast in-house CDN that is world wide.
Best, Rick

See my earlier response to Calkin
https://forum.bootstrapstudio.io/t/re-website-update-performance/10442/2?u=rgleason

1 Like

Hey @rgleason, that link you sent is to a Direct Message so can’t be seen by others, but it is very much like what you’ve said here.

I’m glad you did your research and have found a solution that works for you. Certainly, it did prompt me to check out SiteGround again and I’m glad to see they have put effort into remaining competitive, last I saw they where still using the old web hosting model of packing as many clients on to one server and controlling everything with cPanel. Hopefully more of the web hosting industry is moving this way!

I do actually resell a lot of the same features big suppliers have like SiteGround, with a custom control panel, automated site transfers, and an in house CDN solution. Although, not being a big box web hosting supplier I understand when people choose a bigger company over myself, so it’s no hard feelings from me, in fact your feedback gives me ideas on how to improve my marketing, and I appreciate that you did check me out.

If you do ever have any other questions relating to hosting, you can always reach out to me and I’d be happy to help. I love helping people get online and get developing, we’re all a community and we all should share the knowledge and experience we have.

Glad I was able to help. Getting your own hosting package opens up a lot of possibilities. There’s a bit of a learning curve, but it’s well worth it.

1 Like

Catkin, My experience with siteground was very different than my earlier years of setting up and managing websites with opensource virtualmin and webmin. In those days there was always some unfound or unhandled parameter that had to be fixed. I liked virtualmin, but eventually it got to be too much to do and also focus on my business, so I handed it off to someone. The quality was excellent initially, but we gradually lost access, eventually loosing ftp access and our email was horrible (spam and very slow). So I had to do something. Initially I thought I would have a bit more hands on help with siteground, but actually you ask questions and they point you to the answers and tutorials. They never really touched anything during the setup. I found myself wondering how much my early experience helped in the process, and if someone with no knowledge about setting up websites would be able to do it. However I think they’ve managed to provide excellent support and I found their tools to be wonderful, and if your hosting is similar I am sure others will find the personal touch to their liking. I wish you great success.

Using your suggestions above, the next steps are.

  1. Update to the current Bootstrap Studio. to improve security (more secure versions of JQuery and Bootstrap)
  2. Replace all images with webp images, and even use srcset to load smaller images on mobile, (but to be honest, on a 4G or 5G connection, you’re not going to notice any difference between a page that ranks 77 and one that ranks 100.)
  3. Create a separate page with the contact form, so the reCAPTCHA doesn’t get loaded on the home page.
  4. Consider changing from tabbed content which is a single page, to multi-pages to reduce transferring a lot of data on page load, so the homepage has less content on it. (site loads fine as it is).
  5. Update the google web tools and analyzer and start using it.