The Stack

Front-end UI

Unlike a lot of products, our stack does not React, Angular, VUE, or other similar frameworks. As performance is a concern, we aim to work directly with the DOM. We keep a model/view separation, putting state/logic in model classes and UI-management in view classes.

Our UI stack uses the following:

This helps us organize into models and views, with support for event management, lifecycle management, attribute storage, and data processing. This fits well with the way we choose to structure the front-end code.

A collection of JavaScript utilities. This is required by Backbone, and used in much of our more legacy code.

Heavily used to query and manage the DOM. While often considered legacy (as browsers are more similar than different nowadays), it still has a lot of nice shortcuts for things compared to the vanilla JS syntax.

Target Language

Review Board 3 through 6 supports ES6 JavaScript (transpiled using Babel — see below). ES6 JavaScript files all end with .es6.js.

In Review Board 6 and up, all new code is written as TypeScript. This gives us a mix of type safety and modern JavaScript functionality, helping us to better write and document our code.

Building/Compilation

Compilation is initiated on the Django side, either when viewing a page in development mode or when building a Review Board package.

We use the following tools: