During an evaluation of our core web platform at Singapore-based employee benefits start-up CXA Group, we decided to shift direction away from the aging existing architecture and rebuild the front-end from scratch. One of the challenges of the platform is to create a web application that works well across CXA Group's 12 target countries throughout Asia.
Taking into account the hard deadline we had set for delivering the project, I led an evaluation of a range of front-end JavaScript frameworks. The opportunity to make this level of change doesn't often present itself in major corporate projects so we tried to be as thorough as possible in the evaluation process.
There was a lot on the line in the decision: with the exponential growth of our business, we couldn't afford any missteps along the way. We also had to take into account the fact no one in the team had any significant experience in any of the frameworks we were looking at.
Narrowing the Field
New front-end frameworks seem to be published every day, so we conducted a meta-analysis to reduce the range of frameworks we considered. Including frameworks we had heard of, or had recommended to us, we were left with Angular 2 (heard of), Aurelia (heard of), Vue.js (recommendation) and React (recommendation).
We measured each short-listed framework against a list of key requirements to see how they ranked. Some of the requirements were based on what we knew we would need for the project while others were projecting forward to what we would like to do.
Flexibility
Our chosen framework would need to present a range of configuration options and be relatively simple to customize. Much of this seems to come down the architectural philosophies: making architectural decisions on your behalf or leaving them entirely open.
Angular 2 exists at the monolithic end of this with every choice (state server, router, handlers) made for you. The benefit of this is it's very easy to get up and running quickly, while the potential cost is modules not working how you need them to and having nowhere to go.
React, Vue, and Aurelia are at the other end of the scale, offering the ability to swap in components as required. Aurelia and Vue have a key advantage over React with configurable boilerplates in their initial setup.
Like Vue, React itself only presents a small part of what you need to build something. From there, many decisions have to be made which is certainly daunting. In the time since React's initial launch, various boilerplates (including React Boilerplate and Create React App) have been created to ease the introduction.
For our test React project, we decided to forgo any particular boilerplate and dive straight into it. We still installed a few, if only for reference code. This approach was certainly difficult but we learned a lot about each component in our React stack and felt more confident with the end result.
Vue and Aurelia won this round with their reduced learning curve and modular structures. React earned a partial credit for flexibility even though the initial setup is more notably difficult.
Offline Support
With APIs like Service Workers, the ability for web applications to function without a live or stable Internet connection has become a possibility. Within our team, we've not yet had much experience in this area and didn't dive much deeper into it other than to confirm all the frameworks evaluated offer offline support of some variety.
Light Weight
The byte-size of code sent to the client makes a big difference in browser performance, both for bandwidth and processor time. As custom code and third-party libraries are added, the byte size can only get worse making it critical to start small. CXA Group's target market extends into countries where bandwidth comes at a premium, so it is essential that we deliver as little code to our clients as we can.
In lieu of hard data reflecting production configurations, we looked at core library sizes to give at least some indication of what we would be in for. Actual production sizes are larger than shown here.
Continue reading %How to Choose the Right Front-End Framework for Your Company%
by Chris Lienert via SitePoint
No comments:
Post a Comment