I believe that the loading time of images and collections on my website is not a pleasant experience for customers, images and information take a long time to load, how can I solve this?
website: https://www.obilheteiro.com/
I think the first step for you would be compressing your images as they’re quite big, other than that you have the option of splitting up the events call to firstly get the hero one and then the others
I’m not sure how to split an event call, could you help me with that?
image compression, I’m already working on it
Just make two collections in weweb and make two endpoints in xano, one to get the featured event(the first one) other to get all others
I did it this way, but I’m still having delay problems
any other suggestions?
I believe I should also compress the images, but in Xano I can’t find an easy way to do this
You can try turning off Fetch collection automatically in the collection settings and then in the On page load workflow do the Fetch collection action one by one
This is already applied on my website, but this delay still persists, I’m trying to optimize it as much as possible but I haven’t found any solution yet
Check these things:
-
Use Image Lazy Loading: Lazy loading - Web performance | MDN
-
Where are the images located? If you are using a backend service like Xano with the free plan, don’t expect good performance because your instance is shared with many other people. Make sure your backend is performing well.
-
Use server side pagination when fetching collections to get just a few images on each call.
Check this out
I use the Xano paid plan,
I’ll try these suggestions, thanks guys
One last thing you can do is to show loaders components where the images should be until they are rendered. No matter what you do, you can never ensure you will get an http request always fast. Many things could happen that won’t ever be under your control.