Dependency Injection & Extension Manager
- Dependency Injections Frameworks
- Dynamic loading
- Webpack module federation
- Plugin systems
- Extensions build with Standard Javascript modules
- Choice Matrix
Dependency Injections Frameworks
Quite interesting article about dependency injection in Javascript: https://snyk.io/blog/dependency-injection-in-javascript/
Vue has dependency injection between the Vue modules using the "provide", "inject" functions.
Some frameworks to investigate:
- injection-js
- InversifyJS (most starsĀ tested successfully)
- TSyringe
- awilix
Dynamic loading
Different systems support dynamic loading of javascript code. The question will be how to package more than one JS file.
There are multiple popular package managers which have features for dynamic loading but there are some difficulties to overcome, in particular concerning shared libraries.
Webpack module federation
- webpack Module Federation: https://webpack.js.org/concepts/module-federation/
It seems possible to bundle multiple apps as webpack packages which can load each other. This could be a good way to dynamically load modules from a configuration. Our modules could contain components implementing specific APIs.
- https://github.com/module-federation/rollup-federation rollup seems to follow the path of webpack for module federation.
Plugin systems
- simple plugin system: https://conversejs.github.io/pluggable.js/
- another plugin system: https://github.com/rekit/js-plugin
- Article about how FIGMA built it's plugin system: https://www.figma.com/blog/how-we-built-the-figma-plugin-system/ includes interesting security consideration (could the plugin be untrusted ?)
Extensions build with Standard Javascript modules
By using vitejs (or rollup) it is possible to build standard javascript modules.
These modules can be loaded dynamically as extensions and provide components to inversify allow to extend the features.
Static bundling can also been turned on to bundle some of the external modules in the main package.
Choice Matrix
Framework | Acceptability | GitHub Link | Maintainer | License | Project Activity | Typescript | Hard dependency on node | Dynamic load | Static load | Annotations based |
---|---|---|---|---|---|---|---|---|---|---|
injection-js | No strict technical advantages over InversifyJS but the project seems less active and less popular (even though InversifyJS is not much active either) | https://github.com/mgechev/injection-js | Community? Extracted from Angular | MIT | libraries.io Latest release: Nov 7, 2020 Number of stars: 1.15k Commits in the last 90 days: 1 | yes | no | yes | ||
InversifyJS | The project is in maintenance mode but still active and proved to be working well in our prototype. | https://github.com/inversify/InversifyJS | Community | MIT | ossrank/libraries.io Latest release: Oct 14, 2021 Number of stars: 10.1k Commits in the last 90 days: 9 | yes | no | yes | yes | not mandatory, the current PoC does not use annotations |
TSyringe | we tend to prefer community based development | https://github.com/microsoft/tsyringe | Backed by Microsoft | MIT | libraries.io Latest release: Jun 20, 2023 Number of stars: 4.17k Commits in the last 90 days: 1 | yes | ||||
awilix | only support node environment | https://github.com/jeffijoe/awilix | Community | MIT | libraries.io Latest release: Oct 12, 2023 Number of stars: 3.07k Commits in the last 90 days: 16 | yes | yes | |||
typedi | not active recently | https://github.com/typestack/typedi | ? | MIT | libraries.io Latest release: Jan 15, 2021 Number of stars: 3.38k Commits in the last 90 days: a lot but only automatic dependency upgraded, will not be released | yes | yes | |||
diod | too small, not active recently | https://github.com/artberri/diod | ? | MIT | libraries.io Latest release: Nov 7, 2022 Number of stars: 64 | |||||
mani-injector | too small, not active recently | https://github.com/jmankopf/mani-injector | ? | MIT | libraries.io Latest release: May 1, 2022 Number of stars: 16 | |||||
typescript-ioc | too small, not active recently | https://github.com/thiagobustamante/typescript-ioc | ? | MIT | libraries.io Latest release: May 1, 2020 Number of stars: 440 | |||||
bottlejs | https://github.com/young-steveo/bottlejs | ? | MIT | libraries.io Latest release: Jun 29, 2022 Number of stars: 1.26k | yes to be tested | ? | no | |||
typed-inject | no support for annotations | https://github.com/nicojs/typed-inject | Apache 2.0 | libraries.io Latest release: May 5, 2023 Number of stars: 335 | yes | ? | no |
TODO: check the links of https://www.reddit.com/r/typescript/comments/y29103/are_there_any_browser_dependency_injection/