====== Webpack ======
  * https://webpack.js.org/
  * [[:javascript|Javascript]] Bundler
  * [[node.js:build|Javascript / Node.js Build 도구]]

===== Caching =====
  * [[https://velog.io/@jiseong/Webpack-hash-chunkhash-%EA%B7%B8%EB%A6%AC%EA%B3%A0-contenthash-%EC%BA%90%EC%8B%B1%EC%A0%84%EB%9E%B5|[Webpack] hash, chunkhash 그리고 contenthash (캐싱전략)]]
  * [[https://sk92.tistory.com/4|hash vs chunkhash vs contenthash]]
  * Front End 배포시 리소스 캐싱 기법
  * ''contenthash'' : 파일 내용기반 해싱. 내용이 변경될 때만 해시값이 바뀌게 됨. 변경되지 않은 리소스는 그대로 둬서 캐시됨.

===== define plugin =====
  * [[https://webpack.kr/plugins/define-plugin/|DefinePlugin | 웹팩]]
  * 컴파일 타임에 전역 상수 설정값 반영. profile 별로 서로 다른 설정값 구성.


===== asset module =====
  * [[https://webpack.kr/guides/asset-modules/|Asset Modules | 웹팩]]
  * 애셋 모듈은 로더를 추가로 구성하지 않아도 애셋 파일(폰트, 아이콘 등)을 사용할 수 있도록 해주는 모듈입니다.


===== bundle size 최적화 =====
  * [[https://medium.com/@uk960214/%EC%84%B1%EB%8A%A5-%EC%B5%9C%EC%A0%81%ED%99%94-1-%EB%B2%88%EB%93%A4-%ED%81%AC%EA%B8%B0-%EC%A4%84%EC%9D%B4%EA%B8%B0-react-webpack-minify-code-splitting-e2391e7e5f1b|성능 최적화 1 — 번들 크기 줄이기 (React, Webpack, Minify, Code Splitting) | by Bling | Medium]]

===== 참조 =====
  * [[https://medium.com/little-big-programming/spa-%EC%B4%88%EA%B8%B0-%EB%A1%9C%EB%94%A9-%EC%86%8D%EB%8F%84-%EA%B0%9C%EC%84%A0%ED%95%98%EA%B8%B0-9db137d25566#.sn1dwq76o|SPA 초기 로딩 속도 개선하기 – little big programming – Medium]]
  * [[https://perfectacle.github.io/2017/04/20/webpack2-escape-relative-path-hell/|(Webpack 2) 상대경로 헬파티에서 탈출하기]]
  * [[https://medium.com/connect-the-dots/caching-assets-long-term-with-webpack-5ad24a4c39bd|Caching Assets Long Term with Webpack – Connect the Dots – Medium]]