search

climate-cooperative / home-energy-calculator

https://app.zwell.io/
Apache License 2.0
2 stars 2 forks source link

Faster Local DevServer #48

Closed rgraue closed 5 months ago

rgraue commented 7 months ago

Description

The DevServer we use right now (webpack) has been reported as slow, and is slowing down development. Look into ways to decrease live build/dev time

Technical Notes

(https://esbuild.github.io/)

Risks

If it ain't broke, don't fix it

Related Issues Or Discussions

[...Issues]

sfishel18 commented 6 months ago

@rgraue would you be open to a POC with vite? tbh i haven't used it myself, but i am very familiar with the pain of slow webpack builds and i've talked to other devs who switched from webpack to vite and saw things speed up significantly.

sfishel18 commented 6 months ago

@rgraue i created a PR with what it would look like to migrate to vite. everything seems to be working well for local development, and the live reloads on a code change are quite a bit faster.

the production build output looks comparable (a ~1.1MB entry file and some other smaller lazy loaded files)

webpack:

--> ls -lah -R dist

total 2856
drwxr-xr-x  18 simonfishel  staff   576B May 26 20:00 .
drwxr-xr-x   4 simonfishel  staff   128B May 26 20:17 ..
-rw-r--r--   1 simonfishel  staff    10K May 26 20:00 332.index.bundle.js
-rw-r--r--   1 simonfishel  staff    61B May 26 20:00 332.index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff   151K May 26 20:00 376.index.bundle.js
-rw-r--r--   1 simonfishel  staff    22K May 26 20:00 624.index.bundle.js
-rw-r--r--   1 simonfishel  staff   188B May 26 20:00 624.index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff   1.2K May 26 20:00 756.index.bundle.js
-rw-r--r--   1 simonfishel  staff    61B May 26 20:00 756.index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff   4.6K May 26 20:00 820.index.bundle.js
-rw-r--r--   1 simonfishel  staff   462B May 26 20:00 820.index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff    25K May 26 20:00 88289a181451255b4e814d5b490d81ac.png
-rw-r--r--   1 simonfishel  staff   6.6K May 26 20:00 920.index.bundle.js
-rw-r--r--   1 simonfishel  staff    61B May 26 20:00 920.index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff   996B May 26 20:00 favicon.ico
-rw-r--r--   1 simonfishel  staff   1.1M May 26 20:00 index.bundle.js
-rw-r--r--   1 simonfishel  staff    16K May 26 20:00 index.bundle.js.LICENSE.txt
-rw-r--r--   1 simonfishel  staff   447B May 26 20:00 index.html

vite:

--> ls -lah -R dist

total 8
drwxr-xr-x   4 simonfishel  staff   128B May 26 20:17 .
drwxr-xr-x   4 simonfishel  staff   128B May 26 20:17 ..
drwxr-xr-x  10 simonfishel  staff   320B May 26 20:17 assets
-rw-r--r--   1 simonfishel  staff   577B May 26 20:17 index.html

dist/assets:
total 2728
drwxr-xr-x  10 simonfishel  staff   320B May 26 20:17 .
drwxr-xr-x   4 simonfishel  staff   128B May 26 20:17 ..
-rw-r--r--   1 simonfishel  staff    25K May 26 20:17 dial_bg-CfmtVHzX.png
-rw-r--r--   1 simonfishel  staff   1.1M May 26 20:17 index-CLBrbrLE.js
-rw-r--r--   1 simonfishel  staff   1.7K May 26 20:17 index-w5522CNl.css
-rw-r--r--   1 simonfishel  staff   146K May 26 20:17 index.es-BOAG7gwp.js
-rw-r--r--   1 simonfishel  staff    10K May 26 20:17 ios.transition-B4EX8FTN.js
-rw-r--r--   1 simonfishel  staff   1.0K May 26 20:17 md.transition-BzkoYX_b.js
-rw-r--r--   1 simonfishel  staff    21K May 26 20:17 purify.es-BVj1AYrp.js
-rw-r--r--   1 simonfishel  staff   6.7K May 26 20:17 swipe-back-NVNNEgnS.js

the only open question i have is whether the browserslist configuration can be supported in vite

rgraue commented 5 months ago

@sfishel18 sorry, somehow missed all these notifications! This looks awesome though!