Is svelte.js the user-friendly developer framework?19 Dec 2019
Additional improvements in speed and reliability can be gained through svelte’s use of templated component markup. This transparently supports Progressive Enhancement (PE) of base coding with HTML with CSS which the browser processes with generally “fail safe” results. The developer enhances this base with additional features, usually with more fragile JavaSript behaviours according to if they are supported by the user’s device.
In other words, svelte supports modern component UI design patterns but with a compiler reducing runtime the loading / processing times seen by users. Its also also allows developers to take direct advantage of the web platform’s strengths without requiring extra framework abstractions (such as React hooks) to be learnt. Of course, abstractions are possible but they can be added at the discretion of the developer, hopefully after a good cost/benefit tradeoff analysis from the user perspective. Svelte does have a preprocessor hook to allow extensions such as CSS tooling but I sense that keeping close to the platform is encouraged.
One concern that might come to mind when considering the use of a compiler is the ease of debugging the output code. In actual fact, I found this to be a non problem. The code is clean and consistent using a few light abstractions that you might well develop yourself when working directly with the DOM. Even the component scope CSS is easy to work with with modern browser tooling, plus you can use global CSS as well.
Svelte is experiencing something of a major surge in interest right now and this is perfectly understandable given version 3.0 bringing together various excellent ideas, hitting a sweet spot for both DX and UK. Personally having been a heavy user of Macro Assemblers, the make tool with scripts and the awesomeness of generics using the C++ processor I fully appreciate the approach of removing work from run time in order to improve both DX and UX.
One final impressive “feature” of svelte well worth mentioning is the excellent learning resources provided by svelte’s developer Richard Harris. There’s a REPL and the tutorial provide an interactive place to explore which once completed leaves you with a solid understanding of svelte.
I explored much of svelte by developing an inclusive random number “spinner” app as a fairly non-trivial sample. This might be useful as an example, in addition to the many other resources linked to from the svelte website. Svelte has a related project, sapper, which adds features required in a SPA and server side rendering with hydration of the frontend.
Recently, Jason Lengstorf learnt svelte with Richard Harris a process that’s fun and informative to watch.