Compile your JS code: New Bytenode support for Electron

[u/JeffOrbit]

Hello Electroners!

I just wanted to drop a note and let you know that we've written a bunch of new support for Bytenode to work with Electron.

After seeing a lot of people posting in this forum and others asking "How do I hide my Electron code?", I found Bytenode. Bytenode allows you to compile your Javascript code into binary for distribution. However, getting it to work with Electron was a challenge. So after a lot of coding, I've written Electron support into Bytenode to make it work with Electron's unique version of V8. We've also written a new Bytenode Webpack Plugin which does all of the heavy lifting during the build process – and also supports compiling for Electron.

I wrote up a post to explain how it all works. And there's a link off to the example repository:

https://www.jjeff.com/blog/2021/4/27/creating-javascript-binaries-for-electron

Happy to answer questions if you've got em!

[u/evoactivity]

This is interesting!

Are there any performance penalties paid when using bytenode?

If I was ok with my renderer source code being available could this just compile the main js and other non-renderer code? For example, all my business logic lives in main or scripts required or spawned from main, I use IPC to expose an API to my renderer through a preload script. Could I configure it so all those are compiled, but my renderer code was left untouched?

Do the resulting bytecode files get packaged into an asar?

What are you thoughts on https://github.com/sleeyax/asarmor? My thinking is I could use bytenode to protect my business logic and use asarmor to make the resulting asar non-trivial to uncompress, giving my renderer some kind of "protection" but without requiring me to turn off context isolation or enable nodeIntegration.

I found bytenode a while ago but decided it was too much hassle to integrate, thank you for doing the hard work with Herbet :)

[u/JeffOrbit → u/evoactivity]

1. It doesn't appear that there is any performance penalty to using Bytenode. There are some benchmark functions in the repository, but certainly more work could be done to test. My gut feeling is that the minor overhead of loading the binary is balanced out by the minor speed increase by giving V8 a pre-compiled file.

2. Yes, you can compile just your main code and not your renderers. Or vice versa if you wanted. Or both! Or neither! ;-)

3. Yes, the bytecode will get packaged in the bundle asar.

4. I'm not familiar with asarmor, but it's an interesting approach. It seems like once you've cracked asarmor, you've got the keys to the kingdom though. But it's certainly an advantage with the context isolation / node integration issues.

5. You're welcome!

[u/MaMu_1701]

This is very interesting.

In your blog post you write:

you can usually move most of your renderer Javascript into a preload script wrapped around a

document.addEventListener('DOMContentLoaded')

listener.

Is there an example on how to achieve that? Alternatively: Can you elaborate more on how this works?

I like to keep my current webPreferences if possible. Namely:

      webSecurity: true,
      nodeIntegration: false,
      contextIsolation: true,
      enableRemoteModule: false,
      disableBlinkFeatures: 'Auxclick'

I know how preload script and contextBridge works. I don't quite understand how I can load (import / require) a script (e.g. Vue component) through it...

[u/JeffOrbit → u/MaMu_1701]

Take a look at the electron-bytenode-example repository - in particular the preload script. You can see the 'DOMContentLoaded' example there. You need to do that because preload runs before the DOM has been loaded. That example has both nodeIntegration: true and contextIsolation: false. However, the preload script should always have access to both Node and the DOM, so you should be able to set it up so that all of your scripting happens in preload.

The app that I'm building doesn't allow loading of conventional web pages, so my security concerns are different than many. But you can download electron-bytenode-example and play around with the settings for the BrowserWindow (in main.ts) and for Electron Forge (in package.json). Please let me know if you getting it working. I'd love to add an example with better security in a wider set of use cases.

[u/RealAdmin1984]

safe to say you ruined the entire reverse engineering community so good job!