From c35fcfae7930c4744d3349d5dafc9ea412d8de47 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jacob=20Gro=C3=9F?= Date: Wed, 20 Jun 2018 16:57:51 +0200 Subject: [PATCH 1/2] Mention `babel-react-optimize` closes #9 --- README.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/README.md b/README.md index 1599e1d..2191a3b 100644 --- a/README.md +++ b/README.md @@ -227,6 +227,24 @@ React is a library for building user interfaces. [npm package](https://www.npmjs React doesn’t perform `propTypes` checks in production, but the `propTypes` declarations still occupy a part of the bundle. Use [`babel-plugin-transform-react-remove-prop-types`](https://www.npmjs.com/package/babel-plugin-transform-react-remove-prop-types) to remove them from during building. +### A word on [`babel-react-optimize`](https://github.com/jamiebuilds/babel-react-optimize) + +You might or might not have heard about [`babel-react-optimize`](https://github.com/jamiebuilds/babel-react-optimize), it offers bundeled optimizations for React (and alternatives). +However, we do not recommend to use the bundle, see [here](https://github.com/facebook/create-react-app/issues/553#issuecomment-359196326) for why. TL;DR: It hurts TTI. In the linked comment, a React Dev elaborates this and explains why those are disabled in `create-react-app`. + +However, what we do recommend is: [`transform-react-pure-class-to-function`](https://github.com/jamiebuilds/babel-react-optimize/tree/master/packages/babel-plugin-transform-react-pure-class-to-function) which saves quite some bytes. + +To install, add it to your Babel config: + +```json +// .babelrc +{ + "plugins": [ + "babel-plugin-transform-react-pure-class-to-function" + ] +} +``` + ### Replace with Preact > ⚠ Use with caution / [How to migrate](https://preactjs.com/guide/switching-to-preact) / Added by [@iamakulov](https://twitter.com/iamakulov) From 46e06ff2d983faf350d8fa2e3ab6db60e5f568dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jacob=20Gro=C3=9F?= Date: Wed, 20 Jun 2018 17:02:44 +0200 Subject: [PATCH 2/2] Add emojis --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/README.md b/README.md index 2191a3b..137930b 100644 --- a/README.md +++ b/README.md @@ -229,9 +229,15 @@ React doesn’t perform `propTypes` checks in production, but the `propTypes` de ### A word on [`babel-react-optimize`](https://github.com/jamiebuilds/babel-react-optimize) +> ❌ Not safe to use / Why ↓ / Added by [@kurtextrem](https://twitter.com/kurtextrem) / [Join the discussion](https://github.com/GoogleChromeLabs/webpack-libs-optimizations/issues/9) + You might or might not have heard about [`babel-react-optimize`](https://github.com/jamiebuilds/babel-react-optimize), it offers bundeled optimizations for React (and alternatives). However, we do not recommend to use the bundle, see [here](https://github.com/facebook/create-react-app/issues/553#issuecomment-359196326) for why. TL;DR: It hurts TTI. In the linked comment, a React Dev elaborates this and explains why those are disabled in `create-react-app`. +### [`transform-react-pure-class-to-function`](https://github.com/jamiebuilds/babel-react-optimize/tree/master/packages/babel-plugin-transform-react-pure-class-to-function) + +> ✅ Safe to use by default / How to enable is ↓ / Added by [@kurtextrem](https://twitter.com/kurtextrem) + However, what we do recommend is: [`transform-react-pure-class-to-function`](https://github.com/jamiebuilds/babel-react-optimize/tree/master/packages/babel-plugin-transform-react-pure-class-to-function) which saves quite some bytes. To install, add it to your Babel config: