The new Caption

How we built an Electron app that got 500.000+ downloads.

3 min readDec 12, 2017

Back in February, we shipped Caption; the easiest way to find and download subtitles on your Mac. On release, Caption garnered quite some attention and got featured on Product Hunt, Github, Designer News, Reddit and The Next Web. A lot has happened since then. Caption has been downloaded over 175.000 times and every weekend about 9.000 people all over the world use it to download subtitles. We’ve also been able to gather a lot of feedback from our users. As it turns out, most requests were about adding support for Windows and Linux.

Well… we’ve listened to our users. Several months ago, we started from scratch and rebuilt the app from the ground up. We’ve added a more sophisticated search algorithm, we’ve made a separate Node.js package for the core logic, and… we’ve made Caption available on every platform. Now, after insane amounts of coffee, many sleepless nights, and hundreds of Git commits, we’re finally ready to ship the new Caption, and let you just start watching… on MacOS, Windows, and Linux!

Technology

Electron

Caption is built entirely using web technology. We decided to use electron-next for its simplicity. This allowed us to remove a lot of Webpack configuration files, since Next.js already takes care of this.

The result was amazing. Caption is now fully loaded within 200ms, which is ~500% faster compared to Caption V1.

Redux

While we added more and more features to Caption, we realized our application state was getting too complex. Our entire state was managed from our main <App /> component, which was responsible for updating its child components and took care of the communication with Electron’s main process. We decided it was time to introduce Redux.

Redux allowed us to separate our application state from our view logic. Our view is now able to dispatch certain actions, with Redux handling our application state updates. The components which are responsible for displaying data which is in the app state will then be updated accordingly.

Abstracting our core functionality

While Caption V2 is the perfect solution to download subtitles using an interface, some developers requested a separate Node.js package which would allow them to use the core logic (searching + downloading from multiple sources) within their own projects.

We decided to abstract this core logic into a separate package: caption-core. This will make it easier for other developers to add new sources or update existing ones. By introducing a simple but powerful API, all other modules relying on Caption’s core will be able to upgrade smoothly.

Open-source

We love open-source because we believe that everyone should be able to improve on products or use existing tools to build their own products. That’s why we’ve made Caption freely available and entirely open-source.

We’d like to thank Rick Wong, Huub Gelissen, Open Subtitles, addic7ed and everyone who helped build Electron. We wouldn’t have been able to ship Caption without your help!

What’s next

We’re really excited with the result of Caption V2, but this is still just the beginning. We’re continuously adding more sources to our core module. The next big release will be Caption CLI, which will allow you to find the right subtitle, straight from your terminal. Coming soon.