Every company dreams about never-ending growth. Skyrocketing customer conversion rate. But having a great product is not enough. The product has to be constantly evolving. The company must be able to deliver new features fast and without bugs. In other words, the success depends on architectural decisions made by the development team.
Creating maintainable, flexible and scalable software architecture is not an easy task. But sometimes one pattern can be the game changer. One of these miracles is the design pattern called Dependency injection / Inversion of Control. It makes testing and maintainability simpler. So developers can focus more on customers and their needs.
Purpose of this proposal is to bring unified DI support to our TS + React apps. The DI / IoC concept and its benefits should not be new for our developers, they are used to it from the Dart + Angular framework.
It is probably a strange concept for typical React / FE developers, because DI / IoC adoption is sadly very rare in the common FE stack. It is overall overlooked pattern in the JS / FE world.
There are three most popular DI container libs. I had the pleasure to work with all of them on different projects. It gives me the ultimate power to compare them and select the best one.
Written in TypeScript. Very powerful. Not so easy to learn and use. Uses decorators and symbols for defining class dependencies.
It is basically extracted DI engine from the Angular 5 framework. Uses decorators and reflection. Straightforward and not complicated.
https://github.com/mgechev/injection-js
Powerful, easy to learn and small library. It has seamless integration with TS. Supports several types of injections - constructor, property etc. Does not rely on decorators, so it can be easily replaced and does not introduce vendor lock.