I built a website with the help of Next.js. The website contains images and videos. The videos are autoplayed which means they are fetched immediately. The website has been deployed on Vercel. I experience big issues with the loading times of all assets not only the videos:
Chrome Dev Tools showing loading times of assets
It seems like the assets are served one after another and since some of the videos are quite big ~10Mb other resources are blocked for quite a while.
Is it normal that Vercel does only serve one asset at a time? I thought that multiple videos or images could be served simultaneously.
Also, I am wondering why it does take so long in the first place. My internet connection is roughly 100Mbit/s and I do not experience any issues on other websites I have deployed to Vercel. Just this one is incredibly slow and has issues serving the assets.
Does anyone know what's happening?
I already thought the problem was that there were too many and too big videos on the website which is why I reduced the size of each video and added a lazy loading functionality to the videos so they are just loaded when needed. However, this didn't solve the issue.