This PR aims to get rid of @pixi/react and instead make our own React-Pixi reconciler.
During these changes it also addresses some issues the old implementation had, such as:
Weak type safety for constructors
No typings for events
No support for the globalpointermove event
Correct destruction of all elements, making sure there is no leak
During these changes I also fixed some old TODOs.
For destruction of elements, while React does provide API for when an element is deleted, it is not documented that it will definitely be called. For this purpose this reconciler also tracks all created instances so they can be deleted when we for sure won't need them. As React can detach and later attach elements, full cleanup of any remaining instances is only done when the rendered is unmounted altogether (such as when switching screens).
Old library also used the actual Pixi instances as the instances and tagged on additional properties to them. Instead of this I opted for making our own "wrapping" instance that only contains the raw Pixi instance - any additional code or values are not added to the instance. Thanks to React's API refs still only receive the raw instance.
I tested the code reasonably (I feel), but there still might be some edge-case bugs lurking around. However, moving around room, characters joining/leaving, room devices interactions, switching screens, and even code hot reloading works without issues for me.
Changelog
Technical changes:
- Reworked substantial part of our rendering subsystem for better customizability, fixing several errors and inefficiencies, and getting rid of poorly maintained dependency.
- If you have any problems with graphics (lags, glitches, errors) after this update, please contact us.
Checklist
[x] The change has been tested locally
[x] Added documentation to the new code and updated existing documentation where needed
References
None
About The Pull Request
This PR aims to get rid of
@pixi/reactand instead make our own React-Pixi reconciler. During these changes it also addresses some issues the old implementation had, such as:globalpointermoveeventDuring these changes I also fixed some old TODOs.
For destruction of elements, while React does provide API for when an element is deleted, it is not documented that it will definitely be called. For this purpose this reconciler also tracks all created instances so they can be deleted when we for sure won't need them. As React can detach and later attach elements, full cleanup of any remaining instances is only done when the rendered is unmounted altogether (such as when switching screens).
Old library also used the actual Pixi instances as the instances and tagged on additional properties to them. Instead of this I opted for making our own "wrapping" instance that only contains the raw Pixi instance - any additional code or values are not added to the instance. Thanks to React's API
refs still only receive the raw instance.I tested the code reasonably (I feel), but there still might be some edge-case bugs lurking around. However, moving around room, characters joining/leaving, room devices interactions, switching screens, and even code hot reloading works without issues for me.
Changelog
Checklist