react-query v2 vs. v3 size bump / tree-shake in v3 not effective?

[sundarsu]

Moving from v2 to v3 resulted in a 20kB+ bundle size increase* for me. https://bundlephobia.com/package/[email protected] vs. https://bundlephobia.com/package/[email protected] is like 25.2 kB minified --> 55.2 kB minified. Aside: I did see that v4 was starting to look smaller so that was promising.

The issue is v3 tree-shaking does NOT seem effective given react-query's package.json that includes lib/index.js which likely bloats the package
"sideEffects": [
"es/index.js",
"es/react/index.js",
"es/react/setBatchUpdatesFn.js",
"es/react/setLogger.js",
"lib/index.js", <-------- introduced by Missing batch updates on Production by richardaum · Pull Request #2703 · tannerlinsley/react-query (github.com)
"lib/react/index.js",
"lib/react/setBatchUpdatesFn.js",
"lib/react/setLogger.js"
]

*For what its worth, my v2 imports were useQuery, useQueryCache, useMutation, QueryCache, ReactQueryCacheProvider. Moving to v3 with imports of useQuery, useQueryClient, useMutation, QueryClient, QueryClientProvider

[TkDodo]

since that was introduced in 3.24.4, can you show an example where things were treeshaked "correctly" with a version before that vs. what you get with a version after that?

Tbh, you import almost everything from react-query, so there isn't much to shake away. The biggest chunk is the QueryClient, which is a class, so it can't be treeshaked well.