Rendering on the Web

이 문서는 서버 렌더링, 정적 렌더링 및 클라이언트 측 렌더링을 포함한 다양한 웹 콘텐츠 렌더링 방법에 대해 포괄적인 개요를 제공합니다. 각 접근 방식과 관련된 고유한 트레이드오프와 성능 고려 사항을 강조하며, 희망하는 상호 작용 수준과 구축 중인 경험 유형과 일치하는 방식을 선택하는 중요성을 강조합니다. 예를 들어, 서버 렌더링은 제일 처음의 JavaScript 비용을 줄이고 응용 프로그램의 나머지에 더 많은 예산을 제공할 수 있지만, 서버에서 페이지를 생성하는 데 걸리는 시간으로 인해 더 느린 TTFB (첫 번째 바이트 시간)을 유발할 수 있습니다. 반면 정적 렌더링은 클라이언트 측 JS 양이 제한되어 있는 경우 빠른 First Paint, First Contentful Paint 및 Time to Interactive를 제공하지만, 고유한 페이지 수가 많거나 URL을 미리 예측할 수 없는 경우 도전적일 수 있습니다. JavaScript를 사용하여 브라우저에서 페이지를 직접 렌더링하는 클라이언트 측 렌더링은 최소한의 양과 타이트한 JavaScript 예산으로 수행되는 경우 순수 서버 렌더링의 성능에 근접할 수 있지만, 애플리케이션이 커질수록 필요한 JavaScript 양이 증가합니다. 또한 클라이언트 측 렌더링은 상호 작용이 거의 없는 경험의 경우 이상적이지 않을 수 있으며, 서버 렌더링은 더 확장 가능한 솔루션일 수 있습니다. 이 문서는 검색 엔진 크롤러에 렌더링 전략이 미치는 영향과 서버 렌더링을 사용하여 크롤러가 쉽게 해석할 수 있는 "완성된 모습"을 제공하는 이점을 포함한 SEO 고려 사항도 다룹니다. 스트리밍 서버 렌더링 및 점진적 재수분화와 같은 서버 및 클라이언트 측 렌더링을 결합하는 기술도 논의됩니다.