Not sure if my approach is correct on this, need a discussion

Hi guys,

I’ve been working on an app for around a week now, and it’s pretty much my first time using Electron seriously, this is a personal project mostly for learning purposes, loving it so far!

To make my question make sense I’ve to give a bit of the information about the app first, here it is: the first intention of the app is to be a basic text editor with ability to have multiple tabs (kinda like Notepad++ does it), however each tab will have more input fields to it than just text editing (for example name, number, name, time spent and description).

So far I’ve the tabs generated with VueJS and Bootstrap together and the app also does some requests (using requestJS) on the front-end scripts, all pretty simple.

However, I am wondering if this is a right/reasonable approach in your opinion. I am basically not using the main.js at all - it just opens the main window and the rest is done kind of on the front-end. Even my whole app is just 1 html file and intend to keep it kinda of SPA way. I’ve checked all the docs on Electron, but still don’t feel confident doing more in main.js as I think front-end is sufficient, or would it make more sense to generate tabs and etc via that main process instead somehow if possible? Would that be less resource heavy or a better approach when it comes to Electron development?

Please let me know if you need any more details on anything, will be happy to discuss everything, thank you for your time!

Your approach is correct. The main process should handle interacting with the OS and opening windows. Each window (in most cases, “window” is synonymous with “renderer process”) should be a self-contained web app. Your UI will pretty much be entirely generated by the code inside the renderer process.

The Electron documentation has an in-depth discussion about this.

Got it, thanks for the input.

I’ve actually read that exact page (again) while posting here lol.

What do you think, for things like listening to specific key inputs (ie CTRL+N for a New Tab) - is it okay to do this in the rederer process rather than main one? Somehow I just have the feeling that some actions are better handled in the main process, but the the communication with the renderer process must be done well.

The window is what’s going to receive and handle any inputs. Unless your app includes a keylogger, the main process has no way to receive keyboard events as far as I know. Unless your tabs are actually windows, like Chrome tabs are, you don’t need to have the main process do anything. Your entire app is going to be self-contained inside the renderer process such that you could drop it on the Internet and it would still function.

This is what you’ve already been doing, this is what the documentation tells you to do, and I’m confused at why you’re second-guessing it.

It’s not what documentation tells me to do though.

Take a look at this sample Electron documentation for example:

This registers shortcuts various actions, such as submenu items and more - this is definitely not a keylogger lol.

Okay, so that’s a way to handle keyboard events through the main process, but do you need to do things like intercept your keyboard’s media buttons? (I think that technically counts as keylogging since they aren’t going directly to the window you have focused.) Have you found yourself unable to handle keyboard events in the standard fashion?

If you search the Atom repo for the word “keymap”, you’ll find that all instances of code that load and define keybindings (as far as I’ve dug so far) are called by the renderer process. When Atom loads a new package, it doesn’t need to go ask the main process what to do with the new keymap file. Everything an Electron application needs to handle a keypress in the window is contained in the window, and you can take any functional web app (as far as I know) and drop it into an Electron app and it will behave the same as if you had opened it in Chrome.

That does not count as keylogging no matter how you look at it. Main process is not a separate software running besides the renderer process, they are essentially are a part of 1 thing.

I haven’t even implemented anything for key events yet, it was an example.

Regarding the last sentence - yes I am sure it’s going to work, if not fully then mostly all should work the same way.

Cool, well thanks for your input, wanted to discuss this with someone and we did.