Blueprint: Bundle size optimization (only react vs [email protected] vs [email protected])

Created on 23 Mar 2018  路  4Comments  路  Source: palantir/blueprint

Bug report

  • __Package version(s)__: 1.0.0 and 2.0.0
  • __Browser and OS versions__: mac

Bundle size:

| Only React | React + [email protected] | React + [email protected] |
|------------|---------------------|---------------------|
| 97 KiB | 293 KiB | 594 KiB |

Test code https://github.com/AveVlad/palantir_blueprint_playground

import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from '@blueprintjs/core';

const container = document.getElementById('app-container');

ReactDOM.render((<div><Button>123</Button></div>), container);

webpack: https://github.com/AveVlad/palantir_blueprint_playground/blob/master/common/webpack.common.js

Steps to reproduce

  1. git clone https://github.com/AveVlad/palantir_blueprint_playground
  2. npm install
  3. node bundle_size.shell.js -i
  4. node bundle_size.shell.js -b | grep "main"

Questions

Only React vs [email protected]

Why such a big difference?

Only React vs [email protected]

Why so much a big difference? 馃

Blueprint is awesome lib, Thanks!

question

Most helpful comment

Can icons package be tree-shaked during build?

All 4 comments

@AveVlad the big difference is from the new icons package: a few hundred kb of SVG paths in the JS files.

the upside is that you should no longer have to load the icon fonts, so the net difference is roughly zero.

Can icons package be tree-shaked during build?

@rayshan not currently, but we're definitely open to suggestions!
please discuss icon tree-shaking on #2193.

closing in favor of #2193

Was this page helpful?
0 / 5 - 0 ratings