It is not advised to use Bootstrap directly with React because Bootstrap's JavaScript may alter the DOM directly, interfering with React's Virtual DOM system. Can one say the same about Angular (2+)?
4
votes
No Angular 2 or 4 or what ever number they are now at, does not a have or use some form of virtualdom.
– WilomGfx
angular.io/docs/ts/latest/guide/…
– danimal
@danimal the link is not working!
– Sammy
it is for me... try just going to angular.io/docs/ts/latest/guide/component-styles.html and check out the view encapsulation section
– danimal
Ok, got it. So does this mean that Native encapsulation mode should normally perform better, but would not be compatible with bootstrap JavaScript?
– Sammy
1 Answers
1
votes
React's Virtual DOM term is overloaded. If you mean React Element - a JavaScript object that describes HTML elements or child components and is used during change detection (reconciliation), then no, Angular doesn't have an equivalent. It parses a template only once, creates bindings and processes these bindings during change detection. You can read more about it in the article I've written that compares change detection in both frameworks:
... because Bootstrap's JavaScript may alter the DOM directly, interfering with React's Virtual DOM system. Can one say the same about Angular
Yes, that is also may be true with Angular. You have to be careful for other libraries to not touch the DOM that Angular created. 3rd party libraries can only work with the DOM they themselves created, but they need to account for DOM changes processed by Angular, e.g. component destruction with its DOM elements. If 3rd party library appends a DOM node into a component's view and Angular destroys the host DOM element, you're going to have a memory leak because 3rd party library will hold the reference to nodes that are no longer in the DOM. Angular provides tools to work with the DOM, you can read more about them in:
