Package Size and Optimization

[srameh]

I have successfully built an application using MVC Core 2 and SQLite. After running the BUILD command I noticed the following issues:

• The size of the build folder is 360MB. This is huge for simple MVC app.

• The app launch time is very slow. It takes about 20-30 seconds before you see the window.

• The Application name defaults to ElectronNET.Host. This value is coming from package.json which is generated by the Electron.net.

• The App icon defaults to Electron icon. Passing new icon path as part of the build command parameter did not help.
  How can I include my own package.json file so it does not take the name ElectronNET.Host?
  How can I reduce the size of the application and fix the above issues?

[EldinZenderink]

For windows: #153

Linux still has issues.

For getting smaller sizes I am currently trying to package the damn thing manually for distribution, if I use electron-builder for windows my installer sits around 65 ish MB.

I am currently trying to bypass the build command for electronnet by doing the following:

Build the application once using the command dotnet electronize start

Then, there should be an directory within obj/Host containing just the electron application (folder contains main.js)

Edit the package.json and change the name and version(in my case).

then within that directory I run 'electron-builder build'.

A dist directory appears in that directory with an (nsis) installer of about 65mb. Which works.
Though, extracted/installed, the directory is again around 230mb.

Currently trying to get a linux build going on (AppImage fails without giving an explanatory error, deb file gives some package.json error, such as author name and emailaddress + homepage, etc. All required by a deb file. Some customization for the package.json file would be helpfull, like some kind of property file for custom package.json parameters so when the package.json file is being generated the values from the property file are added and or replaced within the package.json file.

*Edit: I had an older version of electron-builder installed, apparently when building on windows for linux its using a remote builder, it failed on uploading the stuff to the remote builder. After installing the latest version the build seems to work for linux as well. Currently have a batch file that automatically generates a package.json file (DONT do this when you have custom dependencies installed) and a electron-builder.json file with the specific config for each package/platform. In case your interested I can provide the batch file.

[srameh]

@EldinZenderink Thank you SO MUCH!
Please share the batch file and the package.json if you don't mind.

[EldinZenderink]

Its ugly AF (my first try at writing an actual batch script ;) ) but here it is:
custombuildelectronnet.zip

Just put these files in your root project folder. For help, type ./build.bat help

Just replace the values within package.json & electron-builder.json to the values you want (highly recommend to use the wiki of electron-builder, you can leave the linux target in there even if you dont want linux, if you specify that you only want to build windows (see the help) it will ignore the linux target.

Hope it helps.

*Btw linux packaged deb files are not working in my case, it's giving me an anoying ENOENT for both AppImage and deb files and neither Icons are visible, so, or my script is doing something weird, or the target setup is wrong, I will keep experimenting.

*Oh and you do need to in stall electron-builder globally! npm install electron-builder -g before using this script!

*Btw the script expects a full file path, so nothing relative.

[srameh]

You are awesome! Thank you again.

[EldinZenderink]

BTW, I made a stupid mistake, depending on which os you want to build, you need to run the dotnet electronize build /target linux for linux, and use the generated files within /obj/desktop/linux for the build directory. That one will install and run just fine on linux. (The one in Host does work on windows).

[EldinZenderink]

@srameh
I'm fine with using the default nsil installer, I honestly think it wont get much smaller than 60mb ish, but just for curiosity sake: is there much of a difference using wix?

[srameh]

@EldinZenderink:
I have not been able to successfully generate a build with WiX yet.

[RogerDodger123]

@EldinZenderink
I have tried to use your batch approach by creating an installable version of the app from the Host folder. but everytime I try to run the app after install I get the ENOENT error appear. I am trying to perfrom this on a windows machine.

The app runs fine when running electronize start and also when running the version built from dotnet electronize build /target win.

Any ideas?

[EldinZenderink]

@RogerDodger123

As mentioned in my post above, you can't use the Host directory most of the time. (Mine for some reason did work when using the Host directory, but only for the platform that I build upon, but that might just have been a stroke of not helpfull luck). So when performing the 'dotnet electronize build command' you need to use the /obj/desktop/win (or windows not sure not at home right now) directory instead of the host one. If that doesn't work, then I am not really sure what is going on. Did you modify the build-electron.json file? If so, did you enable asar? For some reason when I do that, I have ENOENT errors appearing as well.

Also when installing to the Program Files directory, you might need to run it with admin rights, depending on what your back-end does.

I do need to mention that in the end I gave up on getting it to work (icon issues and all that as well) with ElectronNET. ElectronNET is cool, especially if you need to use the API from electron directly from the back-end, but I didn't need that.

In my case I manually created a electron project, added a directory for my .net core back-end and interface, moved my back-end to that directory after publishing it (creating an executable). Then I just initiate a child process within main.js (nodejs stuff) from electron. For my interface, since my interface is a standalone single page (typescript/angular 5) webpage I just directly load it in. (Or you could load the url of your back-end if that is what you desire). And it works fine. I then can just use electron-builder to package it without any issue (you need to replace the back-end stuff when compiling for a different platform such as linux with a published backed with target linux).

[RogerDodger123]

@EldinZenderink

Oh sorry I missed that. I have also tried to do this by performing the build command and trying to use your scripts in the following location /bin/desktop/win where the build places the files. I have also tried it in the location where the build makes the exe when using the command dotnet electronize build /target win. So this location I tried was APPNAME\bin\desktop\ElectronNET.Host-win32-x64\resources\app. I tried using your exact electron build file and package json in the zip file to see if i could get it to work.

From what I have seen online I have also been running electron-builder build so it performs a build based on the host os and the name from the package.json file. The only this I have changed was removing a depencecy that was in the package.json file. Electron-build doesn't like electron dependency being the dependency section only in devDependencies of the package.json

[RogerDodger123]

I suppose the biggest thing I can notice. After the package is installed using the installer from electron-builder there is no app folder in the resource folder. There is only a asar file. Maybe that has something to do with it

Because when the command dotnet electronize build /target win its creates a app folder aswell as an asar folder

[RogerDodger123]

This is the error I receive:

Error: spawn ENOENT
at exports._errnoException (util.js:1050:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
at onErrorNT (internal/child_process.js:367:16)
at _combinedTickCallback (internal/process/next_tick.js:80:11)
at process._tickCallback (internal/process/next_tick.js:104:9)

[EldinZenderink]

@RogerDodger123 spawn error generally means that there is an issues "spawning" the process runing your .net core application. Again, did you try using the /obj directory? Another thin you can try and can do is the following: go to the installation directory, try to find the location of the main.js file (dont know it out of my head) (and make sure you asar disabled before packaging the installer), install electron globally, and then run through cmd: electron . in the installation directory, maybe it will give more information about the error then.

[EldinZenderink]

Oh btw, my bad, in the electron builder json file i didnt add the "asar":false, key value, try to add it underneath "productName":"CustomTitle", key value pair. (so within the top level object).

[RogerDodger123]

I have just tried to use your bat file to create the installer from the obj directory but I am getting errors from the electron-builder process. Think I may have other issues aside from this. Will check back when I get somewhere. Thanks

[RogerDodger123]

@EldinZenderink
I have managed to get it to run from an installer turning off asar!!!!
Any ideas why it doesnt work unless asar is disabled?

[EldinZenderink]

Asar is like a zip file containing the files for electron to run. When turning on asar it will also package the .net core backend within the same asar file. But what electron does is just spawn a child process running the back-end like you normally would when clicking on it (just automatically). (And some more magic by ElectronNET to make the API work). But when you pack the backend within the same asar file, the path to the executable for the backend is no longer correct (like normally it would be something like this: ./a/path/to/the/backend/, but when asar is used, it should be something like this: ./app.asar/a/path/to/the/backend/) You can however specify (using electron-builder) which files should be extracted out of the asar file first, but since I don't mind not using asar I just leave it like this. Though I guess asar makes the package smaller or something, haven't really looked it up yet.

[RogerDodger123]

I have looked into this abit more and went through electron packaging doc.
It comes down to the fact that child_process.spawn does not support executing binaries inside an asar file where as child_porcess.execFile would perform this for you. In the main.js electron.net uses the spawn process.

I have got it working now by unpacking the .exe like suggested in your post and making a slight change to the main.js to counter for the different file location. const binFilePath = path.join(__dirname, 'bin', binaryFile).replace('app.asar', 'app.asar.unpacked');

Thanks for your help

[EldinZenderink]

No problem, glad to be of help.

[RogerDodger123]

Something I have realised... after performing dotnet electronize build /target win and running the app it creates in the bin\desktop folder does the menu bar still appear for you. For me it does not. It only appears when running dotnet electronize start

This is without making any changes to files to do with the asar issue I was having.

[EldinZenderink]

I think it has to do with running development mode and release mode(which is after packaging) (might be completely wrong here). If you go to the directory where normally the main.js is located, and run the electron . command within that directory (after making sure it's installed through npm), you will see the menu appear as well. I think it's just there to help debugging for developers. That said, I think that is basically what dotnet electronize start does besides copying some files around to start the backend.

[RogerDodger123]

That make sense!!! Thanks again.

[GregorBiswanger]

@robertmuehsig can you do that for the CLI?

[anaether]

This would be very nice if we can compress the sizes more. In this fact we also need less time to load the programs. If you compare javascript electron implementation it needs for a empty running programm only 80mb of ram but Electron.Net for exactly the same needs 240-255mb Ram.

[GregorBiswanger]

We have been switching to electron builder since version 5.22.12. That creates an extremely compact version. At a startup performance will continue to be intensified.