Skip to content

Commit

Permalink
Fetch. new blog posts
Browse files Browse the repository at this point in the history
  • Loading branch information
singhic committed Nov 26, 2024
1 parent b43db10 commit 6a03296
Showing 1 changed file with 10 additions and 9 deletions.
19 changes: 10 additions & 9 deletions blog/puleugo/puleugo8.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,12 @@ date: Sun, 17 Nov 2024 21:44:55 +0900

## 개요

| | |
| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **문제** | Waktaverse.games 사이트의 이미지 로딩 속도가 느려 사용자 경험에 부정적 영향을 미치고 있었습니다.특히 네트워크가 느린 환경에서는 LCP(Largest Contentful Paint) 시간이 권장사항인 2.5를 초과하여, Fast 4G 환경에서는 4.88초, Slow 4G 환경에서는 28.54초가 소요됐습니다. |
| **해결방안** | 이미지 로딩 성능을 개선하기 위해 Cloudflare를 활용하여 다음과 같은 조치를 취했습니다. WebP 형식으로 압축된 이미지 캐시를 응답했으며 페이지 새로고침 시 서버로 재요청하는 문제를 해결하기 위해 Cache-Control 헤더를 추가했습니다.개선 결과:<ul style={{ listStyleType: "disc" }} data-ke-list-type="disc"><li>Fast 4G 환경: 5.88초 &rarr; 2.39초 (약 59.35% 개선)</li><li>Slow 4G 환경: 28.54초 &rarr; 8.24초 (약 71.13% 개선) </li></ul> |
|||
|---|---|
|**문제**|Waktaverse.games 사이트의 이미지 로딩 속도가 느려 사용자 경험에 부정적 영향을 미치고 있었습니다.특히 네트워크가 느린 환경에서는 LCP(Largest Contentful Paint) 시간이 권장사항인 2.5를 초과하여, Fast 4G 환경에서는 4.88초, Slow 4G 환경에서는 28.54초가 소요됐습니다.|
|**해결방안**|이미지 로딩 성능을 개선하기 위해 Cloudflare를 활용하여 다음과 같은 조치를 취했습니다. WebP 형식으로 압축된 이미지 캐시를 응답했으며 페이지 새로고침 시 서버로 재요청하는 문제를 해결하기 위해 Cache-Control 헤더를 추가했습니다.개선 결과:<ul style="list-style-type: disc;" data-ke-list-type="disc"><li>Fast 4G 환경: 5.88초 &rarr; 2.39초 (약 59.35% 개선)</li><li>Slow 4G 환경: 28.54초 &rarr; 8.24초 (약 71.13% 개선) </li></ul>|

- [waktaverse.games](https://waktaverse.games/) 웹 사이트의 이미지 로드 성능 개선을 수행했다.
* [waktaverse.games](https://waktaverse.games/) 웹 사이트의 이미지 로드 성능 개선을 수행했다.

## 너무 느려요. 개선해주세요.

Expand All @@ -32,8 +32,8 @@ Chrome Browser의 Performance 기능을 활용하여 성능을 측정해보았

LCP(가장 큰 콘텐츠 페인트) 소요 시간을 측정했다.

- Fast 4G: 5.88s
- Slow 4G: 28.54s
* Fast 4G: 5.88s
* Slow 4G: 28.54s

참고로 2.5초 이하가 GOOD이다.

Expand Down Expand Up @@ -69,8 +69,9 @@ Cache-Control은 이미 수신한 리소스의 유효 시간이 지나기 전이

Fast 4G: 2.39 s, Slow 4G: 8.24 s

- Fast 4G: 5.88s &rarr; 2.39s (59.35%)
- Slow 4G: 28.54s &rarr; 8.24s (71.13%)
* Fast 4G: 5.88s &rarr; 2.39s (59.35%)
* Slow 4G: 28.54s &rarr; 8.24s (71.13%)

'어떻게 해야겠다'는 명확했습니다.
Cloudflare가 이렇게 편한줄 알았더라면 훨씬 더 빠르게 작업에 들어갈걸 그랬습니다.

0 comments on commit 6a03296

Please sign in to comment.