Initially, I wanted to write a long article about my skepticism when hearing about shiny piece of tech, especially in the frontend world. I’m very tempted to reject all these frameworks and tools every cool kid is using these days.
Fortunately, I did not and I started using VueJs with Vuex last year. The advantage of all these frameworks (Vue, React, Angular,…) is that they do the DOM and events manipulation for you. To do so, they use an implementation of the good old observer pattern: every change of data in a component or in the global state can be captured so that your UI is automatically updated. They (at least React and Vue) use a DOM abstraction (the virtual DOM) to do this more efficiently than you, I’m curious to see how it works in the source code!
On the other hand, be aware that observed state is not made of plain Javascript objects, but object proxies. Not all action of on the proxy will trigger an update of the observers. Moreover, some of the dependencies you may use can be affected by the way the DOM is manipulated. For instance, with Vue you may want to use Font Awesome Vue component instead of the standard Font Awesome JS bundle. I spent hours to understand why my icons were not updated in some cases!
So, when do you want to use a front end framework? When you plan to update your UI in response to data update and you don’t want your UI logic to be mixed with element creation and event handling. And that’s pretty often!