pmndrs / react-three-fiber

🇨🇭 A React renderer for Three.js
https://docs.pmnd.rs/react-three-fiber
MIT License
27.62k stars 1.6k forks source link

Applications is blicking when shared via Microsoft Teams #3336

Open erikpa1 opened 3 months ago

erikpa1 commented 3 months ago

I, we have, our 3D web platform built on fiber, and we noticed one thing, when platform is shared via MS Teams, the world is blicking, like recording and rendering frame mismatch,...

With OBS and free eye there is no problem. But in teams there is like swap between WHITE COLOR (html background) - COLOR behind Canvas, and the 3d world itself...

Do you have some experience with this ?

If I remember right, pure three js don't don't have the problem.

I can add video, but I can't put it here, but I can send in on private mail....

CodyJasonBennett commented 2 months ago

We can't do anything without a reproduction and frankly I think there's more to be done on your side to whittle this down. If you need a vanilla example, this is the configuration R3F uses:

https://r3f.docs.pmnd.rs/api/canvas#defaults

const renderer = new THREE.WebGLRenderer({
  powerPreference: 'high-performance',
  antialias: true,
  alpha: true,
})
renderer.setPixelRatio(Math.min(2, Math.max(1, devicePixelRatio)))
renderer.setSize(innerWidth, innerHeight)

const camera = new THREE.PerspectiveCamera(75, innerWidth / innerHeight, 0.1, 1000)
camera.position.z = 5
erikpa1 commented 2 months ago

I will try to figure out some repro steps, not easy, Fiber is part of bigger private platform... I was just asking, for option of "maybe" we have experienced it...