Tag: preact

Introducing Second: a framework for mostly-static React applications

TL;DR

• Second is a framework for building React applications where the data is fetched on the server and most of the components do not change after the first render.
• Components can declare their data dependencies using a container similar to Facebook’s Relay.
• By default components are only rendered on the server; client-side rendering is opt-in by using the component dehydrator.
• Second works with any React-like library including Preact.

Why build this framework?

While using React to build the BBC News front page and several other mostly-static pages, a common theme emerged: only a small number of components on these pages require client-side JavaScript to function. Rendering every component in the browser does not provide an optimal experience — especially for users on low-powered devices or low-speed connections. Instead, selectively bundling components for the browser reduces bundle sizes and minimizes CPU overhead without sacrificing React’s event system and stateful components.

Second is not a large or complex framework. It is the result of combining several simple and well-tested techniques—

• Server-side rendering
• Container components for declarative data requirements
• Selective client-side rendering

—and combining them into a single package that can be easily reused across multiple applications.

Web development technologies to adopt in 2017

I started 2016 feeling quite overwhelmed by the sheer number of new technologies that were being introduced. This year I feel like many of those technologies have matured, so I have collated a list of the ones that I think deserve your attention. My focus for the last couple of years has been on performance, so I’ve made an effort to ensure that all of the technologies mentioned are either “performance-friendly” or are directly related to performance.