Svelte introduced a radical new idea by becoming a compile-time framework, resulting in single page apps without a run-time framework. But while Svelt

Elder.js, the new kid on the block

submited by
Style Pass
2021-07-06 10:00:09

Svelte introduced a radical new idea by becoming a compile-time framework, resulting in single page apps without a run-time framework. But while Svelte apps don’t have to load a framework script (like react.js and vue.js do), they do run as client-side JavaScript code.

Elder takes this a step further by turning Svelte apps into server-side generated HTML and CSS and 0kb client-side JavaScript. This is fantastic for performance and delivering small footprint web things. With this approach Elder sets itself apart from other meta frameworks like Next.js, Nuxt.js and Sapper which only add more JS to your apps on top of the frameworks they’re built on. The concept of SPA’s with zero JS by default is slowly gaining more traction. Next.js recently added an experimental “no run-time JS” feature and other frameworks like the Preact-based Microsite are popping up.

0kb of JS is a great baseline. But eventually you’ll want to add client-side interaction and logic to your project. Elder’s solution to this is partial hydration. Which is a fancy way of saying only specific parts of the web page become interactive once client-side JS is executed. Elder has a declarative approach to partial hydration using attributes on dynamic page components for passing props and hydration options:

Leave a Comment