Yesterday I attended Aaron Rankin's Geekfest talk, "Cloud-backed localStorage."

Aaron is the CTO and co-founder of SproutSocial, a social media management platform for businesses. He told us about some of the issues he encountered while rapidly scaling the tech team and how he used "cloud-backed localStorage" to make development faster.

When SproutSocial first got started, Aaron told us, all the developers were full-stack. There was one single codebase.

After 1.5 years, the system had grown quite complicated, and the tech team needed to split and specialize. SproutSocial divided the team into "front-end" and "back-end" devs. The front-end developers, experts in usability and design, focused on the user experience and user-facing features. The back-end developers, meanwhile, tackled performance and scaling issues.

With the new specializations, though, a bottleneck formed. If a front-end dev wanted to create a new user-facing feature that needed to track some information about a user's choice, he would need to submit a request with the back-end team to add a field to the database and set the field at the appropriate time. This process, Aaron told us, seriously delayed the implementation of new features.

For example, here are some front-end features that would require data persistence:

1. Dashboard has advertisements for new features that the user can choose to hide. Need to track which users have hid which features.
2. SproutSocial wants to promote its mobile app to each user once; it therefore needs to track which users saw the mobile-app promotion.
3. Tracking the user's inbox config preferences.
4. Storing which sub-view the user saw last.

Rather than creating many database schemas with sets of CRUD code and read/write APIs for every minor front-end feature, SproutSocial wanted a single consistent mechanism.

Ideally, they wanted front-end developers to be able to program all their features with JavaScript only—thereby reducing the need to context switch.

So SproutSocial set up a system so that the front-end team could implement key-value storage right in JavaScript and have the data stored server-side.

Using a JavaScript library that mimics HTML5 localStorage but stores the data server-side, front-end devs are able to implement new key-value stores using only JavaScript.

Here is a rough overview of how it works:

1. Front-end developers can set and get key values via JavaScript.
2. JavaScript makes Ajax calls which send the data to the server.
3. The server stores the key/value pairs in a giant MySql table.

As a result, the front-end team is far more efficient; they can live only in JavaScript without having to worry about PHP/MySql/performance and without having to involve back-end developers in every minor feature.

"It let us divide our team at a critical time when we needed to divide our team."—Aaron Rankin, CTO of SproutSocial

I asked Aaron how his team did reporting on the massive MySql table. He told me they don't. They have a separate system for reporting on which users did what. They use transparent 1x1 tracking pixels to track which users are doing what, and then they have a Node.js service that sends the tracking pixel data to the server and stores it.

The Node.js-based reporting service is called, in keeping with the plant-based theme, "Pollinator."

Here is a video of Aaron's talk:

Cloud-backed localStorage by Aaron Rankin from Groupon Engineering on Vimeo.