react-color is quite source heavy, even when minified

Created on 24 Jul 2018 · 4Comments · Source: casesandberg/react-color

Just including <ChromePicker> in our project added 800kb of uncompressed source code to our build - 4.6MB to 5.4MB. Our minified build went from 497kb to 606kb.

I wonder what dependencies it really needs, and which could be optimised away...

Source

Glutnix

👍5

Most helpful comment

I got it down to 57k minified by just requiring the chrome component file:
import ChromePicker from 'react-color/lib/Chrome';

As for size impact, I think the big culprit is lodash's debounce method.

Glutnix on 25 Jul 2018

👍4

All 4 comments

I’m working on a rewrite that is 1/10th the size, I just haven’t had the
time to finish it. Hoping to get it out within the next few months.

On Mon, Jul 23, 2018 at 8:02 PM Brett Taylor notifications@github.com
wrote:

Just including in our project added 800kb of uncompressed
source code to our build - 4.6MB to 5.4MB. Our minified build went from
497kb to 606kb.

I wonder what dependencies it really needs.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/casesandberg/react-color/issues/524, or mute the
thread
https://github.com/notifications/unsubscribe-auth/AEa0JNmmgO9o7pUv4QX1CZf0l53M8fFkks5uJo43gaJpZM4VcALY
.

casesandberg on 24 Jul 2018

🎉3

I got it down to 57k minified by just requiring the chrome component file:
import ChromePicker from 'react-color/lib/Chrome';

As for size impact, I think the big culprit is lodash's debounce method.

Glutnix on 25 Jul 2018

👍4

You are correct, and size is the major focus of the rewrite. The best way currently is to import from the lib folder.

casesandberg on 29 Sep 2018

Hello,

I still find the bundle is quite heavy for what it does; any plans to make it smaller? I doubt the dependency on lodash is useful nowadays. This library seems to be the most used currently, but I guess most dependencies could be replaced.