Memory leak when switching cameras

[Pinpickle]

When switching cameras, a small amount of memory is leaked. This is enough to get Safari to crash on an iPhone 13 Pro after enough switches (somewhere between 500 and 1,000) on a simple scene.

Recording from an iPhone

It crashes about halfway through, auto-reloads, then crashes again and refuses to reload. This is due to running out of memory.

Warning: the video and reproduction strobe a bit as it changes the camera 100 times per second to speed up the crash.

RPReplay_Final1711087455.mov

Reproduction

Here's the reproduction: https://stackblitz.com/edit/vitejs-vite-khvsd4?file=src%2FApp.tsx

To run it on your phone, you'll need to pull the stackblitz down and run it locally (npm install then npm run dev), then open it on your phone via the local network.

Misc comments

With a more complex app, I am able to crash the app in ~10 camera switches with an empty EffectComposer. I can't work out exactly what is causing the increase in memory consumption in the more complex case.

I think this is due to the fact that for every camera/scene change, the useMemo call in EffectComposer creates a new instance without disposing the old one, thus keeping all of the textures for the passes around.

react-postprocessing/src/EffectComposer.tsx

Lines 105 to 115 in 29fda1b

	}, [
	camera,
	gl,
	depthBuffer,
	stencilBuffer,
	multisampling,
	frameBufferType,
	scene,
	enableNormalPass,
	resolutionScale,
	])

[Pinpickle]

Submitted without finishing, oops. I'll edit with the rest :)

Done!

[davcri]

Hi @Pinpickle the issue is happening to me as well.

I made a PR in which I tried to use refs and recreate/dispose objects whenever the effect triggered, however it doesn't seem to solve the problem.

I also noticed that many effects use <primitive dispose={null} /> which overrides the dispose() method, preventing it from being called.

However this is probably a common desired behaviour? Probably not, as Cody commented on Discord with:

Right, forgot that's an issue in R3F currently.
Which might explain bugs in other places where we call effect.dispose() in useEffect.