Youtube-embeds load 800 base.js file / div-overlay with auto-play gets triggered when opening other tabs

Description:

I’m embedding youtube videos, but for every video it loads TWO 800 kb base.js file on the first page load, even before I’m scrolling down to the videos. Which is in itself already a problem.

If I want to mitigate this problem by installing a div overlay, I’m forcing the user to click twice to play a video, which is unintuitive and unwanted.

If I want to mitigate this issue, I try to use autoplay, but because all videos are in content tabs, the auto play will trigger the videos of previous tabs because its original div overlay was removed.

Step-by-step reproduction instructions:
Create 5 tabs, of which one open on load. In each tab content there is a video that gets shown once you click the corresponding tab list. Check on Chrome Dev tools ‘Network’ tab to see what gets loaded on page load. You should see all base.js files of 800kb. Then try to avoid this by adding a div overlay and autoplay. Once you now open a first video on a tab by removing its div, its auto play will trigger once you open another tab, which is unwanted

Screenshots, screen recording, code snippet

  • WordPress version: 6.3.2
  • Cwicly Plugin version: 1.3.1

Hi @boris,

Thank you for taking the time to report this!

The div overlay provides a solution for this.

Indeed this behaviour is unwanted, and is a bug.

We’ll be sure to fix this as soon as possible.
Apologies for the inconvenience.

thank you so much! no apologies needed

1 Like

Thank you for your patience on this, @boris!

With 1.3.2, videos will be paused when opening/closing a modal or switching tabs/accordions.
Kindly let me know if this is the case on your end.

Thank you in advance.

1 Like

I’ve just checked and it works for me! Thanks so much. I’m now able to use div overlay to avoid the network load because I can safely use auto play! Thanks

2 Likes