Player.js: Blinking Frame on Safari

[TasioC]

Hi there,

I have a bunch of Autoplay looping Vimeo embedded on my site working fine on Chrome and Firefox but somehow i get a blinking frame while using Safari 12.0
Is there any way to fix this issue?

Here’s the code:
https://codepen.io/ta_io/pen/EzwQOr

Thanks in advance!

[fisherinnovation]

Thanks for the submission! We are digging deeper into the root cause of this issue and will provide updates on this ticket when they are available.

[matthewbeta]

@TasioC Can I ask how you are exporting/encoding the videos?

We have had this issue, and changing how we export the videos from Adobe Media Encoder (see the screen shot below) has removed the flash on each loop. We still get a flash when the video first loads though - not great but better.

Settings

The setting that seemed to make the difference was updating the Bitrate settings to "VBR 2 Pass",
and setting the target to 1 and maximum to 50.

Demo

https://codepen.io/matthewbeta/pen/OeXrKR

(note: there is now a quality issue at the start of the video on Vimeo but not in the original file we uploaded - currently we are treating this as a separate issue.)

Hope this helps

[michaelck]

@TasioC – did you ever find a solution for this?

[askenielsen]

Alright, I might have solved this one.

The trick is to export the video without an audio track, since for some reason the audio track might be a bit longer than the video, which results in the black frame at the end..

It worked for me at least, let me know if you guys have any luck

[luwes]

Thanks for your patience on this one. We have an internal ticket open for this Safari issue, and contacted Apple about it. However it is a Safari browser bug related to MSE and video encoding.

We will keep you posted if it gets resolved!

[bgoosen]

I'm experiencing this same issue as well. It doesn't happen on every video, and often re-encoding and re-uploading the video fixes it, although I haven't worked out how, as it doesn't always do the trick. It is a major hassle as I see no issue with the local copy of the file. Only after it is uploaded and loaded thru an embed. And they even play fine on Vimeo's page. It's so frustrating! If anyone can figure this out, I'll be so happy!

[bgoosen]

A bit more info - our studio mostly makes videos without audio. On all of these I've been able to remove the glitch with a re-encode and re-upload. We also have a small number of videos that have an audio track. I have not yet been able to remove the glitch from any of these.

[bgoosen]

Found a workaround, I think. If you add the parameter "?transparent=0" to your embed code, you will not get the white blink in Safari. I think the tradeoff is that while the video loads, it will display a black box. So, not a perfect solution, but I think I greatly prefer this to a white strobe at the beginning of the video!

https://vimeo.zendesk.com/hc/en-us/articles/115014089487-Iframe-background-color-for-embeds

EDIT: I was not quite right, all that does is give your blink a solid color (black by default, but you can change it with CSS as explained in the support article). If your video starts with a black frame, then it makes it look like the blink is gone, but it is still noticeable on videos that don't start with a solid color.

[silllli]

What’s the status on this?

[C4Framework]

Same. This is becoming an issue for my site as well. I have a lot of videos looping in the background on my site. I only recently noticed this bug.

@luwes Is there a particular encoding that will work better?

[dgrigg]

Seeing this issue on a new site using the latest Vimeo player. Safari only. Any updates or work arounds?

[bgoosen]

Any updates or work arounds?

Sadly the only work around I've found is to try changing your encode settings and re-uploading the video. I have not found consistent settings to make it work either. I use the same presets, and sometimes I get the glitch, and other times I don't. It feels like a rounding error.