Multiple video textures freeze on loop safari on macosx (mobile Safari works)


I have sphere object with multiple video textures on autoplay. All browsers work including Safari mobile (even on my iPhone 7) only on Mac OSX Safari (tested on latest version) the video’s don’t always play or they freeze on the last frame after the first play and then start playing again after a few seconds.

I tried some other three js video texture demo’s and they all do work smootly. So I guess I’m doing something wrong but really can’t seem to figure out what.

EDIT: Was thinking about this issue again and could it be a loading/caching issue? I kind of feel like the video’s begin loading when I’m already on the website a few seconds. I also feel like the video’s arn’t being cached which might cause the freeze as the video needs to download again.

The code I’m using for loading the videos:

video.setAttribute('playsinline', 'playsinline')
video.src = 'videos-compressed/${}'
video.muted = true
video.crossOrigin = 'anonymous' =
video.loop = true = 'none'
const texture = new THREE.VideoTexture(video)
texture.minFilter = THREE.LinearFilter
texture.magFilter = THREE.LinearFilter
texture.format = THREE.RGBFormat
texture.flipY = false = texture
child.material.needsUpdate = true

I’ve tried looking for a solution everywhere but couldn’t find anything. Any help would be really appreciated!


If this issue only appears in a single browser (and only on Desktop) it’s best if you report this issue right here: Make sure to provide a live example that makes it possible for the browser devs to easily reproduce the issue.

Hey thanks! I’m not really sure if this is really a browser bug though. I just found it strange that all other video texture examples on de the internet do seem to run smoothly accept for mine. Any other way to find out what the problem could be?

Do you experience any changes if you switch to a different video (maybe with a different format/encoding)?