Different developers, product owners and management have their comfort zones and opinions on the different options, which can be both commercial and technical.
Of the JS frameworks and libraries we’ll cover, Ember has certainly peaked and is now on the downward curve of its cycle of active use and popularity. There was the hope of a road back with Ember Octane released in late 2019 and attracting a niche following. That appears to be spluttering out but it’s still early to stop talking about Ember entirely.
Can We Help You With Your Next Web Development Project?
Flexible models to fit your needs! Quote in 24 hours
jQuery was covered in previous iterations of this post but we’ve dropped it here. The library is still used for some legacy applications that need to support old browsers but with the need for the abstraction layer to deal with interoperability issues between browsers now basically redundant, so is jQuery. RIP old friend! Your legacy will be remembered!
Others, like Svelte and Preact, are fresh sensations and are just starting to pick up a head of steam. They may or may not go on to seriously challenge the dominance of the ‘big 3’ of React, Angular and Vue.js., as they mature. And behind them are shiny new frameworks including Lit, Alpine.js, Solid.js and Stimulus that have their admirers from a technology viewpoint, even if they are still too niche to be considered for most commercial applications.
However, that could change over the next few years with especially the “reactive” Solid considered to offer enough added value over existing frameworks and libraries to potentially make the breakthrough into mainstream commercial usage. But the practical reality is that without the backing of a tech giant, like Google’s active support of Angular and Facebook’s for React, organisations see new frameworks and libraries as a strategic risk, even if they appreciate their technical qualities.
The additional factors that can often prove decisive in the decision-making process between frameworks include:
And as already highlighted, the decision of which JS framework to run with on a new project or migration of legacy apps is often as much down to strategic business case factors as technical pros and cons.
But what we will do is look at both the trends in popularity between the main choices of React, Angular, Vue.js, Svelte and Preact and what is influencing those trends. That will offer insight into the strategic considerations that might influence your decision.
And we’ll also take a broad overview of the technical strengths and weaknesses of those frameworks. The qualities that will help determine the suitability of a particular framework choice for a particular app, all things being equal across the strategic business case considerations.
Flexible models to fit your needs!
The distinction between a programming language, library and framework can be initially confusing. Non-technical management can often presume React, Angular, Vue.js, Ember and jQuery are programming languages.
But what exactly are libraries and frameworks?
A library is a collection of pre-written ‘code snippets’ that perform commonly used JS functions. These snippets are used like Lego blocks to build more complex configurations of functions. For example, if you wanted your application’s search function to offer an autocomplete feature, a library snippet of code would be inserted.
Ultimately, libraries offer code snippets that speed up the process of building an entire project. But they are not a silver bullet that can be used to format a complex app from beginning to end.
A JS framework is, on the other hand, a full toolbox that can be used to create a website or application. A good analogy is to think of libraries like the fixtures, fittings and furnishings of a house. And a framework is more like the template and pieces used to build a pre-fabricated building.
A JS framework provides the skeleton that an entire web development project is built around. The framework provides page templates that leave space for the details to be inserted in the form of custom code. That differs from using a library, where the developer decides where to add code snippets.
The strength of a framework is that it offers a lot of efficiency and organisation. The code is well-structured and the framework offers out-of-the-box solutions to frequently encountered coding challenges. The downside of a framework is that it allows for less flexibility. Additional custom coding of user experience and functionalities is limited to where the framework is designed to allow it to be inserted.
A framework calls your application’s code. But if you are using a library, your application calls the snippets of code from the library.
Angular, Vue and Ember are examples of JS ‘frameworks’. Svelte, the new kid on the block, is described as a ‘component framework’. We’ll go into more detail on what that actually means when we look at Svelte in more detail.
If you want greater control and flexibility and are willing to spend some more time putting your app together in the way you want, then a library may make more sense under the circumstances.
Anyone approaching a commercial web development project in the months ahead will almost certainly make a choice between React, Angular orVue.js. Legacy projects sometimes still make use of Ember but very few new initiatives. Svelte and Preact are gathering enough momentum that they might be considered by more adventurous project sponsors or development teams if the skills are available.
Despite appreciation for their technical qualities by developers who have used or started to explore them, it is an exception to see Solid, Alpine.js, Lit or Stimulus in commercial development.
But as an introduction to that, let’s take a look at the wider trends around the different JS framework library choices.
The next two graphics represent how much the various JS frameworks and libraries covered are actually used by developers and their sentiment towards those with awareness penetration of at least 10%. Satisfaction levels among JS developers who have used frameworks and libraries could be a significant clue to how widespread their use is several years from now.
We can see that React is not only very widely used, 80% of JS developers have coded with it, but that satisfaction levels are high with 84% of those polled saying they would happily use it again. Next in terms of usage comes Angular, with54% of JS developers have used the framework. However, that’s a drop from 56% in 2020 and 58% in 2019.
Despite Angular’s relative popularity with those paying for and managing development projects, the developers themselves show relatively high levels of angst in their attitude to Angular. Only 55% say they would use it again, a level of negative sentiment surpassed only by Ember.Evidence usage of the framework is slowly but steadily declining may well be a consequence of its lack of popularity among developers who have used it.
Of the newer JS frameworks and libraries gaining traction, satisfaction levels with Svelte and Solid are particularly high at 90%. That is helping Svelte become more used, with 20% of JS developers now having worked with it compared to just 8% in 2019 and 15% in 2020.
Solid is a new entry to the 2021 SoJS report and had only been used by 3% of polled developers. It will be interesting to see if the high levels of satisfaction among those developers that have used Solid translates into increasing use reported in future editions.
Svelte and Solid are also the two JS options most developers who haven’t yet worked with but are interested to, with 68% of polled developers indicating they are interested to learn the former and 56% the latter.
An interesting picture emerges based on the number of roles that list the various JS frameworks and libraries advertised on LinkedIn. The methodology used set the location to the USA, as the single biggest market for IT specialists and therefore the best proxy for global demand. The platform’s filter does not allow for searches that do not specify a location, capturing all vacancies advertised internationally.
When it comes to commercial demand for developers with competency in the JS frameworks and libraries discussed here, React and Angular are way out in front with 85,596 and 65,384 roles respectively listing the skills under requirements. There is also solid demand for Vue.js developers, with 19,025 vacancies advertised in the USA.
Beyond that, commercial demand is limited despite the enthusiasm of JS developers for some of the newer frameworks and libraries. In fact, there is still more demand for Ember developers, 2680 vacancies advertised, than there is for any of the new rivals. That is presumably mainly due to legacy apps built using Ember.
There is some commercial demand for Solid developers, 1657 vacancies advertised, and to a lesser extent for Svelte, 421 vacancies, and Preact, 125 vacancies. However, it is notable how few of these roles there are compared to those requiring React, Angular and Vue.js. Advertised vacancies for developers with experience in Alpine.js, Lit and Stimulus are in the low double or single figures, indicating companies do not yet see the technologies as commercially viable choices for the applications they are building. That may change over the years ahead but for now Solid, which is the most recently released of the challenger frameworks and libraries, seems best placed to gain serious commercial traction. With the caveat, it is still in the early stages of a potential breakthrough.
The others we have mentioned here, including the new pretenders and legacy options like Ember that have fallen out of favour, also have their merits but are clearly not considered, on the most part, commercially viable choices.
That can be put down to strategic considerations as much as technical merit, especially with regard to the newer JS frameworks and libraries. The volume of resources available to developers and the size and activity of open source communities are incomparable to those that React, Angular and Vue.js benefit from. Equally important is the confidence of project sponsors that they will be able to hire developers able to work with the chosen JS framework or library now and sustainably into the future.
Facebook’s 2013 release of the React library, a more flexible library, drew attention to AngularJS’s limitations and developers started to consider AngularJS outdated and move away from it.
All Angular releases up to 1.x versions are AngularJS, and all releases from 2.x are Angular. In contrast to JS libraries like React, Angular is an end-to-end framework that offers all of the main components needed to build an enterprise-grade web app.
The limitations that are inherent in Angular’s stricter structure, which is also its strength, has seen React overtake it in popularity in recent years. There are also many developers that will argue that Vue.js, designed by ex-Googler Evan You to improve upon what he considered to be Angular’s weaknesses, is the superior framework.
Google’s backing of Angular may not be on quite the same level as the resources Facebook supports React with but is more than enough to ensure the framework is both future-proofed and continues to innovate and improve. Improvements made between versions such as lazy loading, differential loading to improve the loading time of modules and rendering Engine Ivy to improve startup time, response time, and to reduce bundle size, are pluses.
A component-based library with one-way data flow, React has had a major impact on front-end web development, and is today the dominant technology used for JS applications.
React can be credited with introducing concepts like functional, declarative programming, and immutable state, which weren’t previously common in front-end development. React’s other big claim to fame is the introduction of the Virtual DOM, which has helped improve user experience and app performance, especially in the context of a dynamic UX.
Vue.js was first launched in 2014 and then relaunched in 2016. The framework describes itself as an “intuitive, fast and integrable MVVM for creating interactive interfaces.” At K&C, we tend to agree.
I love this description of Vue in a blog article on Packt:
The framework’s main goal is to make ideas in web UI development (components, declarative UI, hot-reloading, time-travel debugging, etc.) more comprehensible. Less dogmatic, it is much simpler to learn for young developers compared to other frameworks, including Angular.
As mentioned earlier, Vue.js was created by Evan You, a former Google engineer, who set out to combine the strengths of both Angular and React, with the idea that would also go some way towards neutralising their respective weaknesses.
Despite arriving on the scene after both Angular and React, Vue.js quickly gained traction and has been chosen by Alibaba, Nintendo, Expedia, and multiple other enterprise-level projects, defying the sometimes lazy assumption that it is a framework for single-page applications.
The fact that Vue.js does not enjoy the backing of a “big tech” corporation makes its growing success all the more notable and begs the question of whether it might not have been even more popular with the level of financial backing Angular and React benefit from.
But Vue.js’s independent nature is also viewed (pun intended ?) by many in the web development community as a positive. It has also resulted in a particularly diligent open source community supporting the project. Problems and questions are typically responded to much more quickly than is the case with the big, corporation-backed frameworks such as Angular and React. Another positive side effect is clear code/API which has not been ‘over-engineered’. This is a great video on Vue.js for anyone looking for a concise, easily digestible summary of the framework:
It’s interesting to note that ‘weaknesses’ attributed to Vue.js are almost all related to the framework’s level of maturity in terms of community size (though it’s also famous for its quality) and enterprise-level support. On a technical level, complaints about shortcomings are hard to come by, indicating Vue.js is likely to continue to grow in popularity.
Interestingly, as Vue.js has become more frequently used by JS developers, satisfaction levels have dropped from 91% in 2018 to 80% in the most recent report. Again, the biggest change came between 2018 and 2019 when usage of the framework rocketed. That suggests that developer satisfaction levels are significantly influenced by how much they use a given framework or library in a commercial context.
Satisfaction levels with the Solid library are currently at 90% but usage is low. Based on Vue’s pattern, the more developers use Solid commercially, the less satisfied they can be expected to become. Let’s keep an eye on that theory over the next few years!
The release of Preact X cleaned up the library’s code even more and added new features and compatibility enhancements to support more third-party libraries.
Preact’s size and speed mean that it is generally most suited to light mobile web apps or web widgets that React can be heavy for. It’s minimalist nature means Preact will generally be considered for smallish projects where performance is prioritised or embeddable components which prioritise lightness.
The Ember open-source framework is an old friend of developers, originating from Apple Music. Inspired by the Ruby on Rails principle “Convention over Configuration,”, Ember is best known as a massive repository that serves as a dictionary for app development. It takes into account convention rather than juggling configurations and enables two-way data binding.
Ember has seen little in the way of major changes since being first released in 2012, which means it is a strictly backwards compatible framework. On the flip-side, the framework is updated every six weeks and claims it maintains a strong commitment to stability. Netflix, Apple and Microsoft are just some of the corporations that have used Ember in apps.
You might also be interested in our blog post directly comparing Angular vs Ember.
Svelte’s second unique quality is the addition of first-class support of reactivity. That allows for improved performance without the need for a Virtual Dom, which makes Svelte’s rendering the fastest of any JS framework.
Component-based (HTML, CSS, and JS) and lightweight, Svelte is written in TypeScript. But crucially, the framework doesn’t require knowledge of TypeScript to fully use it.
The leap in the number of JS developers using Svelte, from just 8% in 2019 to 20% in 2021, is notable and if it maintains its current trajectory could soon be seen as a mainstream, commercially viable alternative to React, Angular and Vue.
Solid is considered to be the first truly reactive JS framework with function components only called once. That allows developers to do things not possible in other frameworks and libraries such as using set intervals predictably at the top level.
Data that changes is observed by the framework and surgically update this data in the exact location in the DOM when it changes instead of re-rendering the entire component, making it genuinely reactive. Nested reactivity is achieved via stores whose return values are a proxy object whose properties can be tracked.
So finally, which of Angular, Vue, React, Preact, Ember, Svelte or Solid should you choose for your app? As outlined above, each framework or library has its strengths and weaknesses. The right choice depends on the particular needs of an application and is also often at least as influenced by developer resources and business considerations.
But we would be cheating if we left it so open at the end of such an extensive review of the six. So, here are some rules of thumb to help you decide:
And if you still can’t make up your mind, try them all out in different contexts. You’ll come to your own conclusions.
Krusche & Company is a Munich-based nearshore IT outsourcing company specialising in web development, DevOps and cloud with over 20 years of experience. We support and enable our partners’ digital goals from enterprise portals for some of Europe’s best-known brands to lean MVPs for promising start-ups and everything in-between.
Our model of German management and nearshored tech talent combine to provide a unique blend of quality, control and price. We prioritise excellence in communication on an equal footing to excellence in our tech stack.
If you need software development capacity, cloud-native development, migration or architecture services, DevOps, in the form of a team extension or dedicated team, please don’t hesitate to get in touch. We’d love to hear about your project needs and discuss how we could help you realise your objectives on point, on time and in cost.
K&C - Creating Beautiful Technology Solutions For 20+ Years . Can We Be Your Competitive Edge?
Drop us a line to discuss your needs or next project