지역 사회 배우다 도구 라이브러리 여가
찾다
한국어
집 > 웹 프론트엔드 > CSS 튜토리얼 > 본문

CSS는 HTML에서 항상 JavaScript보다 우선해야 합니까?

Patricia Arquette
풀어 주다： 2024-11-24 19:06:17
원래의
717명이 탐색했습니다.

Should CSS Always Precede JavaScript in HTML?

CSS가 항상 JavaScript보다 우선해야 합니까?

통상적인 지혜:

다음과 같은 이유로 오랫동안 JavaScript보다 CSS를 배치하는 것이 일반적인 권장 사항이었습니다.

  • 렌더링 스레드에는 다음이 필요합니다. 페이지의 모든 스타일 정보를 렌더링합니다.
  • 이전에 JavaScript가 포함된 경우 JavaScript 엔진은 다음 리소스 세트를 계속 진행하기 전에 모든 것을 구문 분석해야 합니다.
  • 이는 렌더링 스레드에 필요한 모든 스타일이 없기 때문에 페이지를 완전히 표시할 수 없음을 의미합니다.

실제 테스트:

그러나 실제 테스트에서는 매우 다른 결과가 나타났습니다.

  • JavaScript가 실행되지 않습니다. CSS가 다운로드됩니다.
  • 따라서 자바스크립트 스레드를 더 오래 실행할 수 있기 때문에 자바스크립트를 앞에 포함시키는 것이 더 효율적인 것 같습니다.

결론:

  • 데스크톱 브라우저의 경우: 최신 브라우저에서는 JavaScript 앞에 CSS를 두세요 성능 개선을 가져옵니다. 어떤 경우에는 성능 저하를 초래할 수도 있습니다(예: CSS가 지연되는 경우). 따라서 JavaScript** 뒤에 외부 스타일시트 **를 연결해야 합니다.
  • 모바일 브라우저의 경우: 증거에 따르면 일부 모바일 브라우저(예: Android용 WebKit)는 여전히 예측 구문 분석을 수행하지 않습니다. 이러한 브라우저에서는 CSS 앞에 스크립트를 배치하면 성능이 저하될 수 있습니다.

기술적 설명: