React, etc. Tech Stack

React, Flux, GraphQL, Hack, HHVM...? All of this and more!

Compiling JavaScript frameworks is the trend for 2018

Going into 2018 is as exciting as ever for the web development community. One area that is constantly in flux is the front end framework space. The recent trend is compiling JavaScript frameworks, that are compiled instead of shipping the framework to the client.

JavaScript is now universal - many developers are used to executing the same JavaScript code on both the client and the server. On the server a framework does not hurt performance as it can be optimised with JIT with subsequent page loads. For the front end the client both the initial boot up and sending the runtime over the wire are worthy considerations.

A trailblazer has been the Svelte project, which launced in November 2016 - the framework compiles completely at build time and does not send a runtime to the client. It is similar in essence to Web Components, except it leverages JavaScript instead of native components. However the JavaScript is all application code and no boilerplate library like with Angular, React or Vue.

On January 2nd 2018 Rich Harris, the lead developer of the Svelte project revealed his latest effort, Sapper. This is a complete universal framework that is inspired by Next.js, a universal React.js framework. Sapper itself is a brilliant effort, but the real promise lies in using the same concepts across platforms as Rich describes in his introductory blog post:

A framework like Sapper could conceivably determine which compilation mode to use based on the characteristics of your app. It could even serve JavaScript for the initial route for the fastest possible startup time, then lazily serve a bytecode interpreter for subsequent routes, resulting in the optimal combination of startup size and total app size.
Sapper: Towards the ideal web app framework

With Web Assembly now positioned to be a staple browser technology alongside Web Components, many frameworks are now eyeing compilation. From fresh endeavours like Stencil to established JavaScript frameworks like Ember all players are keeping an eye on these - and are in part already enjoying compilation benefits of TypeScript. Even the venerable React.js project is looking into compilation with Prepack.

Written by Jorgé on Tuesday January 2, 2018

Permalink - Tags: javascript, react, svelte

« Satchel is Microsoft's state management library for React - React.js and Prepack »