Embedded content flickering and autoplay

[holdit]

I've been testing Piped with extensions like Privacy Redirect and Piped Redirects. Overall it works well enough for my needs and instances are more stable than Invidious ones (good job and thanks to everyone involved with development!).

I'm having two issues with embedded content though. Sometimes videos start playing automatically. It's a bit random... videos might start playing the first time I open the page and not autoplay if I reload the page. Sometimes it never autoplays. Sometimes it always autoplays. I've tried disabling autoplay on Piped's website, but it doesn't fix this problem.

The second problem is this "flickering":

iframe.mp4

This is happening on both Chromium-based browsers I use (Brave and Ungoogled Chromium) on MacOS. I haven't tested on Firefox as sadly it doesn't seem to be very optimised for this platform.

Neither problem happens when using Invidious or YouTube's website.

[FireMasterK]

Can you provide an example website where it flickers?

[holdit]

It happens on many sites. For example, scroll down until the video on this page:

https://arstechnica.com/science/2021/12/mary-queen-of-scots-sealed-her-final-missive-with-an-intricate-spiral-letterlock/

It's already flickering when I reach it. It stops if I start the video and move the mouse away. It starts again if the mouse is on top of the iframe or if playing stops.

arstechnica.mp4

I also had it happening on old.reddit.com, although for some reason this time it wasn't flickering. There's a margin on the right/bottom side of the video though:

reddit.mp4

[holdit]

While looking at the examples I posted above, I noticed that the problem seems to be caused by the custom scroll bar you're using. The "margins" on the reddit example? They're actually scrolling bars.

Disabling the CSS rules for the scrolling bars fixes the flickering problem:

scrollbar.mp4

These are the CSS I've disabled:

I don't know if this happens on other operating systems as macOS seems to handle scrolling bars a bit differently than, say, Windows.

Sometimes I can still scroll inside the iframe, so it seems that something isn't adjusting to the available space.

On a sidenote, pages for embedded content could be optimised. Take this page as an example: https://piped.kavin.rocks/embed/U3lGlmRPMKw

333 requests and 2.3 MB transferred (the video starts preloading). That's a lot for something that may or may not be played. Preloading especially... not sure if it's should be done as bandwidth will always be a problem for instances and some of these preloads are wasted.

For the same video, the YouTube embedded page makes 25 requests and transfers 816 kB (no video preloading) with an adblocker ON. And their player is heavier than the one used by Piped.

Maybe a lot of this could be loaded after the user clicks to play?

[holdit]

Some (all?) vertical videos also don't adapt to the available vertical space.

Eg, YT video on this page: https://petapixel.com/2020/05/15/the-oneplus-8-pros-infrared-camera-can-see-through-plastic-and-more/

YouTube:

Piped (before playing):

Piped (playing):

vertical.mp4

[fmartingr]

In my case, videos autoplay in both the site and embeds no matter the preference I set on my account. (It happens for me at piped.kavin.rocks).

[ghost]

In my case, videos autoplay in both the site and embeds no matter the preference I set on my account. (It happens for me at piped.kavin.rocks).

You should allow cross-site cookies for Piped. So, it applies settings from ther.

[fmartingr]

You should allow cross-site cookies for Piped. So, it applies settings from ther.

Oh, that may be for embeds! But even if that's the case, the autoplay setting should work on the site, right?

[ghost]

Oh, that may be for embeds! But even if that's the case, the autoplay setting should work on the site, right?

Piped disabled autoplay on embeds. See here : #576