ERA is using ElectronJS

Posted on 07/05/2022

When we started developing ERA, the first MVP was a web application. During that time, we realized that a desktop app would integrate itself better into our daily workflow.

So, we began to search the market for suitable technology.

What are the problems creating desktop apps

There are two big problems that many people who want to develop a desktop application are going to face:

Cross-platform compatibility

Making a cross-platform desktop app is challenging because every operating system has its own API and supports its own preferred toolchain.

If you are developing an app for Windows, you are probably going to use C# alongside WPF for the GUI part. For macOS, it's likely going to be Swift or Objective-C (although that is not common anymore). Now in order to avoid to write everything twice, a common approach is to move code that can be used platform independently into a shared library, while the actual GUI will be written on each platform with their native technology.

This approach, however, is going to cost a lot of time and effort, especially if you are a single developer or a small team. You have to become familiar with each programming language, framework, debugger, build system, etc.

Ideally, you can use a technology stack that is not glued to one Operating System. For example, you could use Python alongside TKinter or C++ with QT in order to have one development environment that allows you to deploy your app to different target operating systems.

Creating the actual user interface, with a good look & feel

The next big challenge is going to be the creation of the actual GUI. You are left with two options here:

  • Use the OS native technology
  • Use a GUI Framework

Using the OS native technology brings you to the cross-platform compatibility issue mentioned above. So that option falls out flat.

So you have to use a third-party GUI framework. Now as I said above, there are a few options. You can use Python with Tkinter, C++ with QT, etc.

The problem you might have, however, is going to be designing a good-looking interface. Let's be honest here: The majority of GUI frameworks, being native or non-native look absolutely terrible. In some cases like QT, it is possible to get a modern look, but that requires a lot of effort that a small team might not be able to provide.

Why we choose ElectronJS

When evaluating what the best tech stack for ERA is, in late 2020 these were our preferred candidates:

  • C++ with dearImgui*
  • C++ with QT
  • Java with JavaFX
  • Webview based Framework (ElectronJS, Sciter, CEF)

After a short evaluation period, we decided that a web view-based framework will be the best technology for our product. And here the decision fell in favor of ElectronJS.

Although we are very aware of the disadvantages that ElectronJS has (shipping chromium with your app, having large binaries) the advantages were impressive:

  • Lots of documentation
  • Easy and straightforward licensing
  • Simple build system
  • The ability to create a beautiful user interface with the help of web technologies
  • The Node ecosystem

So we made the decision to use ElectronJS. As for now, we are happy with that decision, although we don’t want to rule out the possibility that in the future we might reconsider this choice for ERA.

*We are still very impressed with what dearImgui offers. Cross-platform compatibility, static linking, and because of its immediate mode architecture the ability to create beautiful looking, custom UIs.