Svelte happens to be one of those technologies.
What is Svelte?
In April 2019, Rich Harris, the author of Svelte, announced the major release of Svelte 3. During his talk, “Rethinking Reactivity” at You Gotta Love Frontend Code Camp 2019, Rich summarized the significance of this release: “Svelte 3 moves reactivity out of the component API and into the language.” This dramatic overhaul of the framework was heavily inspired by reactive programming paradigms and introduced new features like reactive assignments, reactive stores, and reactive declarations.
Is Svelte Ready for Production?
Simple Component Model: Developers who are familiar with other component-based frameworks will find themselves at home when working with Svelte’s component model. The new reactivity features added in Svelte 3 simplify components even further. As a result, Svelte components can often be written in fewer lines of code compared to their Angular, React, or Vue equivalents.
Solid Performance Benchmarks: Svelte outclasses the competition in most performance benchmarks it’s included in. This is primarily because Svelte accounts for state update logic at compile time rather than relying on naive runtime techniques like virtual DOM diffing.
Shallow Learning Curve: Getting started with Svelte is easy. Developers can either try out the Svelte REPL in their browser or create a new project from the scaffold template by running npx degit sveltejs/template my-svelte-project. The Svelte website also includes an interactive tutorial and plenty of examples.
Immature Developer Tooling — The Svelte compiler provides some degree of linting and static analysis capabilities for developers. However, there is no DevTools equivalent for Svelte to debug applications post-compilation. Fortunately, there is an open GitHub issue to track the development of this tool for the Svelte ecosystem.
Small Selection of Third-Party Component Libraries — Developers will often pull in third-party component libraries, such as Bootstrap or Material, into their project to increase development velocity. Unfortunately, ports of these component libraries to Svelte are largely incomplete.
Doesn’t Play Well With Others — Although the Svelte compiler itself is written in TypeScript, the framework’s component API does not officially support TypeScript. This feature is a must-have for developers who have reaped the benefits of TypeScript for enhancing code quality and team scalability.
Is Svelte ready for production? Almost — but not yet.
In the next year, we might see the project take significant strides toward maturity. The Svelte community is small but growing. Svelte’s author has been transparent about the current limitations of the framework, and the community is working diligently on these areas of improvement.
Recommended Use Cases
If you are willing to accept the risks that come with adopting bleeding-edge technology, I would recommend trialing Svelte for the following use cases:
Small Single Page Applications: Consider writing a pilot application using Svelte that is large enough to begin to understand the limitations of the framework, but small enough to have an acceptable switching cost if you decide to rewrite it using another framework.
Custom Interactives or Visualizations: If you are building data-driven visualizations that need to display a large number of DOM elements, the performance gains that come from a framework with no runtime overhead will ensure that user interactions are snappy and responsive.
Web Applications Intended for Low Power Devices — Applications built with Svelte have smaller bundle sizes, which is ideal for devices with slow network connections and limited processing power.
Credera’s Product Design & Development service area is all about helping our clients deliver best-in-class digital experiences to their customers. Contact us at firstname.lastname@example.org to learn more about how we can partner with you.