Comments (4)
I found the solution!
I was not using references of my objects to update in render loop, so it was not able to update anything.
So, be carefull to follow these steps :
const geometriesRef = useRef(geometries);
geometriesRef.current = geometries;
useRender(() => {
geometriesRef.current.map(model => {
// update things on model
});
});
So I think there is no bugs.
Thanks for your attention!
from react-three-fiber.
yes, use render should be called in the render loop. this is how this demo for instance is working: https://codesandbox.io/embed/9y8vkjykyy
useRender has to be in a child component of canvas though. Do you have a codesandbox i could expect?
from react-three-fiber.
Until I can isolate the relevant code, I purpose this workaround :
useEffect(() => {
function tick() {
// do some render stuff
}
if (delay !== null) {
let id = setInterval(tick, delay);
return () => clearInterval(id);
}
}, [delay]);
from react-three-fiber.
the problem with this is that you create two frames, one for three and another one, its unclear which runs first, and it will turn into a perf sink once you have many. useRender on the other just calls its subscribers smack in the middle of threes update loop, which is fast, but also leads to deterministic results. for instance here we're painting a scene with effects, and another as a heads up display without effects: https://codesandbox.io/embed/mo0xrqrj79 so basically render effects can be orchestrated.
And there's another thing, canvas can be used multiple times (https://codesandbox.io/s/3411q86j51). If useRender was just a global effect, that would cause some tear.
Maybe you have an idea how to solve these without the canvas-tree dependency ...
from react-three-fiber.
Related Issues (20)
- How to render text on top of material from list of materials? HOT 1
- Invalidate is not behaving as expected HOT 5
- Can we modify useLoader to accept an empty string or null? HOT 1
- XRFrame type resolving incorrectly HOT 2
- Error loading OBJ model in React Native HOT 2
- Help: TypeError in is.equ HOT 4
- Primitive with children mounting / unmounting + documentation HOT 4
- This sandbox doesn't work HOT 1
- Canvas eventHandler: onWebGLContextLost, onWebGLContextRestored HOT 2
- Cannot catch error HOT 1
- Is it possible to use react-three-fiber with React-Native CLI application? HOT 1
- help: using the onPointerDown event of a` <group/>` and the event.handlers of `useThree()` together HOT 1
- Types: Removed classes from three.js are still available at R3F HOT 3
- Rendering `<Context.Consumer.Provider>` is not supported HOT 1
- R3F & StereoCamera
- Breaking changes in React experimental branch HOT 1
- Cannot read properties of undefined (reading 'boundingSphere') HOT 1
- Forced landscape HOT 1
- load gltb file show error `Uncaught Invalid typed array length: 64548` HOT 1
- Updating from 8.15.19 to 8.16.1 causes 'demand' frameloop issues with @react-spring/three HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-three-fiber.