pevd

An evolving tutorial on how to mix server-side rendering with client-side rendering. AKA, how does Progressive Enhancement work in real-world, when you have the power of Virtual DOM?

(WIP, forever)

Motivation

While there are many tutorials providing great introduction to concepts of Progressive Enhancement (PE) and Virtual DOM (VDOM), we find the lack of directions on how to implement them in real-world scenario worrying: many developers simply fallback to choosing just one of them, because doing both is difficult, time-consuming, doesn't fit minimum viable product mentality, etc.

So we end up seeing this split:

• Either it's a Single Page Application (SPA) with no PE whatsoever
• Or it's a Responsive Website (RWD) not using VDOM approach

In short, we believe Isomorphic Javascript (ISOJS) isn't enough, code sharing between frontend and backend is nice, but it should not be the only feature. What we (and our users) truly want, are user-friendly, network-tolerant, device-agnostic services.

To us, it means answering difficult design decisions blocking PE and VDOM's adoption.

Hence pevd is born.

Disclaimer

We don't claim to have figured out the best approach for building a progressively-enhanced virtual-dom-powered website, nor do we think PE and VDOM are the ultimate combo for build web applications.

Quite frankly, we haven't faced all those problems you might run into someday, not to mention technology X may come along and change the whole development landscape.

Hence we label this an evolving tutorial: we aim to expand upon our basic example, share our tried approaches, as we develop our own services at MaiHQ using PE and VDOM.

To play

1. git clone
2. npm install
3. npm start

FAQ

See our wiki for various design decisions we are making.

License

MIT