Minification란? 🧐

소스코드를 최적화해야 하는 이유 🤔

• 네트워크를 통해 전송되는 리소스들의 양이 커지면 사용자들에게 전달되는 컨텐츠들의 도착시간이 길어짐
  → 최종적으로 사용자에게 전달되는 리소스들의 형태는 불필요한 요소들을 제거해준 최적화된 상태가 되어 있어야 함

소스코드를 최적화 시키는 법 🛠

Minify

동작

1. 어플리케이션이 동작하는 과정에 관여하지 않는 요소들 제거 → 용량 감소
   Ex. 주석, console.log

2. 표현 간결화
   Ex. 들여쓰기, 공백, 조건문을 삼항연산자로 표현 등

3. 표현 난독화

• 개발하는 과정에서 변수, 함수, 클래스의 이름같은 코드를 구성하는 요소들에 대한 것들을 알파벳 한 두글자로 모두 치환 → 용량 감소 + 보안성 강화
  Ex. uglyfy, mangling 등

동작 과정

1. 최소화, 난독화
2. 소스코드가 압축화된 상태로 나옴
3. 네트워크에 최적화된 리소스 전달
4. 최적화된 리소스들이 캐싱으로 저장됨
5. 사용자들이 어플리케이션을 사용할 때 마다 더 빠르게 어플리케이션 동작 가능

출처 📝

• Vue.js 압축 완성 올인원 패키지 Online - 패스트캠퍼스

위의 내용은 Webpack을 공부하며 개인적으로 정리한 내용입니다.
본문에 관련된 문제 사항이 있는 경우, 댓글로 남겨주시면 감사하겠습니다! 🙌