# Sapper: Towards the ideal web app framework

DevFeed: [Sapper: Towards the ideal web app framework](<https://devfeed.tech/articles/sapper-towards-the-ideal-web-app-framework-3034.md>)

Original publisher: [Read original article](<https://svelte.dev/blog/sapper-towards-the-ideal-web-app-framework>)

Author: Rich Harris

Published: 2017-12-31T00:00:00Z

Content type: opinion

Language: en

Sources: [Svelte blog](<https://devfeed.tech/sources/svelte-blog.md>)

Topics: [web applications](<https://devfeed.tech/topics/web-applications.md>), [Node.js](<https://devfeed.tech/topics/node-js.md>), [modern web development](<https://devfeed.tech/topics/modern-web-development.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>), [interactive web experiences](<https://devfeed.tech/topics/interactive-web-experiences.md>)

Tags: [app](<https://devfeed.tech/tags/app.md>), [css](<https://devfeed.tech/tags/css.md>), [developer-experience](<https://devfeed.tech/tags/developer-experience.md>), [framework](<https://devfeed.tech/tags/framework.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [next-js](<https://devfeed.tech/tags/next-js.md>), [node-js](<https://devfeed.tech/tags/node-js.md>), [offline](<https://devfeed.tech/tags/offline.md>), [performance](<https://devfeed.tech/tags/performance.md>), [react](<https://devfeed.tech/tags/react.md>)

## AI overview

The article outlines qualities of an ideal Node.js web application framework, including server-side rendering, hydration, route-level code splitting, offline support, performance, and developer experience. It presents Next.js as close to that ideal while noting limitations.

## Source excerpt

Quickstart for the impatient: the Sapper docs, and the starter template If you had to list the characteristics of the perfect Node.js web application framework, you'd probably come up with something like this: It should do server-side rendering, for fast initial loads and no caveats around SEO As a corollary, your app's codebase should be universal -- write once for server and client The client-side app should hydrate the server-rendered HTML, attaching event listeners (and so on) to existing elements rather than re-rendering them Navigating to subsequent pages should be instantaneous Offline, and other Progressive Web App characteristics, must be supported out of the box Only the JavaScript and CSS required for the first page should load initially. That means the framework should do automatic code-splitting at the route level, and support dynamic import(...) for more granular manual control No compromise on performance First-rate developer experience, with hot module reloading and all the trimmings The resulting codebase should be easy to grok and maintain It should be possible to understand and customise every aspect of the system -- no webpack configs locked up in the framework, and as little hidden 'plumbing' as possible Learning the entire framework in under an hour should be easy, and not just for experienced developers Next.js is close to this ideal. If you haven't encountered it yet, I strongly recommend going through the tutorials at learnnextjs.com. Next introduced a brilliant idea: all the pages of your app are files in a your-project/pages directory, and each of those files is just a React component. Everything else flows from that breakthrough design decision. Finding the code responsible for a given page is easy, because you can just look at the filesystem rather than playing 'guess the component name'. Project structure bikeshedding is a thing of the past. And the combination of SSR (server-side rendering) and code-splitting -- something the React Router