Modern Web Frameworks Guide For Decision Makers
Disclaimers and exclusions:
- In this article, I will primarily offer web solutions based on the client-side Single Page Application/Progressive Web Application frameworks like Angular, React or Vue.
- Some of the client-side JS libraries/frameworks can be a great solutions like backbone, ember, Aurelia, knockout, ejs, handlebars, JQuery.
- This article does not endorse one technology over another.
- WebAssemblies technology allows us to use high level languages such as C/C++, C# to create web applications. In my opinion, WebAssemblies currently is not as mature as some other web technologies, so it will not be evaluated in this article.
- This article contains my views and opinions; if you plan to use any technology, make sure you do your due diligence and research before deciding to use them in a production application. I will not be responsible for any failures.
- It is possible that the company plans to develop a mobile application using either this web technology or a different one. We will discuss the mobile applications approach in a separate article.
- There are mobile frameworks based on all the SPA frameworks so the mobile aspect is not evaluated in the comparison.
There are many articles on the web explaining the differences between modern web frameworks. They explain the history of the framework, market trends, framework performance metrics, and the code syntax. If you are interested, simply search the web or click the links below:
The above articles are absolutely thorough and well-written; however, I still feel the above articles are geared towards the web developer readers. They contain a lot of good information, but could be too overwhelming for a CIO/Architect/Manager/Lead/Consultant trying to determine which modern web framework to use for their next project. After reading articles, if you still are not sure as to which framework to choose, this next article may help.
I suggest creating a document and answering the questions below:
- What is the business value of your application?
- What are the cost savings or revenue from this effort? What is the ROI? Put a dollar figure to it per time period.
- What would be the build/modernization cost? Calculate the approximate dollar amount based on the size and complexity of the app.
- How much time can be allocated for this modernization effort? Is there a deadline?
- Is the current website working fine? Is it generating revenue that will justify the cost? Is it in maintenance mode?
- What technologies are currently being used in the company across the product suites?
- What skill sets do my current developers have?
- What skill sets can be learned or taught quickly?
- What is my development and support training budget?
- Are applications deployed on-premises or in the cloud?
- How much flexibility, support, and resistance will I have from the management and developers if I am trying to introduce a new technology? (Prepare justification!)
Think high-level plan beyond your web application:
Understand that in order to write a web application, you will need to bring dynamic data (JSON or some other format) to the browser so you have a database (either RDBMS or NoSQL) and some technology to write APIs or Micro-services. What technology do you plan to use? How do you plan to modernize the back end or the middleware? What is the timing of migration of other pieces?
Web application is not all code:
So, you are making a decision for a 50% code of your web application. Feeling better?!!
- I am a startup so react is more suitable
- I am an enterprise app so angular makes more sense
- I don’t like Angular because I had an issue when I was trying to use it 4 years ago
- Vue is light and fast
- Angular is heavy and bulky
- I heard really good things about React.js from my friend
Modern web frameworks are changing and releasing major updates quarterly, if not even more often, so it’s a good idea to reconsider all your options.
Congratulations! You have identified that you need to use a modern framework.
However, you may not be sure which one to use. As an executive or leader, you want to deliver fast with high quality while staying within a budget, all without any technical debt or maintenance. So, let’s take a moment to identify the strengths and weaknesses of the frameworks:
- All frameworks allow writing component-based web software
- All frameworks use modern toolsets and languages
- All frameworks allow deploying on any cloud platform
- All frameworks have a huge community and support system
Some of the pain points of the open source frameworks:
- Software changes too often
- Dependent libraries may not work properly as the new version released
- It can be good or bad depending on how you look at it — good if you are providing input, committing code to open source libraries, and influence it anyways. In case of issues, you may not get a timely answer or support.
- Learning curve can be high
Let’s talk specifically strengths of each framework (keep in mind that this is my opinion):
So, finally, here’s the plan I suggest:
- Involve the development team as early in your decision-making process as possible.
- Build POCs/prototypes/edge cases. See it yourself in action with all the frameworks. Test it on all the browsers. Allow plenty of time for this phase.
- Don’t rush to take out any framework out of comparison.
- Don’t focus on performance metrics in this evaluation. Rather, focus on productivity, usability of the framework, tools, and community support in case of issues.
After this final review and evaluation, you should be able to pick and choose your next platform to build a web. In either case, you cannot go wrong!!
To help decide, I have provided some examples below:
A blogging platform trying to modernize
A content management company trying to modernize software
A healthcare startup trying to figure out the framework to use for the next generation web app that is also used on the mobile platform
A finance startup trying to figure out the framework to use for the next generation web app that is also used on the mobile platform
A gaming company trying to figure out what software framework to use for browser-based gaming app
A messenger company trying to figure out a SPA framework for the next app
In the above use cases, any framework will do the job equally well. It all depends on what your team can use effectively and efficiently.
Finally, take a look at some production websites that are built with these frameworks. Not only decide on the framework but also try to take the best practices for each framework. Often, the right tools are used the wrong way.