Hello, I’m looking for a way to make the loading of a page on my site shorter.
The page is to be used only on mobile.
Currently it is much too long, between 7 and 10 seconds depending on the quality of the network.
Here is the link: https://www.cilouette.com/contact/32dbb9e3-b5b1-4fbc-a649-dfe38ea377b1
It is a dynamic page, I display data from the database.
I tried to execute the requests on a backend file but it doesn’t change anything. I also reduced the size of all the images used but nothing works. wix-wind.warmupData does not work, nothing launches in the backend.
I rely on you… I don’t know how to find answers
You are calling over 10 functions asynchronously (i.e. with await) and they all take time, and they are done serially. In addition, a couple have incorrect code as they don’t have the await keyword in the query:
export async function getMorningVideoData() {
const videosData = wixData.query("morningMultimedia").eq("type", "video").find();
return videosData;
}
Note that the query statement is missing await.
You will need to find a more efficient way to display the screen.
One way would be to call all of the functions one after the next without waiting for the Promises to resolve, and then do a Promise.all() to wait for all of them to resolve. This will allow the queries to execute in parallel and it will be much quicker than executing them serially. Once they have all resolved, you can then get the necessary data from the resolved results of all of the queries.
Thanks I will try it ! But how can I call the functions one after the next ?
See this article for a very nice explanation and clear example.