However, this does not make it any easier to choose between the available options, and the competition between technologies and their supporters (who are often more like fanatics) sometimes takes the form of a real war.
What would a front-end look like in a fantasy world?
Watching these tribal battles, one gets the impression that the most important question any programmer has to answer is:
What technology is the best?
Contrary to appearances, the answer to this question is extremely simple:
There is no such thing as "best technology"
Why? Because all of the above options are great and any of them can help you create a fantastic project.
Therefore, the question you should ask is:
Which solution will be the most reasonable for me, with the project I am working on and with my resources?
The answer to this question is also simple:
Choose the solution that will lead you to your goal (i.e. build the specific project you are working on) in the most efficient way
Where to start?
Now let's leave these very general questions and get down to business.
Typically, technologies are judged in such categories like:
- job market demand
- community and development
But let's be honest - each of the technologies mentioned in this article performs very well in all of these categories.
However, there is one thing where these technologies differ significantly from each other and that is crucial when choosing first:
Why is this issue crucial?
However, the problem is how to get to that level. And that is why the learning curve is crucial, because it determines how efficiently our technology learning progresses.
Assume the following scenarios:
- You are a beginner without knowing the basics of web development
Now let's consider them step by step.
Scenario 1 - You are a beginner without knowing the basics of web development
At this point, you shouldn't think about frameworks and libraries at all. You must first build a solid foundation and learn the basics of web development well.
If you try to skip this stage and start, e.g. with React, you will get discouraged from programming very quickly. It's like writing an essay in a foreign language without knowing even the basic vocabulary and grammar.
Our basic courses are the best place to start your coding adventure.
They are free, easy to follow and will allow you to learn the necessary basics to work with more advanced tools like MDB.Get started
After downloading and installing MDB Standard, you can start learning our tutorials right away. In the first one, you will learn how to create an impressive, responsive landing page.
Recommended choice: Get started with Vue & MDB Vue.
Vue provides higher customizability and hence is easier to learn than Angular or React. Further, Vue has an overlap with Angular and React with respect to their functionality like the use of components. Hence, the transition to Vue from either of the two is an easy option.
MDB Vue will help you smoothly enter the world of frameworks and libraries. Thanks to it, you will learn how to fully use the potential of Vue and gain additional tools that will further improve your work and increase the skills of modern web development.Get started
After scenario 3, the "learning curve" is no longer a key issue when choosing a technology.
- Code Style
- Works demand
Meant to build whole applications.
Focused on building user interfaces.
Focused on building user interfaces.
How readable and intuitive is the code and conventions of the framework?
Library size (over the network):
-runtime.js (runtime) 1.05 kB
-polyfills.js (polyfills) 59.6 kB
-main.js (main) 172 kB
Together: 232,65 kB
Library size (over the network / uncompressed): 32.5KB / 101.2KB
Library size (over the network / uncompressed): 31KB / 84.4KB
How well-performing are apps built with the framework?
Performance benchmarks vary for some use cases — that said, each of these frameworks offers broadly similar performance. You can find very interesting comparisons in this post.
How big is the footprint of the framework with regards to package size and memory usage?
Duration in milliseconds ± standard deviation (Slowdown = Duration / Fastest)
Memory allocation in MBs ± standard deviation
Source: JS framework benchmark
How many features is the framework offering out of the box?
It's an all-inclusive framework that provides more in the box than React or Vue.
Because it's focused on building UI, you'll likely need to extend react with 3rd party libraries.
It's not as all-inclusive as Angular but it offers more out of the box than a react.
What tools are available for the framework?
All three frameworks provide CLIs. These CLIs make it easy to create a new project, support local development and prepare for deployment.
The most capable CLI of the three, it furthermore offers a lot of built-in features, which are missing in competitors out of the box. Yet, the number of available plugins is huge and still growing.
There are lots of great choices for fulfilling almost any requirement.
Although it has fewer plugins and tools available, there is a sufficient number of plugins for most common cases. Taking into account the rapidly growing community of Vue, new plugins are released on a daily basis.
Note:All three frameworks have a great support within code editors like Visual Studio Code or Atom. However to get the best experience you will have to install the appropriate extensions.
Does it offer a way to build native mobile applications?
NativeScript doesn't require Angular, but
it's even better when you use it. NativeScript features deep
integration with Angular, the latest and greatest (and
fastest) Angular framework.
Vue.js is a lightweight framework for building engaging user interfaces. NativeScript powers cross-platform (truly native) mobile apps, using the web skills you already know. Combined they are a fantastic pair for developing immersive mobile experiences.
How mature is the framework?
While the AngularJS (the old one) was initially released in October 2010, the new Angular was introduced in September 2016.
Initially released in March 2013.
s the youngest, initially released in February 2014.
Long-term support and migrations:
According to an Angular team blog post, their major releases are scheduled every six months. Starting from Angular 4 the team has announced that each version will be supported for at least one year beyond the next major version release. In most cases updates are easy and supported by migration tools (if needed).
React's API is quite stable as Facebook states in their design principles. Whenever a new API is released, there are some scripts that help you to migrate. The React team wrote a blog post about their versioning scheme. When they add a deprecation warning, they keep it for the rest of the current release version before the behavior is changed in the next major version.
The Vue Team states that whenever a new major version is released, the previous major becomes LTS for 18 months.
How big is the team behind the framework?
Originally created by Google, there currently are 758 contributors on GitHub.
React seems to have the biggest team with 989 contributors on GitHub.
Though the community is growing, it is not currently as established as or as big as the others counting 215 contributors on GitHub.
Is there a company or organization that owns the framework?
As already noted, Angular and React are supported and used by big companies. Facebook, Instagram, and Whatsapp are using it for their pages. Google uses it in a lot of projects: for example, the new Adwords UI was implemented using Angular & Dart. Again, Vue is realized by a group of individuals whose work is supported via Patreon and other means of sponsorship. You can decide for yourself whether this is a positive or negative.
Typical end user:
Focused on the application which makes it popular with enterprises.
Popular within startups and smaller organizations.
Popular within startups and smaller organizations.
Companies using these frameworks:
What is the current and past demand in the market for people with certain skills? (job advertisements)
Disclaimer: values below are estimated. Due to the ambiguity of phrases like React, values are estimated based on 5 different search results and averaged
This challenge was so exciting that one the developers created a dedicated website to track whether Vue has passed React yet?
Although GitHub stars can indicate an attitude that a community has to a certain technology, it has no correlation with actual usage. Github stars are more of a measure of the "hipness" of a project than its actual use.
Let me visualize why this apparent correlation is wrong:
A web server that powers 38% of the Internet has 1,766 stars on GitHub. A library that adds color to your Node console has 3,206. pic.twitter.com/tGQJi3jYq1— Ben Sandofsky (@sandofsky) June 15, 2018
As you can see, stars are important but they cannot be confused with actual usage
Picking the right front-end framework is important. But far more important is to focus on learning their shared concepts, as this will prepare you for whatever happens to come next. Make no mistake front-end web development like all programming specialties will continue to change and evolve over time