According to React's blog (https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html), there's a new JSX runtime for Babel:
Depending on your setup, its compiled output may slightly improve the bundle size.
However, it made my bundle size 2% bigger. I was curious, so I dug into the output. The dev version looks like this:
(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxDEV)("div", {})
And the production version looks like this:
(0,a.jsx)("div",{})
In the React blog's example, they have _jsx as a function instead of a method. This is probably contributing to the 2% file size increase. Is this a Webpack issue? Is it possible to make Webpack optimize this further?
What other reasons could there be for the new runtime making the bundle larger?