Discussion: Which bundler to use (Webpack, Rollup, Parcel, esbuild...)

Hedgehog-Computing / hedgehog-lab

Run, compile and execute JavaScript for Scientific Computing and Data Visualization TOTALLY TOTALLY TOTALLY in your BROWSER! An open source scientific computing environment for JavaScript TOTALLY in your browser, matrix operations with GPU acceleration, TeX support, data visualization and symbolic computation.

https://hlab.app

Apache License 2.0

2.37k stars 141 forks source link

Discussion: Which bundler to use (Webpack, Rollup, Parcel, esbuild...) #55

Open imtsuki opened 4 years ago

imtsuki commented 4 years ago

Currently create-react-app suffers from slow compilation. On my personal laptop (MacBook Pro 13' late 2017) it usually takes up to ~1 min to do a cold start, which is kind of unacceptable for this size of apps. People (including @promer94 ) are suggesting we should move to another bundler. I think we should discuss which bundler we should move to:

There are several choices:

Webpack: which create-react-app is using under the hood. Slowest but has the best compatibility. Also, the configuration is a nightmare.
Rollup: seems like an "average".
Parcel: Relatively fast compared to other bundlers.
esbuild: Fastest but... Is anybody actually using this in a serious project?
(Please add another)

imtsuki commented 4 years ago

CC @lidangzzz @AGDholo

AGDholo commented 4 years ago

A digression, The new project of vuejs (also the bundler of vue3(not default)) is using esbuild and Rollup: https://github.com/vitejs/vite

AGDholo commented 4 years ago

Webpack: Do we need strong compatibility? Could the mental burden of configuring webpack offset the positive benefits of compatibility? If we're going for speed, we need to make a trade-off between compatibility and speed.
parceljs: The program looks like it's going nowhere, at least for now. In other respects, does it have any obvious advantages over rollup or esbuild for us to choose it?

I have no professional builder development experience, so the above comments are just my immature views.

promer94 commented 4 years ago

rollup is usually used for building javascript library rather then application. It has less plugins to support frontend applications development such as dev-server, hot-module-replacement.
vite is awesome, but it does not perform any compatibility-oriented code transforms by default. We currently need to use worker-loader which is a webpack plugin. Vite does not support that
I think actually we don't have to maintain a complex webpack configuration by ourself. The community already have some good bundlers built on the top of webpack(create-react-app is one of them), we can make use of them. We need a configuration which will not compile node_modules
I have already made a example using Poi in my fork

promer94 commented 4 years ago

https://bundlers.tooling.report/

hirohe commented 3 years ago

currently vite is support directly import web workers

AGDholo commented 3 years ago

vite use esbuild,

For now, the packaging solution esbuild,snowpack is in line with the trend

AGDholo commented 2 years ago

In vite preparation, the switch will be done after the rendering issues are resolved.

https://github.com/Hedgehog-Computing/hedgehog-lab/tree/feat/vite