최적의 웹 페이지 렌더링 성능을 위해 JavaScript가 CSS보다 우선해야 합니까?

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

웹 페이지의. 이는 렌더링 스레드가 페이지를 렌더링하는 데 필요한 모든 스타일 정보를 갖게 되며 JavaScript 엔진은 계속하기 전에 포함된 모든 JavaScript를 구문 분석해야 하므로 페이지 렌더링이 지연된다는 추론에 의해 뒷받침됩니다.

그러나 실제 테스트에서는 다른 결과가 나타났습니다. JavaScript 인터프리터는 시작하기 전에 모든 CSS가 다운로드될 때까지 기다리는 것처럼 보입니다. 즉, JavaScript를 먼저 포함하면 JavaScript 스레드 시간을 보다 효율적으로 사용할 수 있습니다.

이에 대해 자세히 알아보려면 구체적인 예를 살펴보겠습니다. 다음 페이지 구조를 고려하세요.

  
    <title>test</title>
    <script type="text/javascript">
      var startTime = new Date();
    </script>
    <link href="http://10.0.0.50:8081/test.css?delay=500" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="http://10.0.0.50:8081/test2.js?delay=400&jsdelay=1000"></script>
  
  
    <p>
      Elapsed time is:
      <script type="text/javascript">
        document.write(new Date() - startTime);
      </script>
    </p>
  

CSS가 먼저 포함되면 페이지를 렌더링하는 데 1.5초가 걸립니다. JavaScript가 먼저 포함되면 페이지를 렌더링하는 데 1.4초가 걸립니다. 이 실험은 JavaScript의 우선순위를 지정하면 페이지 렌더링 속도가 더 빨라질 수 있음을 보여줍니다.

결론

실제 테스트에 따르면 CSS 포함을 JavaScript 포함 앞에 배치하는 것이 최신 브라우저의 성능에 적합하지 않을 수 있습니다. JavaScript를 먼저 포함하면 JavaScript 스레드가 작동하는 데 더 많은 시간을 제공하여 효율성이 향상되는 것으로 보입니다. 이는

문서의

위 내용은 최적의 웹 페이지 렌더링 성능을 위해 JavaScript가 CSS보다 우선해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!