Research

I've researched the four most popular frameworks.

• Blazor
• Angular by Google
• React by Meta
• Vue

Goals

From an architecture and development perspective, I came up with a list of goals.
Keep in mind I often get into teams working on long standing projects.

• Understand the differences between the frameworks
• Architectural structures
• Type of application they are best suited for
• Difficulty to learn
• Long Term Support (TLS)
• Most compatible with existing well-known technologies
• Data management
• Data source support
• * Ability to implement into an existing application
• * Suitable for non .net teams

Short re-cap of the final result

Blazor from Microsoft

Blazor was developed by Microsoft, which initially used the experimental project 'Electron Webwindow'.
By adding SignalR, it created a complete environment where backend and frontend work as one engine, responding to every change in every layer.
Inside, it separates how to calculate the UI and render other requests.
Blazor doesn't make a differents between calculating any of the UI request (mobile, web, form, module).

Working inside the framework with the back and front-end makes data more secure and less vulnerable.
Architecturally and programmatically a highly efficient and productive model to work with.
That separates Blazor from others (mostly JS) frameworks that only calculate UI changes.

Blazor is fully developed to work with HTML and CSS, without Javascript or converting data and data bindings at any scale.
Blazor server runs a bit on a distance on its own, with the highest security because everything happens on the server and only Ui data is sent.
Blazor web assembly comes closer to the JS frameworks, as they also send data to the client to use the device for rendering.
Besides a 'less data security*' in Blazor web assembly, the pros become clear when the device has a poor connection or interruptions.
Where the server stops, webassambly remains an independent device.
If the implementation is done well, it can cache the data and still serve the user.
It uses the background 'bad' connection to update the data on both sides.

--End --
After my research, Blazor separated itself in many ways. For new and complex apps, Blazor is undoubtedly the framework.
So I choose Blazor



Even Blazor is not the holy grail.
As a good architect I must be aware that not everything can or will with .net Blazor.
Especially for existing projects or teams that don't work with .net. Those two notes became new conditions.
Since the investigation was already done, I push Blazor out of the results.
I re-examined the other three JS frameworks to see if they could meet my desired condition.

I am delighted with the end result.

Angular by Google

Angular(2+) has been rebuilt by Google for enterpice environments.
With its extensions included and Typescript integrated, it is a heavyweight framework. It creates a Real DOM for its dynamic loading system.
Works really well on mobile and web apps.
Best used for complex large-scale apps.
You have to start from scratch, It can't be easily added to an existing application.
A drawback: you have to work within the boundaries and the 'guided' lines of the framework.
It requires more from your developers to learn 'Angular' specific coding knowledge and the knowledge of the Angular system to do it.

React and Vue similarities

• A framework based on creating a virtual DOM
• An easy-to-learn framework
• Component-based architecture

React by Meta

It is currently the most popular and widely used JS framew ork.
React can handle large apps.
It is SEO friendly and supports JSX.
Their active community (under pressure from Meta) pushed very frequent updates (mostly from Meta),
besides a positive point, it also has a negative impact on your environment and makes maintenance costs 'unnecessarily' high.
The update often goes beyond backward compatibility, wich costs a lot of extra development time.

Vue

Along with its similarities to React, Vue is a bit of both worlds.
Angular's two way data binding and React's virtual DOM.
This makes it extremely flexible. Vue is the fastest and most lightweight framework of all.
Best suited for SPAs and 'smaller' web app environments, means no enterprice or huge environments.
Basically suitable for any company smaller than facebook.
Easier to learn for developers.
Best suited for integration with other libraries and combinations of script and HTML/CSS.
Currently, Vue is the fastest growing JS framework with the highest star rating on Github.

Lightweight framework

Unlike most other JS libraries, Vue is really lightweight. That means fast and is stripped of unnecessary ballast.
Vue also easily combines with HTML and CSS to create a powerful and standardized UI

For existing projects

Vue can be easily added to existing projects and runs side-by-side with existing technologies.
That saves rebuilding and guarantees you an lifetime extension of your applications to fit into the modern era.

Work DRY

All three frameworks gives you a simulair ability to program DRY (Don't Repeat Yourself)

Reusable

Vue and React have the best ability to create reusable components
Vue is basically a SPA framework for non-hugh or enterprice environments.
During my research I discovered when you combine smart structure with smart architecture,
you can extend it to use it in larger and more complex web apps.

Vue next to Blazor

How web development should work tells you also why you prefer it over other JS libraries and frameworks.
Vue and Blazor mindsets are simular about that.
Vue is perfect for existing projects or for teams (who want) into Javascipt.

That is why I choose Vue next to Blazor