6 ms·
React.js three renderer example
- cttet 11y agoCan this be used on React-Native?
- aikah 11y ago> Can this be used on React-Native? Does react-native uses WebGL ? of course not , since WebGL is a browser API. But you can start coding the same stuff for openGL on mobile.
- PhilWright 11y agoWhy does the title have React.js when they are WebGL examples?
- zachrose 11y agoSomething about making 3D primitives into a DOM-like hierarchy with update-able props: https://github.com/toxicFork/react-three-renderer#implementation-details https://github.com/toxicFork/react-three-renderer#implementa... Still wrapping my head around it.
- vcarl 11y agoReact has been ported a few times, React Native is the most well known. Since React is basically describing components as functions of props and state, what's returned doesn't have to be DOM.
- Silhouette 11y agoIt's providing an interface/binding to that underlying functionality that fits into the React model of specifying a UI declaratively. Like almost any framework or library, React tends to be easiest to work with if you can follow its conventions. There is more friction if you want to do something outside its comfort zone, so this kind of bridge is potentially quite useful for anyone who does have a need for 3D visuals in their React-based app.
- morgante 11y agoBecause it's demonstrating the binding of WebGL to React using this library: https://github.com/toxicFork/react-three-renderer/ https://github.com/toxicFork/react-three-renderer/
- rpwverheij 11y agoAny info on the performance of react-three-renderer? Does it make things slower / quicker compared to similar setups with only three.js ?
- bjt 11y agoTwo of the linked examples are benchmarks that let you compare the React renderer with direct updates. I saw no difference (both were at 60 fps for me).
- Everlag 11y agoDid you try increasing the amount of cubes? There's a dropdown at the top. React drops to ~30fps for me on 1500 cubes, direct update stays at a solid 60fps. The delta increases as cube count increases.
- amelius 11y agoIndeed. For me at 500 cubes, React is already about 2x slower (44fps -> 23fps).
- aps-sids 11y agoFirefox 42 on OSX crashes repeatedly on switching the examples.
- onion2k 11y agoInteresting idea. In theory it would be possible to port a scene description language like the one used in Persistence of Vision across to something like this. That might be fun.
- toxicFork 11y agoHi! Author here, thanks for posting this :D I'm happy to answer any questions you may have :) I'll read through the comments when I have time!
- hellofunk 11y agoI'm guessing the reason that I only get between 3fps and 7fps on a 3rd-gen iPad from 3 years ago is that the webgl support is not much on tablets, or at least on older tablets? I get the same canvas 3d experience in these demos as I get in my own demos that don't use React at all. Maybe on newer tablets it would be far different.
- toxicFork 11y agoIs that on all of the examples?