bundle-analyzer 결과물 파일

client.html

• 클라이언트 번들링 결과를 시각적으로 분석한 결과물

edge.html

• 서버에서만 필요한 모듈의 번들링 결과를 시각적으로 분석한 결과물

nodejs.html

• 서버 사이드 렌더링 시 필요한 모듈의 번들링 결과를 시각적으로 분석한 결과물

각 Size 의미

Stat Size

• 이것은 원본 소스 파일의 크기입니다. 즉, 어떠한 번들링이나 최적화를 적용하기 전의 파일 크기를 나타냅니다. 이 크기는 파일 시스템에서 파일의 크기를 직접 확인했을 때와 같은 값을 가지며, 개발자가 작성한 코드의 원래 크기를 반영합니다.

Parsed Size

• 이것은 Webpack이 모듈을 번들링하고 최적화한 후의 크기입니다. 이는 코드가 최소화되고, 불필요한 공백이 제거되고, 개발자가 작성한 코드가 브라우저에서 실행될 수 있는 형태로 변환된 결과물의 크기를 나타냅니다. 하지만 아직 압축되지 않은 상태의 크기입니다.

Gzipped Size

• 이것은 Parsed Size의 코드를 gzip 압축 알고리즘을 사용하여 압축한 후의 크기입니다. 이 크기는 실제로 웹을 통해 전송될 때의 크기에 가장 가깝습니다. 대부분의 웹 서버와 브라우저는 gzip 압축을 지원하므로, 이 측정치는 사용자가 실제로 다운로드해야 할 데이터의 양을 가장 잘 반영합니다.