- Today
- Total
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- 모던 자바스크립트
- 백준 실버
- 알고리즘
- 에러처리
- 프론트엔드
- 이터러블
- React
- Java Script
- async
- 비동기
- 그림으로 배우는 http&network
- 백준
- 자바스크립트
- 상태관리
- get
- Angular
- git
- 네트워크
- html
- git error
- error
- http
- C++
- deep dive
- js
- JavaScript
- 웹
- map
- 모던 자바스크립트 deep dive
- es6
Archives
목록BLOB (1)
sharingStorage
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/1UHbp/btsLBrE51cN/5LEJJ89LAGIDitFGH0rUI0/img.png)
서론최근 성능에 대한 관심을 보이면서 몇몇 글모임의 상세페이지에서만 유독 좋지 않은 LCP지표를 보이고 있는 것을 확인하였습니다. 이것에 대한 원인을 유추하던 중 presigned url을 활용하여 서비스를 운영하며 10MB에 육박하는 대용량 이미지가 아무런 전처리나 최적화 작업 없이 S3에 업로드되었고 이것이 곧 LCP의 Load Time과 전체 Network 요청 리소스에 큰 영향을 주고있는 것을 확인하였습니다. 이러한 문제를 NEXT JS에서는 모든 이미지를 WebP로 변환하는 과정을 통해 이미지 최적화를 진행한다는 것에서 착안하여 업로드 과정에서 이미지 최적화를 진행하여 개선해보려고 합니다. 위에서 말씀드린 성능에 대해 조금 더 자세히 확인해보자면 아래와 같이 유독 LCP점수만 낮게 측정된 것을..
Front-End/성능개선
2025. 1. 1. 17:18