[오타 및 어법 교정] 중요 렌더링 경로(CRP) 페이지

[inseong01]

MDN URL

https://developer.mozilla.org/ko/docs/Web/Performance/Critical_rendering_path

이 문제에 관한 특정 섹션 또는 제목은 무엇인가요?

중요 렌더링 경로

어떤 정보가 부정확하거나 도움이 되지 않거나 불완전했나요?

오타 및 어법 교정

어떻게 고쳐져야 하나요?

중요 렌더링 경로 최적화는 첫번째 렌더링의 시간을 개선시킵니다.

중요 렌더링 경로 최적화는 첫번째 렌더링 시간을 개선시킵니다. (어법 교정)

불러온 에셋을 다룰 때까지 나머지 HTML을 분석하는 작업하는 일부 요청은 중단되며 차단됩니다. 브라우저는 CSS 오브젝트 모델을 구축하는 작업이 끝날때까지 요청을 만들고 DOM을 생성하는 HTML을 계속해서 분석합니다. DOM과 CSSOM이 완료되면 브라우저는 렌더 트리를 생성하고 보여지는 컨텐츠를 위해 스타일을 계산합니다.

불러온 에셋을 다룰 때까지 HTML을 분석하는 요청은 중단되며 차단됩니다. 브라우저는 CSS 오브젝트 모델을 구축하는 작업이 끝날 때까지 요청을 만들고 DOM을 생성하는 HTML을 계속해서 분석합니다. DOM과 CSSOM이 생성되면 브라우저는 렌더 트리를 생성하고 화면에 보여지는 컨텐츠를 위해 스타일을 계산합니다. (중복 의미 축약, 목적 설명 구체화)

많은 수의 노드는 중요 렌더링 경로에서 다음의 이벤트를 더 오래 발생시킬 것입니다. 측정하세요! 몇 개의 추가 노드는 차이를 만들지 않지만 전염은 버벅거림을 유발할 수 있습니다.

수 많은 노드는 중요 렌더링 경로(CRP)가 더 오래 걸리도록 만듭니다. 측정해보세요! 몇 개의 노드는 성능 차이를 만들지 않지만 수 많은 노드는 성능에 영향을 미칠 수 있다는 것을 명심하세요. (원문 반영)

브라우저는 모든 CSS를 처리하고 수신할때까지 페이지 렌더링을 막습니다. CSS는 규칙을 덮어쓸수 있기 때문에 렌더링을 막습니다. 그러므로 CSSOM이 완료될때까지 콘텐츠를 렌더링 할 수 없습니다.

브라우저는 모든 CSS를 처리하고 수신할 때까지 페이지 렌더링을 제한합니다. CSS는 규칙을 덮어쓸 수 있기 때문에 렌더링을 제한합니다. 그러므로 CSSOM이 완료될 때까지 콘텐츠를 렌더링 할 수 없습니다. (어법 교정)

첫번째는 측정입니다. 필요할때 최적화하세요. 특정 짓는 것은 쉬운 일이 아닙니다.

첫 번째는 측정입니다. 필요할 때 최적화하세요. (띄어쓰기)

렌터 트리는 콘텐츠와 스타일 둘다 캡쳐합니다. DOM과 CSSOM 트리는 렌더 트리에 결합됩니다. 렌더 트리를 구성하기 위해 브라우저는 DOM 트리의 root에서 시작해 모든 노드는 확인하면서 어떤 CSS 규칙들을 첨부할지 결정합니다.

렌터 트리는 콘텐츠와 스타일 둘 다 캡쳐합니다. DOM과 CSSOM 트리는 렌더 트리에 결합됩니다. 렌더 트리를 구성하기 위해 브라우저는 DOM 트리의 root에서 시작해 모든 노드를 확인하면서 어떤 CSS 규칙을 첨부할지 결정합니다. (띄어쓰기 오타 교정)

이 태그 없다면, 브라우저는 뷰포트 기본값을 사용합니다. 브라우저의 full screen 기본값은 일반적으로 960px 입니다. 기본적으로 브라우저의 full screen에서, 스마트폰의 브라우저와 같은 너비는 로 세팅함으로써 기본 뷰포트 너비 대신에 디바이스의 너비를 사용합니다. 디바이스 너비는 사용자가 디바이스를 가로(landscape) 또는 세로(portrait) 모드 사이로 돌릴때마다 바뀝니다. 레이아웃은 디바이스가 회전하거나 브라우저의 사이즈가 조정될 때마다 발생합니다.

이 태그가 없다면, 브라우저는 뷰포트 기본값을 사용합니다. 브라우저의 full screen 기본값은 일반적으로 960px 입니다. 기본적으로 브라우저의 full screen에서, 스마트폰의 브라우저와 같은 너비는 로 세팅함으로써 기본 뷰포트 너비 대신에 디바이스의 너비를 사용합니다. 디바이스 너비는 사용자가 디바이스를 가로(landscape) 또는 세로(portrait) 모드로 돌릴 때마다 변경됩니다. 레이아웃은 디바이스가 회전하거나 브라우저의 사이즈가 변경될 때마다 발생합니다. (어법 교정)

일단 렌더 트리가 생성되고 레이아웃이 나타나기 시작하면, 화면에 픽셀을 그릴수 있습니다.

일단 렌더 트리가 생성되고 레이아웃이 나타나기 시작하면, 화면에 픽셀을 그릴 수 있습니다. (띄어쓰기)

지원 링크, 참조 또는 인용구가 있으신가요?

No response

더 공유하고 싶은게 있으신가요?

No response

MDN metadata

Page report details

• Folder: ko/web/performance/critical_rendering_path
• MDN URL: https://developer.mozilla.org/ko/docs/Web/Performance/Critical_rendering_path
• GitHub URL: https://github.com/mdn/translated-content/blob/main/files/ko/web/performance/critical_rendering_path/index.md
• Last commit: 09754a6
• Document last modified: 2024-12-17T09:16:59.000Z

[wisedog]

@inseong01 님 제보해주셔서 감사합니다.

작업 진행되면 알려드리겠습니다. 아니면 직접 PR을 생성해주셔도 좋습니다.