Don't use importHelpers in react-effect #1651
Conversation
Using import helpers requires us to depend on the tslib package. Since react-effect is transpiled to cjs, it's not tree shakable. The tslib package is about 2 kb, which is roughly twice the size of the actual library. This PR removes that dependency so reduce the package size.
|
What about the previous changelog entries? For 3.2.2 -> 3.2.12? |
| @@ -23,9 +23,6 @@ | |||
| "url": "https://github.com/Shopify/quilt/issues" | |||
| }, | |||
| "homepage": "https://github.com/Shopify/quilt/blob/master/packages/react-effect/README.md", | |||
| "dependencies": { | |||
| "tslib": "^1.9.3" | |||
There was a problem hiding this comment.
Where were we using this before? Was it just accidentally there?
There was a problem hiding this comment.
I'm a bit confused. The tslib docs mention
this means delivering users smaller files on average, as well as less runtime overhead.
Shouldn't having this be more beneficial? 🤔
|
In #1657 @alexandcote bumped tslib to be > 1.14 - which added esmodule support. Update your app to the latest version of tslib and this should be treeshaken away. Even without this new esmodules support I don't think this PR is the right approach - sure this size difference is not an ideal look for react-effect on its own but the wins of using tslib comes when several modules all use it together. With this PR as soon as you include any other package from this library (and shopify apps depends upon several) you depend upon the helpers in tslib AND the helpers inlined into the react-effect package. And because of this duplication you end up with a net bundle size increase. |
|
@BPScott This makes sense. I planned on closing this earlier. Sorry for the delay! |
Description
Using import helpers requires us to depend on the
tslibpackage. Since react-effect is transpiled to cjs, it's not tree shakable. Thetslibpackage is about 2 kb, which is roughly twice the size of the actual library. This PR removes that dependency to half the package size.The helpers that were imported from the tslib package:
__importDefault./src/context__awaiter./src/manager__generator./src/manager__read./src/manager__spread./src/manager__awaiter./src/server__generator./src/server__importDefault./src/serverType of change
@shopify/react-effectPatch: Bug (non-breaking change which fixes an issue)Checklist