Skip to content
This repository has been archived by the owner on Feb 19, 2022. It is now read-only.

Latest commit

 

History

History
60 lines (42 loc) · 1.48 KB

README.md

File metadata and controls

60 lines (42 loc) · 1.48 KB

VictoryLine Experiments

Various Webpack configuration hacking for an efficient, terse app bundle with VictoryLine from victory.

Background

Victory builds to ES6 es which is pointed to in package.json:module so we should get full tree-shaking benefits. But we don't until webpack@4.

Related other tickets:

  • victory#547: Original discussion spurring this repo.
  • victory#549: Webpack tree shaking does not completely remove unused re-exports
  • victory#548: Provide efficient webpack helpers for tree-shaking + DCE

The Two Builds

We have two entry points that only differ in:

// use-index.js
// Use the full index with all re-exported components.
import { VictoryLine } from "victory";

and

// one-off-import.js
// Go straight off of the full path to the individual component.
import VictoryLine from "victory-chart/es/components/victory-line/victory-line";

Building

Here's current for webpack@4:

# Just build
$ yarn run build

# production
$ wc -c dist/*{index,import}.min.js
  248226 dist/use-index.min.js
  248232 dist/one-off-import.min.js

# development (with sideEffects optimizations on.)
$ wc -c dist/*{index,import}.js
  888503 dist/use-index.js
  888676 dist/one-off-import.js

Analysis - One Off vs. Using Index

Everything's the same. Yay!