Reduce @wordpress/data package size with implementing native JS functions instead of Lodash

[mdmag]

I love the @wordpress/data package so much because it really solved major problems at my application and I think it should gain more popularity among the React community. But hey, once I import it, my app size increases drastically.
@wordpress/data package alone is 33kb at the moment.
Here is the list of its dependencies:
1- lodash 73Kb
2- @wordpress/compose 34kb
3- @wordpress/redux-routine 10kb
4- @wordpress/hooks 6kb
5- @wordpress/deprecated 2kb
6- @wordpress/is-shallow-equal 2kb
7- @wordpress/priority-queue 2kb
8- @wordpress/escape-html 2kb
Around 164kb to just use @wordpress/data .. I hope this would be reduced.
I think that lodash is a major part here. I hope to replace the the functions used from lodash with native js implementation.
Here is the list of lodash functions used in @wordpress/data , @wordpress/compose and @wordpress/redux-routine:
{ forEach, without, debounce, includes, castArray, throttle, camelCase, upperCase, omit, get, mapValues, isObject, has ,flowRight, isPlainObject, map, isString, merge }
One short term solution is to change the syntax for lodash import in those packages from:

import { forEach } from "lodash";

to

import forEach from "lodash/forEach";

so if any one uses the package outside WordPress, he may need to have lodash-webpack-plugin but the long term solution is to implement vanilla JS functions instead of lodash functions in those packages: @wordpress/data , @wordpress/compose and @wordpress/redux-routine

[gziolo]

Have you tried replacing lodash with lodash-es in your webpack config? WordPress exposes lodash as a global to be shared between all JS modules so it doesn't need to optimize for the tree-shaking scenario, but in your case, it might help even it initially this package is a bit larger according to https://bundlephobia.com/result?p=lodash-es@4.17.20.

I also think that @ZebulanStanphill did some efforts in the past to use native functions instead of their lodash alternatives. It would definitely help here as well.

Aside: @wordpress/compose is tree-shakeable by default, and it only pulls createHigherOrderComponent and pure methods in @wordpress/data. It happens mostly when you use withSelect and withDispatch which is less popular option than React hooks these days.

[ocean90]

This should probably be closed as a duplicate of #17025. This and #9374 have a lot of discussion about this.

[gziolo]

Good catch @ocean90, let's move the discussion there. I copied over the comments.