Skip to content
This repository has been archived by the owner on Sep 1, 2024. It is now read-only.

Add a package sideEffects field #350

Merged

Conversation

jaydenseric
Copy link
Contributor

This PR adds a package sideEffects field with a false value. This allows tree-shaking and dead-code-elimination to work much better, eliminating imports of prop-types if all of the imports end up being unused.

This change could significantly improve the bundle size of projects that nest propTypes under a conditional so they will be eliminated from a production bundle, for example:

https://github.com/jaydenseric/device-agnostic-ui/blob/89e5ba0b8c0ee5a8fb38f4ed74e7f19a6b4970d7/src/public/components/Button.js#L25-L32

if (typeof process === 'object' && process.env.NODE_ENV !== 'production') {
  Button.displayName = 'Button';
  Button.propTypes = {
    disabled: PropTypes.bool,
    className: PropTypes.string,
    children: propTypeChildren.isRequired,
  };
}

Currently, because the prop-types package doesn't have a "sideEffects": false field, for a production bundle esbuild eliminates the Button.propTypes = { declaration but it leaves the const PropTypes = require('prop-types');.

Copy link
Contributor

@ljharb ljharb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it's a non-standard field, but since it'll never be a standard one, it won't hurt

@ljharb ljharb merged commit 4de0644 into facebook:master May 25, 2021
@jaydenseric jaydenseric deleted the jaydenseric/add-package-sideEffects-field branch May 25, 2021 21:55
@jaydenseric
Copy link
Contributor Author

@ljharb can we please publish this change? Been waiting 6 months 😅

@ljharb
Copy link
Contributor

ljharb commented Dec 22, 2021

v15.8.0 is released.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants