When not to use React-Js and how to recover!
We at botsplash, Love ReactJs. It has made our web development experience a pleasure to work with. There are a number of awesome resources to get started with web development and mobile development. I strongly recommend the framework, along with Redux for any aspiring developer (even if your focus ML/NLP/Deep Learning, you can showcase your model with real users). In our deep involvement of using ReactJs we also encountered not-so-best fit situations. This article explores when not to use ReactJs.
When not to React
ReactJs can be a go to option for most of the web/mobile development needs and these are some of the situations to avoid,
- High performance needs
- Devices with limited hardware capabilities
- Web page widgets such as botsplash chat that are installed on 3rd party websites.
While ReactJs and Redux perform reasonably, we have observed that performance is sometimes sluggish and would not be ideal for widget scripts.
instead use Pure Javascript:
- Usage of HTML DOM and front-end components is MINIMAL (not a Single Page application)
- React/Redux Library size and download time is NOT acceptable
- Nested/complex state management is NOT needed
How to convert ReactJs to Pure JavaScript
It would be ideal to make the right choice upfront but many times its not possible given, we like to use our best React Hammer, where possible.
To convert a ReactJs app to pure Javascript, is simple with 3 simple steps (as implemented by Sumit) :
- Remove React references and Invoke as Pure JavaScript
2. Convert JSX syntax to document.createElement references and update them on state changes
3. Managing component state. Of course, this requires more planning and execution than React Code, but allows to get fine-grained performance goals.
These steps are just the start and depending on your application complexity, you will have to apply these principles across all child components. If this increases the complexity of your code, it would be worthwhile to check other alternative such as preact or deku.
Conclusion
React is a great choice for modern web and mobile development and with the update license, any big or small organizations can now use it without consequences. That said, there are sometimes it needs to be avoided for performance reasons and if you are caught off-guard like us, you could use the gist above to convert your React code to Pure JavaScript as starting point.
If you have feedback or alternate approaches, please share it in the comments section. I look forward to write about “Best Practices with ReactJs” in a follow up article.
If you like our solutions or want to join our team, contact us at jobs@botsplash.com
