Skip to content

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

@petermikitsh

Description

@petermikitsh

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.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions