Would an opening page help speed of loading?

I always think that an ‘Enter Site’ button on a homepage looks bit naff, but…

…because of the way I want my website to work, with hidden photos etc which can be revealed by clicks on a pretty comprehensive homepage, the homepage contains a lot of MBs and takes a while to load on not-so-fast connections.

So, I’m wondering if a small homepage, which would distract visitors for a few precious seconds, would allow other pages to load in the background, until an ‘Enter Site’ button was clicked?

Or maybe there’s means of telling the website to load one specific page in the background?

Or some other technique, whilst maintaining the style?

Any thoughts or ideas would be welcome! www.poulson.info

Thanks.

P.S. I did wonder if @Whittfield 's Card Designer add-on would be a way of managing the homepage size, but after three attempts to contact him, with no response at all, I’ve concluded that customer service is not included in the $25 fee. A shame, because he mentioned it might help me months ago, before the Blocs Store even existed.

You have the preload option inside Blocs but this is not something I like and at times it can block a website from opening entirely if an external resource is involved for video etc. I know somebody who hand coded a website many years ago that solved this issue with a graceful animated introduction that faded in and out as images were downloaded for a slideshow in the background and I would love to see some means of doing this in Blocs.

One point worth adding is that your server configuration can have a huge impact using technology like LiteSpeed with Quic that downloads content to the browser very efficiently through reduced latency. As always though, much will be decided by the weakest link and you cannot do much about somebody still using Windows XP with 1mbps connection in the countryside.

You may have some luck if you investigate header commands like prefetch and preload etc

2 Likes

Thanks for that @Flashman … I can see ‘Lazy Loading’ which doesn’t work for me, but not preload.

Where is that to be found? (Unless you mean the spinning anim.)

As for server config - well above my pay grade, but I take your point!

If you go to project settings you will see an option for preloader that you can select and this basically stops anything from appearing other than the animated graphic, until the entire site has loaded. Many like using this, but personally I think it’s a dangerous option. It could in theory block your entire site from appearing due to the user having a browser script blocker installed that doesn’t like an icon or analytics etc.

14

You don’t really have to be a server expert or configure this yourself for faster web hosting. It’s just a case of choosing the right web hosting package for options like Quic, which is basically http/3 now.

Those header options I linked to are something you could use to preload data in the background as a page opens, so if you expect visitors to see your gallery page that could be preloaded in the background via those header commands once your home page has been opened. It’s literally one line of text in the page setting header.

Okay, thanks @Flashman, I’ll study all of that and get back when I can!

Preload is pretty well supported now. Certainly much better than a couple years ago.

https://caniuse.com/#search=preload

Back on the case now.

Apologies for my lack of tech knowhow… is this the bit that you are pointing me at?

If so, where does the link rel=“preload” go? The Add Custom Code box?

Thanks again!

Yes it’s that bit. It just goes in the page settings header of Blocs inside the add code area. Note that you can combine prefetch and preload etc in some cases as they perform different tasks. You should run speed tests afterwards to see what works best with your particular server.

Those were really good articles. Thank you @Flashman for sharing them.
With Preload, Prefetch, and Preconnect being so important for making our websites faster why @Norm does not Blocs incorporate these vital properties?
In other word why do we have to edit the code for those necessary areas?

@KBConcepts I could be wrong but I think this is one of those things that should be left to the individual designer, depending on what they want to prioritise and I don’t think it would be viable for Blocs to take automated decisions in this sense. If Norm can think of a clever way to utilise this and make Blocs faster I am sure he would jump on it.

Sorry @Ian, but I have not seen any of your attempts. I thought maybe you were another person to whom I was helping. What name did you purchase under?

Luckily you’ve tagged me here. I just did a search and there’s no other post’s that I’ve found where you’ve tagged me and I’ve received no direct messages that have gone unanswered. :man_shrugging:t5:

I do respond to all that I receive, I want to fix the method that you used so may I ask how you reached out?

Regarding this topic, what you are after isn’t something that Card Designer would address in the way you explain. At most I would be preloading the images that Card Designer uses.

To be honest, lazy loading and preloading are things I never worried about too much. If the page is too heavy I look at it as a design problem, more than anything.

1 Like

Hi @Whittfield,

I asked one question on your store front, it’s still there unanswered, and two via tawk.to on your website.

Attached is the ‘receipt’ for the second one.

I believe @Norm has also prodded you.

One of the questions I asked was if you allow a short trial of Card Designer as I have no idea in advance if it will do the job for me, i.e. make my website lighter, and potentially behave like Squarespace’s Avenue. And $25 is a lot to spend if it doesn’t.

Thanks @Flashman, I’ve uploaded the site with just the image-heavy front page pre-loading, and it seems a lot cleaner… before, the front page would partially load and go, and then load again.

It all seems a lot smoother now!

(I’ve also updated my macOS and iOS which may have made some difference, I don’t know for sure, but I think your suggestion was the solution.)

That’s good to hear. It all depends on how you set it up really and the optimal configuration will vary on every site, depending on what you are doing. For example I have a site using Cloudflare where I prefetch the DNS and preconnect the CDN like this:

<link rel="dns-prefetch" href="//ajax.cloudflare.com" />
<link rel="preconnect" href="//cdnjs.cloudflare.com" crossorigin>

Recently I took some sites off Cloudflare, so I removed those headers, but I should really think about the best alternative since making the change. There is all sorts of magic you can add to the headers with single lines of text. For example I always add canonical links that are good for Seo, plus an unspam directive:

<link rel="canonical" href="https://example.com/"/>

<meta name="no-email-collection" content="https://www.unspam.com/noemailcollection/" />
2 Likes

There is currently an issue with the store that means some developers may not get notified about these comments. Its something we plan to fix before the end of the year.

Nope.

Lost me.

And it was all going so well!

:flushed:

As long as it is working well I wouldn’t lose too much sleep over it, but when you have some time and in the right frame of mind just spend some time studying the differences between preload etc.

The canonical link tells search engines what is the correct version of your web page e.g https and not http or www. The unspam code is simply something designed to stop bots from collecting email addresses posted on your site. I don’t post email addresses on the website anyway, but I never receive any spam messages through my forms either, so perhaps it is more useful than I realise.

Hi @Ian, yes I spoke with Norm regarding you, but each time I tried to cross reference your name with my contacts I couldn’t find you. So I assumed you made a purchase through some other name. I’ll work on making sure I can be reached better through my site. In the meantime you are free a questions of me here in the forum or direct message me here.

Unfortunately it’s not possible to provide a demo of the bric. Video is all I can provide. If you need to see something specific I can make a short video demonstrating what it does and how it works.

Sounds like Card Designer is not what you are thinking it is. This is an asset that provides a way to make cards that can be dressed up and designed with nice features. It’s an image slideshow, a card UI designer, and integrates with some important Blocs features.

Card Designer does not have anything to do with optimizing pages making them lighter. It’s also not a theme or template. It’s a Swiss Army knife for creating different types Card UI’s. People use it to create cards that match the design of their site and to add some features they otherwise would need to hand code.

Also, there’s, a very big update coming really soon. I’m also making a new demo video that illustrates the benefits of using Card Designer. I’d recommend not making a purchase until you watch that video. Maybe it helps you decide if the bric is right for you.

@Flashman, I’m currently researching CDN’s so I can speed up my websites. First off, I’m not at all familiar with using them so consider me a newbie. I see when I do an on-site audit, I always get the warning that I’m not serving my resources (images, CSS and JS) from CDN’s. So I figure it’s time to address and resolve that once and for all. So with all that said, do you have a recommendation on a good/best CDN that’s affordable (or free) and works well? Thanks in advance for your consistently solid advice! - Randy

Check out Cloudflare. I’ve used them in the past.

Sometimes for JavaScript I will use www.cdnjs.com