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, React, and Vue — but let’s have a look at other frameworks as well, like Svelte, Preact, or Riot. 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 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.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 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 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 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
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 to learn more about programming, making, writing & careers🥰
Great post! I'm currently working with Svelte and totally loving it.