justinribeiro / lite-youtube

The fastest little YouTube web component on this side of the internet. The shadow dom web component version of Paul's lite-youtube-embed.

Home Page:https://www.npmjs.com/package/@justinribeiro/lite-youtube

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Mobile double-tap and autoload

FreekGille opened this issue · comments

I run a little hobby project and the core functionality is displaying specific YouTube videos. 85% of my users are mobile, the YT video is above the fold and 100% of visitors play the YT video.
I initially implemented your fantastic module as Pagespeed Insights tagged the YT iframe as an area of improvement and a facade would improve loading times etc. and therefor hopefully ranking.
The issue now is that on mobile, without autoload activated, it requires two tabs to play the video (as mentioned in #23 and #30). If I activate autoload, the Intersection Observer will basically instantly trigger as the video is above the fold. This does "work" but I wonder how much of an actual improvement this is over the just embedding the iframe.

Do you have any opinion on this scenario? Will adding lite-youtube in this case actually improve things or does it not make any sense in this case?

An example of a page is: https://www.cocktailexplorer.co/cocktails/rebujito/behind-the-bar/

If I activate autoload, the Intersection Observer will basically instantly trigger as the video is above the fold. Do you have any opinion on this scenario? Will adding lite-youtube in this case actually improve things or does it not make any sense in this case?

Intersection Observer is async and non-blocking so from a perf-standpoint, you're not going to lag unless the calc is heavy (which in the case of the loader, it isn't). I haven't measured the above-the-fold autoload, so I'll put that on the to-do list. 👍