do not import unnecessary decorators

[mydearxym]

General Information

• [ ] Bug
• [ x ] Improvement
• [ ] Feature
• [ ] Other

Description

i tried react-decoration with react-boilerplate, it's great, but the only issue is bundle size :

before

Version: webpack 2.1.0-beta.22
Time: 19226ms
                                    Asset       Size  Chunks             Chunk Names
          3.276f03ea0a17756b8a66.chunk.js     7.8 kB       3  [emitted]
                                .htaccess    1.53 kB          [emitted]
                            manifest.json  624 bytes          [emitted]
          0.b967f0bb33e8c1f9801c.chunk.js    66.8 kB       0  [emitted]
          1.c6c8c78ee23a90950b3f.chunk.js    79.7 kB       1  [emitted]
          2.3c0fd83ed0be4e272278.chunk.js    25.3 kB       2  [emitted]
                              favicon.ico    15.1 kB          [emitted]
          4.8526170230b22366d99e.chunk.js    3.43 kB       4  [emitted]
          5.2f3d2e1475dcdf3d02bb.chunk.js  571 bytes       5  [emitted]
             main.be58e1bd77b283349da5.js     393 kB       6  [emitted]  main
main.7de2fbe314ffdbfdcc0733fdd993e7a0.css  908 bytes       6  [emitted]  main
                               index.html  621 bytes          [emitted]
                                    sw.js    13.6 kB          [emitted]

after

Version: webpack 2.1.0-beta.22
Time: 20009ms
                                    Asset       Size  Chunks             Chunk Names
          3.276f03ea0a17756b8a66.chunk.js     7.8 kB       3  [emitted]
                                .htaccess    1.53 kB          [emitted]
                            manifest.json  624 bytes          [emitted]
          0.42c9f3bb7483cb57a46d.chunk.js     112 kB       0  [emitted]
          1.08976c80ec099195e156.chunk.js    66.8 kB       1  [emitted]
          2.3c0fd83ed0be4e272278.chunk.js    25.3 kB       2  [emitted]
                              favicon.ico    15.1 kB          [emitted]
          4.8526170230b22366d99e.chunk.js    3.43 kB       4  [emitted]
          5.2f3d2e1475dcdf3d02bb.chunk.js  571 bytes       5  [emitted]
             main.e9d7fd3bddaa80e91f4e.js     393 kB       6  [emitted]  main
main.7de2fbe314ffdbfdcc0733fdd993e7a0.css  908 bytes       6  [emitted]  main
                               index.html  621 bytes          [emitted]
                                    sw.js    13.6 kB          [emitted]

the only different is i use

import { throttle } from 'react-decoration';

and the final build size increased about 32kb

i think it import all the decorators ?

Versions

• react-decoration: latest
• Browser: all

[mbasso]

Hi @mydearxym, yes, importing a single decorator from react-decoration causes the import of all modules, that increase the bundle size. At the moment you can avoid this importing each decorator from its full path react-decoration/lib/decorators/{namespace}/{decorator}

Referencing to the doc, in our example, you can do the following

import throttle from 'react-decoration/lib/decorators/functions/throttle';

I can add this information to the doc as soon as possible

[mbasso]

Here is a commit about this 4245c69

[mydearxym]

@mbasso thanks for the quick reply , this is much better ! thanks !