Drei - common helpers for threejs in react

not sure if react-specific showcases are considered OK, but i published this yesterday, could turn into a nice collection of useful helpers: https://github.com/react-spring/drei

if you click the sandbox links you can see it working. these are mostly abstractions for boilerplate-heavy primitives. saw myself repeating set-up code for things like controls, wiring up update loops, etc, so i thought: why not make it re-usable. all these components are self-managed and will clean up on unmount.

3 Likes

Seems fine to me. Although I think this would fit better in Resources than Showcase.

3 Likes

What do you mean by a “responsive” camera by the way? Just that it automatically resizes to fit the browser?

yep, that’s basically it. not much to it, but aspect ratio and resize is taken care of since the canvas sits inside a resizeobserver. :slightly_smiling_face:

1 Like

I’ve been avoiding using resizeObserver because caniuse reports only 70% support. Do you polyfill this? Or can it be transpiled?

yes, it’s polyfilled where missing, i would recommend @juggle/resize-observer

we made a utility lib for it, it even works in nested scroll containers which was a nightmare to get right: https://github.com/react-spring/react-use-measure

1 Like