Initial load of Slider Revolution video is clunky.... briefly shows loading symbol, then global layers, then YouTube thumbnail, then video starts

[seola]

I’m wondering if there’s a way to make the initial load of my home page less clunky. The issue takes place in the first 2 seconds of load time on the home page with a full screen YouTube background video that I have setup with Slider Revolution.

I’d love if it just showed the animated loading icon until it was ready to play the video, but instead right now it briefly jumps from the animated loading icon… then briefly to my global image layers (small PNG files) I have setup in the slider… then it briefly shows the YouTube thumbnail image… and then finally the video plays.

It looks messy and doesn’t provide a nice user experience (I’m guessing the quick flashing images could also be an accessibility issue).

It’s a small video file, and it’s less than 2 minutes on YouTube, so I don’t think it’s the file itself, but rather the way the theme or plugin settings are loading.

Here’s a 3 second video that shows the issue: https://screencast-o-matic.com/watch/c3eDczVFavc

Site: http://tinyurl.com/4k3npfb2

Thank you.

[ruenel]

Hello @armintz,

Thanks for posting in! Be advised that your slider background video uses a Youtube video which is a 3rd party site. The slider does not have any control over the loading of the video. It is best that you use self hosted video so that the slider loader will be loading first and then play the slider once the self hosted video is completely loaded.

Best Regards.

[seola]

My concern with self hosted is that it will require the user to load a 30MB video… that is massive if you’re not on an internet or strong data connection.

[christian]

Hey @armintz,

In that case, you will need to find or consult with a video expert to optimize or compress the video.

We can do nothing for this case, regretfully.

Thank you for understanding.

[seola]

No, I don’t need a video expert to optimize the file as that’s not how I wish for the video to be loaded to my visitors… in this case, even if it was heavily optimized by 80%, that still requires massive load time for visitors. Not a good solution.

I’m also confused by this part that you mentioned:

“your slider background video uses a Youtube video which is a 3rd party site. The slider does not have any control over the loading of the video.”

This is not correct, as literally some of the elements that are pre-loading before the video (the exact issue I’m trying to describe) are layers in the Slider Revolution plugin…

Like I said in the original post, I’d love if it just showed the animated loading icon until it was ready to play the video, but instead right now it briefly jumps from the animated loading icon… then briefly to my global image layers (small PNG files) I have setup in the slider… then it briefly shows the YouTube thumbnail image… and then finally the video plays.

[tristup]

Hi @armintz,

It seems that you have used the Video element for adding the background video. I would suggest you use the Background option to add the video, which may resolve your problem.

Thanks