Keep the build output in the repository to avoid building on the cloud

[nikkothari22]

All SPA apps using Frappe have a build step that does the following:

1. Build the Vue/React SPA and store the output JS/CSS/other assets in the Frappe apps's public directory
2. Copy the generated index.html file to the <app>.html file

This is done for all deployments since the generated build output and the index.html files are ignored in git. My question is : why?

I am almost 90% sure that I'm missing something extremely stupid here, but why not just build the app and keep the build output in the repo itself? That way, we don't need to build the app again on the server. This would save (potentially) thousands of hours of build times across apps across multiple benches.

Will check if this works. If anyone has any idea why this won't work, please feel free to share. I'm already convinced that I am missing something basic here.

[linear]

RAV-61 Keep the build output in the repository to avoid building on the cloud

[nikkothari22]

Some additional research:

Why do projects like Vue/Three.js check build results to git
This states to not have build output in source because code reviews become complicated - I agree.

What if code review remains the same but on every push to the main branch, a GitHub action creates a pull request with the build output - sort of like a "release PR"?

[nikkothari22]

It's easier to think this in terms of npm packages - which are compiled and then uploaded to npm. Frappe apps are sort of like javascript packages - the end users just want to download it and then update their database. Why "build" any frontend assets?

[nikkothari22]

Updates from my test:

I created a new branch called "build-output-trial" which has the entire build output stored in Git in the Frappe app repo. I just changed one line of text in the UI to test if I get the new build or not.

Previous identical deployment on FC took 305 seconds just for Raven:

New deployment with the build output stored and removing the build step from package.json took 126 seconds (60% faster)

And it took that much time since yarn install still ran for the React app - even that could be eliminated.

The more I think about it, the more it makes sense. This would allow us to use Vite 5 without being dependent on the end user's node version. For example, the mobile app branch requires a minimum node version of 18.18 because of the Metro bundler. It's far easier to just "publish" the app instead of asking users to build it.

[netchampfaris]

@nikkothari22

I think the idea of "build once" and "download everywhere" makes a lot of sense.

Frappe Framework did a version of this where built assets are uploaded to GitHub assets and then downloaded when "bench build" command is run.

Now, your approach of committing build output to the repo eliminates unnecessary steps. I think this should be first-class for every Frappe app.

[nikkothari22]

One problem with this approach is that merging branches (let's say develop -> main) might become an issue since the build outputs might have merge conflicts and there's no way to meaningfully resolve them.

I wonder if there's a way to tell git to ignore certain files... oh wait 🤔