react-pixi-fiber | Write PixiJS applications using React declarative style | Frontend Framework library
kandi X-RAY | react-pixi-fiber Summary
kandi X-RAY | react-pixi-fiber Summary
Write PixiJS applications using React declarative style.
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of react-pixi-fiber
react-pixi-fiber Key Features
react-pixi-fiber Examples and Code Snippets
Community Discussions
Trending Discussions on react-pixi-fiber
QUESTION
We are all familiar with the default reconciler that comes with React - ReactDOM.
We also have custom React reconcilers that can be used to interface with "hosts" that aren't the DOM environment, such as mobile devices (famously React Native), VR devices, the terminal (like ink), and so on.
However, there are some custom reconcilers that operate within (or instead of) ReactDOM while in a browser host.
Core question
What is the purpose of custom reconcilers that operate within the browser host?
Examples
Some notable examples of custom reconcilers that operate within the browser host are:
The following snippet from react-three-fiber
threejs elements are declared in React and under the hood it will "map" to particular canvas operations:
ANSWER
Answered 2020-Sep-25 at 17:28There are some interesting advantages when it comes to using a custom reconciler in React. As you see in the README.md file of react-pixi-fiber, it's totally possible to use ReactDOM to render the pixi elements instead of using the custom render from react-pixi-fiber.
Why create a custom renderer/reconciler then?
In this specific case the reason is that ReactDOM doesn't really deal with canvas elements. As you said though, that could have been achieved by a combination of custom hooks/components. If you read the why section of react-three-fiber you will see that by using their custom reconciler you can achieve two things, compared to custom components:
- Everything from threejs will work here, because the support is built into the reconciler.
- The performance is the same as when using threejs directly, because the reconciler has more control over what is rendered and when.
You can take a look here where there's an in depth explanation of the difference between render and reconcile and how the reconciler has fine grained access to: components lifecycles, decides the diffing and how elements are added/removed from the view (be in DOM, canvas, iOS etc).
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install react-pixi-fiber
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page