Lesser-Known Yet Still Popular JavaScript Frameworks for Front-End Developers
Tags: javascript, webdev, beginners
Published: 2021-01-21 14:25:31

Not long ago, we used Vanilla JavaScript or jQuery to manipulate the DOM in order to create dynamic web applications. Since then, a lot of very good JavaScript frameworks/libraries have emerged helping us to create even more stunning, user-centric applications.

In this article, I’m going to show you some powerful but less-known client-side frameworks and libraries for JavaScript. Of course, there are the big three — [Angular](https://angular.io/), [React](https://reactjs.org/), and [Vue](https://vuejs.org/) — but let’s have a look at other frameworks as well, like [Svelte](https://svelte.dev/), [Preact](https://preactjs.com/), or [Riot](https://riot.js.org/). Which framework to choose depends on factors like developer skills, project situation, industry demand, and others. So check out these frameworks, and decide for yourself.

---

## Svelte
![svelte](//images.ctfassets.net/28643bqnqgzl/5Ig3sdQbcCvtwkkVGjNZda/3ab3abe67a5c4c9b406a331c9ce0014b/lkyp1.png)
Svelte is the new kid on the block that constantly gains in popularity among web developers. It’s described as a radical new approach for building user interfaces. Compared to Vue or React, which both rely heavily on the browser to do their work, Svelte uses a compile step during build time, allowing for better performance.

Svelte aims to deliver an outstanding developer experience by reducing the need for writing extensive boilerplate code.

__Key features__
- Outstanding performance
- Small bundles
- Accessibility
- Built-in style encapsulation
- Declarative transitions
- No virtual DOM
- Less boilerplate code needed
- Truly reactive

---

## Ember
![ember](//images.ctfassets.net/28643bqnqgzl/V6ieK7h7mP0H5mPQ6EDEh/3ba029940b18a14fa8cfcdbaab68d15d/lkyp2.png)
Ember.js is another great client-side framework that makes building web applications pretty fast by trying to take all the repetitive, common tasks away from the developer. It provides access to modern JavaScript features.
It comes with a great CLI tool for fast rebuilds, auto-reload, and a test runner. Ember also has a great router that has been the inspiration for other routers, like React Router. The framework is very performant due to its fast rendering technologies.

Ember addons give you plenty of plugins to enhance your applications. Ember Concurrency, for example, can be used for efficient state management. Ember Simple Auth is an addon supporting all kinds of authentication, and Ember CLI Deploy keeps your deploy logic maintainable and reusable.

__Key features__
- Build pipeline out of the box
- Best-in-class routing
- Extensive data layer
- Fully-featured testing capabilities
- Six-week release cycle

---

## Preact
![preact](//images.ctfassets.net/28643bqnqgzl/4Tjvawboahf0ZxuQUjJioW/7829c737001fbf5c618029308b4d7ce3/lkyp3.png)
Preact is, as the name already suggests, quite similar to React, but the library is much smaller, only 3Kb. Yet it has the same modern API as React. It provides the thinnest possible virtual DOM abstraction, stable platform features, real event handlers, and can directly be used in the browser without transpilation.
It’s also one of the fastest client-side frameworks available, lightweight, and highly performant.

__Key features__
- ES6 classes, hooks, and functional components
- JSX, VDOM, DevTools, SSR
- Ready for server-side rendering
- Modern browser support (IE11+)

---

## Riot
![riot](//images.ctfassets.net/28643bqnqgzl/7zTuzyQAwQCggva8jmFvSV/3eda1a3bdb1d66329d2cb48f5e6b482d/lkyp4.png)
Riot is a simple and elegant component-based UI library. It brings custom elements to all modern browsers without the need for polyfills. Those components glue HTML and JavaScript together, forming reusable components. The syntax is clear and aims to be easily readable by humans.

At only 6Kb, this library is pretty small. It comes with fewer API methods than the bigger frameworks — which means there’s less to learn to be productive.

__Key features__
- Performant and predictable
- Close to standards
- Tooling-friendly
- Enjoyable syntax
- Small learning curve
- Tiny size
- Powerful, modular ecosystem

---

## Aurelia
![aurelia](//images.ctfassets.net/28643bqnqgzl/1pEccIZ2NQxLG2QOfaiagr/11fe2818e0ff5c0bea2d1bff02ea496e/lkyp5.png)
Aurelia is a modern client-side JavaScript framework for building web, mobile, and desktop applications. Applications are built by composing simple components, each made of vanilla JavaScript or Typescript with the corresponding HTML.
Aurelia has great documentation and tutorials to help getting started. It comes with a powerful, reactive binding engine, a templating engine, routing capabilities, plugins, support for server-side rendering, and more.

__Key features__
- Easy to learn
- High performance
- Reactive binding
- Simple testing
- Extensive ecosystem
- Unmatched extensibility
- Routing, composition, and progressive enhancement

---

## Mithril
![mythril](//images.ctfassets.net/28643bqnqgzl/uWxMnz2ID77AeWiudWz1i/c6cd53100d0f1175d5d6c5cb9171da16/lkyp6.png)
Mithril.js is a modern client-side JavaScript framework developed for creating single-page applications. It comes with a small bundle size (9,79Kb) and provides routing and XHR utilities.

It’s used by companies like Nike and Vimeo and supports things like JSX, ES6+, animation, testing, and more.

It has good documentation to get started — with many co-dependencies and examples to try things out. However, I find it to be slightly behind the other mentioned libraries in terms of docs.

__Key features__
- Very performant
- Supports virtual DOM
- Lifecycle methods

---

## Conclusion
I hope you understand there’s more out there than Angular, Vue, and React. Some use cases require different approaches and frameworks. It highly depends on the situation and project.
In the end, you won’t make a mistake by going with one of the big three frameworks. Angular is a valid choice for large enterprise applications and is often paired with Java for full-stack development. React and Vue are also good choices. My advice: Don’t be a fanboy/fangirl/fan person. Try to choose a framework that fits your situation and the project you want to work on. Be open-minded!

**If you like what I write and want to support me and my work, please follow me on [Twitter](https://twitter.com/simonholdorf) to learn more about programming, making, writing & careers🥰**