nfl/react-helmet

Upgrade to Babel 7 and use @babel/plugin-transform-runtime to reduce bundle size

Open

#403 opened on Sep 29, 2018

View on GitHub
 (11 comments) (1 reaction) (0 assignees)JavaScript (17,167 stars) (706 forks)batch import
enhancementhelp wanted

Description

If you look at the compiled source for react-helmet (e.g., https://unpkg.com/react-helmet@5.2.0/es/Helmet.js), you'll see stuff like this (line 1):

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

This is a babel helper function. It's inlined, but it doesn't have to be. If you add @babel/runtime as a dependency to this project, and run babel with the @babel/plugin-transform-runtime plugin, you'd get output like this:

var _extends11 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

By referencing the helper from @babel/runtime, every time it gets imported in a bundle, you only end up with a single copy (instead of a potentially infinite number of inlined helper functions). It's an optimization that helps keep bundle sizes in check.

@jamsea I saw you were the last to merge to master. Mentioning for visibility. If you would accept a PR for this issue, please let me know, and I would contribute it.

To be clear -- there are no breaking changes suggested here, and this could go out as a patch release.

Contributor guide