All Packs Rebuild

[firrae]

Hi there,

Maybe this is something I'm misunderstanding about the default configs, but in other instances I've used Webpack it's always skipped bundles that hadn't changed. In my project I have 2 entry points assets/javascript/packs. I did this for 2 reasons:

1. After adding Tailwind to my project and following a couple of basic tutorials to get it going, my build time went from a second or so to 35 to 50 seconds every time I touched a JS file. My thinking was that it was detecting that something in the pack changed so it had to rebuild it all so:
2. Moved the Tailwind import to a separate core.js "pack" so it was like so:

import '../css/application.css'

(That's literally all I have in it)

Both packs are linked into my standard template like you would expect. I have tried javascript_packs_with_chunks_tag and javascript_pack_tag to note.

Now the crux of the issue is, my application bundle is now 249 KiB, my core is 5.32 MiB (with a 5.36 MiB map). I can change nothing that core touches but it is always rebuilt when modifying even a single character that is held within the application package. I would have expected that since core hadn't changed at any level it would use the previous build. Is there something I'm missing that is causing this continual re-compilation? With the Tailwind import commented out the build time goes down to 10s, but it still re-compiles both for some reason, but at least its only 10s. These times are still much higher than I'd expect, but I'd like to try and solve one issue at a time.

Any help with this would be greatly appreciated.

EDIT:
I should add I realize there is likely some time hit due to my setup (WSL), but not this much of a time hit:
Windows 10 (H20 update)
WSL 2 (Ubuntu 20.04)
Ruby 2.7.2
Rails 6.1.0
Webpacker 5 (in Gemfile)

[firrae]

Well the length of time this build takes seems to be directly related to Tailwinds sadly getting bloated, and attaching itself specifically to PostCSS 8 (Webpacker seems stuck currently on PostCSS 7) as seen here:
tailwindlabs/tailwindcss#2544
tailwindlabs/tailwindcss#2820

Which I guess leads me to begin looking for a new CSS framework to replace it as 30+ second build times is not a good development experience and spending more time that the so far 5+ hours is too much to fix this.

Though this does still leave me to wondering if my understanding of how Webpacker builds things is correct: does it rebuild every "pack" every time a file changes anywhere in the watched file structure and rebuild everything regardless of what pack it belongs to?

[firrae]

Interesting, I am seeing very high build times with Bootstrap as well (22.7s on a rebuild). Bundle and map are both 1.2 MiB. Is this an issue running inside WLS2?

[firrae]

AHA! The issue was indeed with WSL 2! This comment on a WSL issue lead me to a solution that considerably sped up my build step: microsoft/WSL#4739 (comment).

My solution was to move my project fully into the WSL filesystem. The issue is the default place Windows Terminal (the new open source one) beings you to when opening a WSL tab is the Windows mount which is apparently extremely slow. My builds with Bootstrap are now at the most 2.5s, and for simple JS changes as low as 35ms. At this point I can only assume that I will see similar improvements with Tailwind short of the know slowness from the huge utilities library.

Since this was an existing project I did 3 steps to get it moved and working:

1. In File Explorer I moved my project folder to a location in \\wsl$\Ubuntu\home\<username>.
2. In Terminal navigate to the location and run rails webpacker:install. This needs to be done to fix permission errors. If you've modified the configs, back them up and put them back after.
3. Delete the node_modules folder and reinstall NPM based dependencies (might not be needed, but I did it anyways).
4. BONUS: This fixed the file watcher for me - the filesystem Windows mounts and defaults you to doesn't send file change notifications to the guest OS, working directly on it makes it just work! Also, packs now compile as I expected they would. While it still "compiles" all packs, it does cache properly now meaning it no longer does useless re-builds of large files needlessly!

A couple of caveats remain:

• RubyMine seems to not be able to see everything properly (it keeps complaining about missing Gems that are actually there)
• You need to turn case sensitivity on in RubyMine to satisfy it but this seems potentially global? (https://confluence.jetbrains.com/display/IDEADEV/Filesystem+Case-Sensitivity+Mismatch)
• Microsoft says they are working on performance of the filesystem interface, and while this works I got mixed signals reading around if it is "supported" so YMMV.