#Webpack

lodash 하나 import했을 뿐인데 번들에 전체 라이브러리가 들어갔다. Tree Shaking이 제대로 작동하게 만드는 법을 정리했다.

번들 크기가 2MB를 넘어가면서 초기 로딩이 5초나 걸렸다. Lazy Loading과 Code Splitting으로 필요한 코드만 불러오니 2초로 줄었다.

기능 추가할 때마다 늘어나는 번들 사이즈, 그대로 두면 사용자는 떠납니다. Code Splitting, Tree Shaking, Dynamic Import로 JS 다이어트하는 실제 기법.

개발 중에 코드를 수정했는데 브라우저가 반응이 없나요? 새로고침을 백만 번 하다가 지쳐서 찾아낸 HMR(Hot Module Replacement)의 원리와 고장 원인, 그리고 해결 방법을 '노가다 개발자'의 시선으로 정리했습니다.