Get best of the week

Little-known but popular JS frameworks for the frontend

Not so long ago, when creating dynamic web applications, we used pure JavaScript or jQuery to work with the DOM. Since then, many great JavaScript frameworks and libraries have come up. They help to develop projects that, in attractiveness and convenience, surpass what they were before. The author of the article, the translation of which we are publishing today, wants to talk about several powerful, but little-known client frameworks and libraries based on JavaScript. Of course, the Big Three, represented by Angular , React and Vue , has not gone anywhere, but in the world of web development there are other tools worthy of attention. Such as Svelte , Preact and Riot



. The question of choosing the right remedy depends on many factors. Among them are the developer’s knowledge, project features, and the market situation. Therefore, let's look at little-known frameworks, thereby expanding the freedom of choice for those who are looking for the right tool for their next project.

Svelte



Svelte framework is a new representative of front-end development tools, the popularity of which is constantly growing recently. They talk about him as an example of a completely new approach to creating user interfaces. Compared to Vue or React, which rely heavily on browser capabilities to do their job, Svelte works differently. He, at the stage of building the project, involves a compilation step, which contributes to improving the performance of projects based on it.

Svelte is aimed not only at the productivity of finished projects, but also at the convenience of the developer. This is achieved by reducing the need to write large amounts of boilerplate code.

▍ Key Features


  • Impressive performance
  • Small builds
  • Availability
  • Standard Style Encapsulation System
  • Declarative transitions
  • DOM

Ember



Ember.js - This is another excellent client framework that accelerates the development of web applications, removing the burden from the developer to perform repetitive standard actions. It allows programmers to work with advanced JavaScript features.

This framework has a wonderful command line tool that speeds up the task of assembling projects, their testing, supporting a convenient development environment with features such as automatic page reloading. Ember also has an excellent router, whose ideas inspired developers of other similar systems, for example, the React router. The framework is very productive due to the fact that it uses technologies that accelerate page rendering.

Ember add-ons provide the developer with many plugins that allow you to expand the capabilities of applications. The Ember Concurrency system, for example, can be used to write reliable asynchronous code. And Simple Auth is an addon that implements many authentication methods. The Ember CLI Deploy tool allows you to implement supported deployment logic that can be reused.

▍ Key Features


  • Standard project assembly pipeline
  • The best routing system among similar tools
  • Advanced Data Tools
  • Full scale testing system
  • Six week release cycle

Preact



The Preact library, as its name suggests, is very similar to React. True, the Preact library is much smaller, its size is only 3 KB. But this library gives the developer the same modern API as React. Preact provides the programmer with the most compact implementation of virtual DOM abstraction, stable platform capabilities, and event processing tools. This library, without a step of transpilation, can be used directly in the browser.

Preact, in addition, is one of the fastest client libraries, characterized by modest size and high performance.

▍ Key Features


  • Support for ES6 classes, hooks, and functional components
  • Support for JSX, virtual DOM, developer tools
  • Standard server rendering support
  • Support for modern browsers (IE11 +)

Riot



Riot is a simple and elegant component-based user interface development library. It allows you to use custom elements in all modern browsers without the need for polyfills. These components help combine HTML and JavaScript to form entities suitable for reuse. The Riot syntax is clean and designed to be easily understood by the developer.

The size of Riot is only 6 KB, that is, we are talking about a very compact library. This library supports fewer API methods than its larger counterparts. This suggests that for the productive use of Riot, the programmer needs to spend not much time on training.

▍ Key Features


  • High performance and predictability
  • Proximity to Web Standards
  • Good relationship with development tools
  • Nice syntax
  • High learning speed
  • Modest size
  • Powerful modular ecosystem

Aurelia



Aurelia is a modern client-side JavaScript framework for developing web applications, mobile and desktop projects. Applications using Aurelia are created by assembling simple components based on pure JavaScript or TypeScript and the corresponding HTML code.

The Aurelia framework has excellent documentation, its capabilities are well described in the tutorials. All this helps those who want to deal with this framework and quickly master it. Aurelia includes a powerful jet engine for implementing bindings, a templating system, a router, and plugins. Aurelia supports server rendering and other advanced features.

▍


  • , ,

Mithril



Mithril.js is a modern client-side JS framework designed for developing single-page web applications. It is small in size (9.79 Kb), supports routing and XHR.

It is used by companies such as Nike and Vimeo. Among the technologies he supports are JSX, ES6 +, animation, testing.

Good documentation has been prepared for this framework, helping beginners quickly figure it out. There you can find examples on which it is convenient to learn the capabilities of Mithril. True, it should be noted that in my opinion this framework, in terms of documentation, lags behind the other tools that we examined here.

▍ Key Features


  • Very high performance
  • Virtual DOM Support
  • Component Lifecycle Support

Summary


I hope this material illustrates well the fact that life is beyond Angular, Vue, and React. Some projects require approaches and tools that are different from those that everyone is hearing. The choice of a suitable tool greatly depends on the features of the project that you plan to create with it.

In the end, I want to say that if you choose one of the frameworks included in the "Big Three" for your project, then you certainly will not be mistaken. Angular is great for developing large-scale projects. Angular frontends are often used in conjunction with Java backends. React and Vue are also good options. I want to give advice: do not become fans of any framework or library. When choosing a tool, just try to approach the selection process with an open mind and find something that meets the needs of your project.

Dear readers! Do you use any frameworks or libraries that are not included in the Big Three?

More articles:


All Articles