This article will shed some light on the pro’s con’s of the representative web frameworks that can wrapped with Electron and the benefits you will gain from each framework.

First, Let’s worm up

Javascript, no wonder it became so popular. Thanks to its prototyping power. It may be wrapped with other fake useless languages such as Typescript. But Nah, It is nothing to waste time on. So we have got Angular, AngularJs/2+, Bootstrap and of course, ReactJs.

Kotlin, Being adopted by google, is a huge sign to run from angular as next Angular, maybe named Angular[a+b∙i], where a+b∙i is a complex number, may somehow use it and kills all you have done with angular. Read this for more information.

Ask yourself

  1. are you releasing an open source?
  2. Will you have all the functionalities available if you run your app in the browser?

Before I answer these questions, i want to propose a comparison for the candidates.

The candidates are: Angular(2+ or js), ReactJs and Bootstrap. There are similar and possible candidates such as Vue or Rim, However, React and angular is an enough representative of the rest.

React vs Angular: Angular is complicated if compared to React where the modeling layer does not exist/ not needed for desktop application.

Bootstrap vs React and Angular:

comparison
React and Angular have many common characteristics and i will put them on the same category and highlight the relevant differences. bootstrap, which is a more shallow framework is another category – though basic, still more efficient in this case.

Why Bootstrap?

  • Can be integrated with nodejs – this is very important if you are going to need filesystem interaction or express server.
  • Static loading – Electron will load the file instead of connecting to the server and load the page.
  • packaging will be easy
  • no hot reloading is needed – Refreshing the page will be enough
  • Easy css debugging using the Electron debugger
control
Desktop app must be able to utilize all the benefits available for it. this can be accomplished with nodejs which cannot be used directly with ReactJs or Angular

Why React/Angular

  • modern UI: Angular/ReactJs Materials are more modern related to bootstrap, which looks pretty old. However, The charm of These too is not needed as the mobile deficits does not exist in the desktops.
  • Web page functionality– If your application functions as a webpage, then this is a good option for you.
  • No source code is exposed – Your source code will not be exposed to the user as the packing of the application will generate a totally new code. adding obfuscation will make near impossible to reproduce the original code.

Packaging: Packaging bootstrap is easy as you don’t need to use webpack.

Why not bootstrap?

  • The packaged code is available to the end-user unless it is obfuscated. even in this case, the html is available unless the doms are generated by the javascript.
  • you will be working with HTML5+predefined classes.

Why not Angular?

  • The modeling of angular is irrelevant when it comes to Electron static desktop app
  • packaging takes long.
  • debugging the HTML with the electron/browser debugger doesn’t indicate exactly what change need to be done in the code
  • many capabilities will not be available such as interacting with the file system or open listening ports.
  • All the npms you need to install in order to run Angular is a hell of a drug dose. who needs that.

Why not ReactJs

same as Angular except the modeling – which is pretty straight forward with ReactJs

Conclusion

After reading this, you understand that bootstrap is the winner in most cases.

I want to thank you for visiting my blog. I wrote it to spread the knowledge and the experience. please follow this blog if you found it interesting and who knows? maybe you will be one of the first of million followers.

0000000-0-follow-me