Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

불필요하게 큰 에셋 파일들 용량 줄임, 웹팩 #665

Merged
merged 6 commits into from
Sep 21, 2023
Merged

Conversation

Gilpop8663
Copy link
Collaborator

🔥 연관 이슈

close: #654

📝 작업 요약

  • svg 파일을 png 혹은 webp파일로 교체
  • webpack-bundle-analyzer 패키지 설치
  • 확인하려면 npm run build로 확인해야함 .

⏰ 소요 시간

1시간

🔎 작업 상세 설명

webpack-bundle-analyzer에서 Parsed, gzip 용량을 확인하려면 webpack-devServer을 이용하면 안되서 npm run build 명령어를 통해 확인할 수 있습니다

원래 번들 사이즈

image image image image

변경된 번들 사이즈

image image image image

🌟 논의 사항

gzip 적용하면 더 좋겠어요

Copy link
Member

@inyeong-kang inyeong-kang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

svg 이미지는 용량이 작을줄 알았는데.. 굉장한 발견이군요!👏👏
번들링 용량을 상당하게 줄이려면 ngnix가 빨리 되어야 할텐데..😂
그래도 react 관련된 것은 분리했으니까 초기 렌더링 속도는 살짝 개선될 수 있지 않을까 기대가 됩니다..!😀😀

splitChunks: {
cacheGroups: {
react: {
test: /[\\/]node_modules[\\/](react|react-dom)[\\/]/,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍👍 react 관련된 패키지만 따로 번들링해서 병렬적으로 처리하는 점이 좋네요!

@github-actions
Copy link

⚡️ Lighthouse report!

Category Score
🟠 Performance 74
🟠 Accessibilty 89
🟢 SEO 100
🟠 PWA 89
Category Score
🟢 First Contentful Paint 0.7 s
🟠 Largest Contentful Paint 2.8 s
🔴 Total Blocking Time 950 ms
🟢 Cumulative Layout Shift 0
🟢 Speed Index 2.5 s

Copy link
Collaborator

@chsua chsua left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍👍👍

@chsua chsua merged commit 57e51d1 into dev Sep 21, 2023
1 check passed
@woo-chang woo-chang deleted the feat/#654 branch September 21, 2023 01:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

번들 사이즈 크기 줄이기
3 participants