19518 Views | 9 Min Read
Framework or Libraries
Often termed as a universal framework, they have changed the way everything is done. The main motivation behind the framework was to optimize the website loading time and streamline JS bundles. This was also the main reason behind its popularity.
When the concept of isomorphic library came into existence, developers started using these libraries. The Isomorphic framework breaks the barrier between server and client-side. It allows developers to use components of the framework on both ends. Because of this the JS bundle also gets a little sleeker as instead of having two frameworks, the solution now share one.
They provide you with a predefined environment and let you code.
The declarative view makes the coding predictable hence the code becomes easy to debug. Using React will push you to make your own framework. Pairing it with Next.js will smoothen things on the server side and all the heavy lifting will be done on the back-end.
React stack usually includes Redux, React.route, React.saga and Node.js.
Myntra to exploits react although they only use parts of it because such a website has minimal interaction between sibling components. React has a high rendering performance when there is a complicated component change with frequent UI changes. They prefer preact because it’s smaller and provides them greater speed. eBay on the other hand spice things up by adding Angular and Ember along with the preact library. That seems to be the trend in modern e-commerce websites.
Npm is a trustworthy package manager. Earlier npm had too many issues as the packages were scattered, Yarn was introduced as directory for npm. It is a godsend for developers, npm has vast community support and npm too has become faster and almost equal to yarn in terms of package management. React and Redux come handy while handling the packages.
Angular is more of a framework rather than library because it tells you how your code must be written. Build tools in angular are complex to understand too. Almost everyone agrees that Angular is bloated as its size is about 150 kb gzipped. Unlike the virtual DOM of React and Vue they have fully fledged DOM that makes it hectic and bloated. Virtual DOM is a new concept that has just started gaining ground but it is fast as now only changes have to be pushed.
Apart from this the syntax and libraries require due research and discipline in Angular.
Vue is simply the best of both worlds, meaning it lies somewhere between the dictatorship of Angular and democratic chaos of React. This young JS framework has gained some serious popularity without having been associated or backed by any giant. The framework is used by Alibaba, Nintendo and Gitlab. A team of 16 people made Vue into a very simple yet efficient JS framework.
Vue makes use of the latest tech trends and inculcates within it without complicating the whole project. Combining Vue 2.0 with server side rendering (SSR), Vuex and a GraphQL client like Apollo that you end up with super light, fast and robust application while providing a great user and developer experience too.
Google introduced polymer to empower the developers to fully take advantage of the latest web technologies. Youtube has renovated it gaming stream using Polymer, it is indeed very fast. The most notable feature in Polymer is the ability to reuse custom elements to interoperate with a browser’s built-in elements. Polymer.dom was released with an intent to enable the developers of the DOM manipulation which paved the way for new libraries and frameworks to be used with it.
Version 2 of Polymer also include data system improvements resulting in easier debugging and making it easier for the data flow between elements. If you deal with array handling a lot then polymer is quite a magician. Polymer version 3 soon to be out has left bower and moved to npm for version management.
Polymer App Toolbox helps you build and deliver cutting-edge Progressive Web Apps with minimal overhead and payload, by leveraging powerful web platform features like Web Components, Service Worker and HTTP/2.
The Toolbox provides a component-based architecture, responsive layouts, a modular router, localization support, turnkey support for local storage and offline caching, and efficient delivery of unbundled app resources. Adopt these features individually, or use them together to build a full-featured Progressive Web App.
Most of the people are afraid of using React mainly because of its size and performance. Preact was introduced mainly due to the following reasons, and it is amazing how easily you can swap your react with the preact counterparts. Preact is known to have quite a reputation in enhancing the performance of mobile web applications. Changing React & React DOM with Preact-compat paired with Webpack and boom all your worries go out of the window.
Using preact will reduce your main app bundle by at least one third (may vary depending on app), the only catch being that testing gets complicated. The alternative to this maybe using react for development and preact for production. Enzyme which is used in react is preact-compat integrable. Lyft and Uber used preact and it improved the performance because it is simply faster and smaller. Like react it also has virtual DOM that acts as a reagent enhancing its speed.
Maturity in JS is accepting the fact that there is no ‘best’ overall framework or library. In the end it boils down to what your project requires, and it is always advisable to use more than one library. For instance React components can be used to limit along with Vue quite a lot of times.
If you have a big team then Angular provides an extra edge because of its fixed procedures and syntax. Both Angular and Vue are great if you love using templates. If server-side rendering is the objective then both React and Vue have potential to solve your problems, same will be the case if you are using it for startups.
Personally, though I favor Vue out of all three. With Vue you have functioning frameworks enough for you to start scripting, no additional libraries need to be connected. Most companies are switching from Angular to Vue just to bridge the gap between senior and junior developers because it is easy to learn. The only problem with Vue is that its very young and community needs to adopt it in order for us to realize its full potential. The polymer is futuristic, for now not a lot of developers are using it. After some time time, it will be mainstream and its support and community will flourish.
Written by Robin Jangu
9740 Views | 12 Min Min Read
19463 Views | 13 Min Min Read
22900 Views | 20 Min Min Read
33326 Views | 14 Min Min Read