[chore]: improve build times

[FaberVitale]

redux-devtools is a humongous project and we should consider the use of esbuild or swc to speed up compilation time. We could use rollup-plugin-esbuild to generate the js bundle and rollup-plugin-dts to generate the ts types.

esbuild in other redux projects

reduxjs/toolkit uses esbuild to generate esm builds.

[Methuselah96]

Note that the Webpack builds are by far the slowest. Specifically the extension build, the @redux-devtools/ui Storybook build, and the @redux-devtools/app Webpack builds take 80% of the build time, so we should focus on making those fast if we want to make any meaningful impact on the overall build time. I'm not sure what options we have for making the Storybook build faster.

[FaberVitale]

Note that the Webpack builds are by far the slowest. Specifically the extension build, the @redux-devtools/ui Storybook build, and the @redux-devtools/app Webpack builds take 80% of the build time, so we should focus on making those fast if we want to make any meaningful impact on the overall build time. I'm not sure what options we have for making the Storybook build faster.

@redux-devtools/app

Looking at the compiled code, packages/redux-devtools-app/build/web/js/app.js, it seems that it still uses regenator.runtime to handle async functions(browser support).

1. Can we use a more recent compilation target?
2. Is babel still necessary: isn't ts-loader good enough?

I'm not sure that it still makes sense for a development tool to target old browsers. Replacing Webpack with Vite (aka esbuild) could be viable solution.

Note that these suggestions are more than likely breaking changes.

[markerikson]

Yeah, my first take is that it's absolutely safe to use async code in browsers (especially given that we just shipped a major release here).

[Methuselah96]

1. Can we use a more recent compilation target?

I don't think that will make a significant difference in build time, but let's see how https://github.com/reduxjs/redux-devtools/pull/1017 does.

That being said, I don't think Babel is the largest bottleneck, I think Webpack is just really slow whether using Babel or not.

[Methuselah96]

The build for @redux-devtools/app in https://github.com/reduxjs/redux-devtools/pull/1017 ended up being ~14 seconds faster. Not sure how much of that can be chalked up to build time variance, but I think we'll need bigger changes than that to consider making a change.