[FE] FIX: 라이트하우스 성능 개선 #1687

[jnkeniaem]

해당 사항 (중복 선택)

• FEAT : 새로운 기능 추가 및 개선
• FIX : 기존 기능 수정 및 정상 동작을 위한 간단한 추가, 수정사항
• BUG : 버그 수정
• REFACTOR : 결과의 변경 없이 코드의 구조를 재조정
• TEST : 테스트 코드 추가
• DOCS : 코드가 아닌 문서를 수정한 경우
• REMOVE : 파일을 삭제하는 작업만 수행
• RENAME : 파일 또는 폴더명을 수정하거나 위치(경로)를 변경
• ETC : 이외에 다른 경우 - 어떠한 사항인지 작성해주세요.

설명

HOME

Eliminate render-blocking resources - Potential savings of 280 ms

• first paint를 지연시키는 리소스들을 defer속성을 사용하기

Avoid large layout shifts - 1 layout shift found

• 홈 페이지 접속시 로딩 애니메이션이 움직이지 않게 위치 고정

Serve images in next-gen formats

• Coin image를 png형식이 아니라 svg로 가져오기

폰트 전체를 import 하는 대신 필요한 부분만 import

• 384kb 에서 72.5kb 로 80% 이상 크기 최적화

#1687

설명 링크

https://www.notion.so/hyunja/Chrome-Lighthouse-7e66955ceaed42098b5ce8111273439d