Title: Trying Electron for packaging web apps
Slug: trying-electron-for-packaging-web-apps
Date: 2022-08-05 17:40:00
Author: Kartones
Lang: en
Tags: Development, Tools, Javascript
og_image:
Description: First steps in using Electron to package a simple web app for Windows.


I know that [Electron](https://www.electronjs.org) is quite famous to package web applications into native binaries, but I hadn't decided when to use it. So after reading that version 20 had just been released, I checked [the tutorial](https://www.electronjs.org/docs/latest/tutorial/tutorial-prerequisites) and it looked insanely easy and quick to get a simple page transformed, so I decided to give it a go.

The tutorial guides you quite well and step by step, both in building a hello world web inside Electron, and then adding Electron Forge to build the binaries. I picked up my [pomodoro web app](https://github.com/Kartones/pomodoro) and excepting a single issue regarding the favicon, it gave me no errors. Even the notifications worked out of the box!

But being a bit stubborn myself, I wanted to generate both Linux and Windows from the same Linux host, and despite what the [Electron Forge Makers doc said](https://www.electronforge.io/config/makers), I wasn't able to compile Windows binaries. Having installed the pre-requisites both `mono` and `wine` (and available from my `$PATH`), it didn't worked with Squirrel nor with WiX. It would only compile the Linux `deb` installer.

This is my makers config (almost the same as the tutorial's):

```
"makers": [
  {
    "name": "@electron-forge/maker-squirrel",
    "config": {
      "name": "pomodoro"
    }
  },
  {
    "name": "@electron-forge/maker-deb",
    "config": {}
  },
  {
    "name": "@electron-forge/maker-wix",
    "config": {
      "language": 1033,
      "manufacturer": "Kartones"
    }
  }
]
```

My saviour was [electron-builder](https://www.electron.build/). Just `npm`-installing it and adding a new `script` like the following:

```
"scripts": {
    ...
    "make-windows": "electron-builder --ia32 --x64 -w"
  }
```

Made it work at the first attempt.

I knew that Electron apps tend to weight a lot, as after all they contain a NodeJS and a Chromium browser. What I didn't expected was that the Windows installer of a **< 0.5MB** webpage would weight **266MB**! And even less that the Linux deb installer would be a whooping **600MB**!!! I'm sure there are some tweaks and options to shrink this, but the default is... a bit insane... I also want to test generating the Linux binaries using electron-builder, as *maybe* works better than electron forge (one binary weights less than half than the other).

So, overall, it is true that Electron is very very easy to get running and do a simple packaging, and you can even do multi-arch and cross-platform compilations from a single host (which sounds as crazy as great!), but the default options seem to make it just work for building a kind of "alpha" binary, in need of extra love.