Svelte is a compiler that is used to make lightweight SPA (single page applications), much like the ones you create with react, vue or angular. However svelte is quite different from them, and comes with some awesome features that makes working with svelte worthwhile. Sapper is a an application development framework that builds on top of svelte components, it is quite similar to Next.js for react and Next.js is actually one of the inspiration for the sapper framework. Svelete and Sapper are new to the scene so they are not too popular among developers, although this should not deter you, let's discuss three reasons why you should be using svelte and sapper for your work.
- Svelte is a compiler and not a framework, unlike your regular frontend framework like angular, react, vue, svelte is a compiler, this implies that svelte will compile your code down into a JavaScript implementation without shipping the svelte library along with it! This makes for faster and more graceful apps, generally the other frameworks ships your code along with the core-library of the framework deployed with it and this adds to our final build size and makes our file quite big, slowing down load times. However svelte negates this by compiling our code into JavaScript that the browser can understand. svelte components are also smaller in code length compared to vue/react.
- Svelte is also easy to learn, much easier than react, or vue. The syntax is clean and easy to use/ remember. It also allows us to use async/await in template rendering and i think that is so cool, you should try it out. Sapper is also easy to learn and use as much as svelte, in little to no time you should have a basic idea of how to build a simple sapper app, and with a few days of lessons and practice, you could be making high performant apps with svelte and sapper.
- Sapper is flexible and you can use it with either express or polka for your server while you can clone the webpack template repo or the rollup template, depending on which you are comfortable working with. Sapper apps are also easy to deploy too. It took me a few clicks to deploy a dummy website i built with sapper and svelte and it was done, hosted without a stress. Sapper allows us to export static websites to platforms like a mentioned above simply and easily with just one command. We can preload the data a page uses before it's loaded. Routing is gracefully handled and you can easily implement some of the route gaurds that angular provides without having to write as much code too, just simple logic.
I hope this three reasons will definitely help make you decide to start learning the above technology, on my next post i will do an introduction on how to use sapper, so stay tuned for that.