Optimization of production webpack tree-shaking and scope-hoisting

tree-shaking is a term that comes packaged optimized production mode, typically JavaScript code for removing the unreferenced when packing

The introduction of the development of a module, which only use one function, then the package will package when used functions, not to keep unused functions are packaged into it.

 

example:

A new module export add (a, b) {return a + b} 

                  export  event(a,b){return a+b} 

2 calls

import a from  "a.js"

 a.add(1,2)

// At this event it has not been called to, the package will not put him into the pack

 

3 scope-hoisting

  Break up your whole code together (referenced only once code)

eg: a module export let a = 1, b = 2, c = 3

  Calls import a from './a.js'

   console.log (a + b + c) packed at this time when webpack will help you calculate the value, the browser does not need to be calculated