Skip to content

Commit

Permalink
πŸ“ [#3] Core Web Vitals 아티클을 일뢀 μˆ˜μ •ν•œλ‹€
Browse files Browse the repository at this point in the history
  • Loading branch information
@hyoungqu23
hyoungqu23 committed Jan 29, 2024
1 parent 80af3a5 commit 2b7dd50
Showing 1 changed file with 3 additions and 11 deletions.
14 changes: 3 additions & 11 deletions contents/articles/core-web-vitals.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ title: Core Web Vitals
description: Core Web Vitals에 λŒ€ν•΄ μ•Œμ•„λ³΄κΈ°
createdAt: 2023-10-03
category: Next.js
thumbnail: '/images/articles/Core-Web-Vitals/LCP.png'
tags:
- Core Web Vitals
- Google Search Console
Expand All @@ -13,14 +14,7 @@ tags:
- CLS
---

# Core Web Vitals

<aside>
<img src="https://www.notion.so/icons/drafts_gray.svg" alt="https://www.notion.so/icons/drafts_gray.svg" width="40px" /> ***CONTENTS***

</aside>

# Intro
## Intro

1991λ…„ 8μ›” 6일에 곡개된 [World Wide Web ν”„λ‘œμ νŠΈμ— κ΄€ν•œ μ›Ή μ‚¬μ΄νŠΈ](http://info.cern.ch/hypertext/WWW/TheProject.html)λ₯Ό μ‹œμž‘μœΌλ‘œ, 2023λ…„ 1μ›” κΈ°μ€€μœΌλ‘œ, [μ „ 세계엔 μ•½ 11μ–΅ 3천만 개 μ΄μƒμ˜ μ›Ή μ‚¬μ΄νŠΈκ°€ μ‘΄μž¬ν•œλ‹€](https://siteefy.com/how-many-websites-are-there/)κ³  ν•œλ‹€. ν•˜μ§€λ§Œ, κ·Έ 쀑 λΉ„ν™œμ„±ν™”λœ λΉ„μœ¨μ€ μ•½ 82%둜, μ‹€μ œλ‘œ ν™œμ„±ν™”λœ μ›Ή μ‚¬μ΄νŠΈλŠ” μ•½ 2μ–΅ κ°œμ— λΆˆκ³Όν•˜λ‹€. κ²Œλ‹€κ°€ μ§€μ†μ μœΌλ‘œ μ—…λ°μ΄νŠΈκ°€ λ˜μ§€ μ•ŠλŠ” μ›Ή μ‚¬μ΄νŠΈλ₯Ό μ œμ™Έν•˜λ©΄ 더 적은 수의 μ›Ή μ‚¬μ΄νŠΈλ§Œ ν™œμ„±ν™”λ˜μ–΄ μžˆμ„ 것이라고 μΆ”μΈ‘ν•  수 μžˆλ‹€.

Expand Down Expand Up @@ -50,8 +44,6 @@ tags:
2. Search Engine Optimization κ°œμ„ ν•˜κΈ°
3. λͺ¨λ°”일 μΉœν™”μ μΈ μ›Ή μ‚¬μ΄νŠΈ λ§Œλ“€κΈ°

# Core Web Vitals

Googleμ—μ„œ μ›Ή μ‚¬μ΄νŠΈμ˜ μ‚¬μš©μž κ²½ν—˜μ„ μΈ‘μ •ν•˜λŠ” μ§€ν‘œλ‘œ, μ›Ή μ‚¬μ΄νŠΈ μ΄νƒˆ μ£Όμš” μš”μΈ 쀑 λ‘œλ”© 속도에 λŒ€ν•œ μ΄μŠˆλ‚˜ μ›Ή μ‚¬μ΄νŠΈμ˜ μ‹œκ°μ  μ•ˆμ •μ„±μ— λŒ€ν•œ 이슈λ₯Ό 확인할 수 μžˆλ‹€.

## Core Web Vitals μ΄ν•΄ν•˜κΈ°
Expand Down Expand Up @@ -79,7 +71,7 @@ Core Web Vitals에 λŒ€ν•΄ μ΄μ•ΌκΈ°ν•˜κΈ° 전에 κ·Έλ ‡λ‹€λ©΄, Web VitalsλŠ” 무

각각 λ‘œλ”© μ‹œκ°„, μƒν˜Έμž‘μš©, μ‹œκ°μ  μ•ˆμ •μ„±μ„ μœ„ν•œ μΈ‘μ • μ§€ν‘œμ΄λ‹€.

### LCP, Largest Contentful Paint
#### LCP, Largest Contentful Paint

일반적으둜 onLoad μ΄λ²€νŠΈλ‚˜ DOMContentLoaded μ΄λ²€νŠΈμ™€ 같은 과거의 μΈ‘μ • μ§€ν‘œλ“€μ€ μ‚¬μš©μžμ˜ μ‹€μ œ κ²½ν—˜κ³Ό μΌμΉ˜ν•˜μ§€ μ•ŠλŠ” κ²½μš°κ°€ μ‘΄μž¬ν•˜μ—¬ μ‚¬μš©μž κ²½ν—˜μ„ μΈ‘μ •ν•˜λŠ” 데에 λΆ€μ μ ˆν•œ 데이터이닀. λ˜ν•œ, 이전에 ν™œμš©λ˜μ—ˆλ˜ FCP(First Contentful Paint)λŠ” νŽ˜μ΄μ§€μ— λ‘œλ”© ν‘œμ‹œκΈ°μ™€ 같은 λŒ€μ²΄ 화면이 ν‘œμ‹œλ˜λŠ” 것을 μΈ‘μ •ν•˜κΈ° λ•Œλ¬Έμ— μ‚¬μš©μž κ²½ν—˜μ„ ν™•μΈν•˜κΈ°μ—λŠ” μ ν•©ν•˜μ§€ μ•Šλ‹€.

Expand Down

0 comments on commit 2b7dd50

Please sign in to comment.