The secret behind Runbox 7’s speed

Runbox 7 SpeedRunbox 7 Webmail recently entered open beta, and if you haven’t tried it yet you are missing out!

When you log into Runbox 7 the first thing you’ll notice — aside from its beautiful design — is the speed.

Your folders and messages will load instantly, and no matter how many messages you have the message list will scroll without delay and without any limit.

Gone are the days of waiting for the next screen-full of messages to load, or having to click to navigate between pages. Switching between folders, sorting the message list, and moving messages — any action you perform is executed instantly.

Runbox 7 Speed from Runbox on Vimeo.

And the message search is lightning fast — results will show up immediately while you type into the search field. Combined with message threading and inline message previews, this makes email management extremely efficient with Runbox 7.

Under the hood

WebAssembly LogoWe have modified Xapian by porting Xapian to WebAssembly using the C to WebAssembly compiler from emscripten, which lets it run both in NodeJS on the server and in the browser. Our fork of Xapian will be merged into Xapian’s repository on Github so that it will become available for others to use.

Xapian logoThis is accomplished by utilizing a custom version of the open source Xapian email indexer. We have always been impressed with Xapian’s processing speed, reliability, and adaptability, and it’s ability to index large amounts of messages.

The Runbox 7 Webmail App is open source and is available in our main repo at https://github.com/runbox/runbox7. We encourage you to check out our code base, and invite you to join the Runbox revolution by getting involved in our growing community at https://community.runbox.com!

A separate repo at https://github.com/runbox/runbox-searchindex generates the xapian.wasm module in WebAssembly in C++.

The Xapian database is stored in the browser using IndexedDB, which is available through the IDBFS file system of emscripten.

Combined with a central message database and the use of websockets, this allows the indices to stay in sync when new email arrives on the server and when changes are made locally.

The user interface

The power of the WebAssembly Xapian port is matched by the message listing which is written in HTML5 Canvas. This makes it possible to handle large tables and quick re-rendering, and provides good control of the rendering process.

Ordinary HTML tables would suffer slowdown penalties on sorting, filtering, and resizing, and would require pagination, and would not be efficient enough for our needs.

The Canvas element is wrapped in a  user interface written in HTML/Typescript using Angular 2+, and is built using UI elements from https://material.angular.io/.

Mail parsing is done using the HTML parser from Andris Reinmann which is written for NodeJS and can be found here: https://github.com/andris9/mailparser.

print

Leave a Reply

Your email address will not be published. Required fields are marked *