So, I’ve created a VideoTexture in ThreeJS and applied it to a plane in my scene.
It works fine, but clearly isn’t being antialiased and as a result is super jagged and pixellated. I’d maybe guess because it’s rendering to a texture thus isn’t applying antialiasing?
I’ve searched everywhere for an answer but can’t really find one. Is there anything I can do to make this higher-res and/or antialiased? I’ve tried using FXAA effect passes in the scene but it has no effect (presumably because the video is rendered elsewhere).
Anyone encountered this before?
Yeah, they’re both me. Just trying to increase my chances of getting a hand with this 
Have you considered to just increase the resolution of the video?
Since the texture is projected onto a surface, it also helps to decrease the laptop’s scale.
Hmm. Video itself is really high-definition (maybe even too high). The jagged edges seem to be a renderer issue.
Would dropping the laptop scale, then zooming in, help? I feel like it’d be largely the same, no?
@Mitch_Furlong Did you find any workarounds? I’m running into this same issue on screens with DPR of 1… I thought it was because I was rotating my web video around the Y axis, but doing that to just the video in a Codepen showed no jagged edges. It’s only when loading it into ThreeJS via the VideoTexture that I’m getting the jagged edges.
For example, screen with DPR of 1:
And screen with DPR of 2:
And here’s the webm video by itself on a DPR of 1:
Update: I greatly improved the rendering on DPR of 1 screens by removing the minFilter setting from the CanvasTexture in the LottieLoader class:
