OrbitControls frameloop="demand" not compatible with Orthographic Camera

caticHarun commented 1 year ago

Before Update

three version: ^0.149.0
@react-three/fiber version: ^8.11.0
@react-three/drei version: ^9.56.24

After Update

three version: ^0.149.0
@react-three/fiber version: ^8.14.2
@react-three/drei version: ^9.84.2

Node and NPM Version

node version: v18.10.0
npm (or yarn) version: 8.19.2

Problem description:

Before the update everything worked all right. After the update, <OrbitControls/> are not compatible with frameloop="demand" when the default camera is Orthographic Camera. I am using <Stats /> to verify this problem. When the Ortographic Camera is the default camera then the FPS Counter is constantly updating. When I switch over to the Perspective Camera it only updates on controls update.

Relevant code:

Cameras:

<OrthographicCamera key={"ortographic"} makeDefault={canvasCamera === "2d"} position={[0, 1, 0]} zoom={120} rotation={[0, 0, 0]} near={0.01} far={100000} />

<PerspectiveCamera makeDefault={canvasCamera === "3d"} position={[0, 1.5, 5]} />

Controls:

<OrbitControls 
            enableRotate={canvasCamera !== "2d"}
            mouseButtons={{
            RIGHT: MOUSE.RIGHT,
            LEFT: leftDisabled ? undefined : canvasCamera !== "2d" ? MOUSE.LEFT : MOUSE.RIGHT,
            MIDDLE: MOUSE.MIDDLE,
            }} 
            touches={{
                ONE: canvasCamera !== "2d" ? TOUCH.PAN : TOUCH.ROTATE,
                TWO: TOUCH.PAN
            }}
            minZoom={20}
            maxZoom={800}
            maxDistance={50}
            minDistance={0.1}
            maxPolarAngle={Math.PI/2 + MathUtils.degToRad(10)}
/>

Jonathynlee commented 10 months ago

Which was due to a change here https://github.com/pmndrs/drei/compare/v9.80.2...v9.80.3

Jonathynlee commented 10 months ago

@caticHarun try adding an override in your package.json for three-stdlib (2.25.1)

"overrides": {
    "@react-three/drei": {
      "three-stdlib": "2.25.1"
    }
  },

Also add to your root dependencies. "three-stdlib": "2.25.1"

timmevandermeer commented 8 months ago

I also experience this on Drei 9.65.3 and indeed think it is related to three-stdlib. It does not occur when locking three-stdlib to an older version. The changeEvent in OrbitControls is somehow dispatched each frame, which causes Drei's OrbitControls to call invalidate() which seems to create its own render loop

pmndrs / drei