2017-02-17 11 views
3

내 페이지 본문의 닫는 태그 바로 앞에 (</body>) CDN 스크립트를 배치했습니다. 구글의 PageSpeed ​​통계는 말한다 :PageSpeed는 외부 이미지를 사용할 때 "render-blocking"스크립트를 고발합니다.

제거 렌더링 차단 스크롤없이 볼 수있는 내용의 자바 스크립트와 CSS를
페이지가 1 개 블로킹 스크립트 자원을 가지고있다. 이로 인해 페이지 렌더링이 지연됩니다.

나는 나의 </body> 하지 지연 렌더링이 끝나기 전에 스크립트를 생각?

일부 시행 착오 끝에 내 페이지가 외부 이미지를 사용하기 때문에 이것이 발생했음을 발견했습니다. 아래 예제를 사용하면 PageSpeed에서 "렌더링 차단"스크립트를 감지 할 수 있습니다.

<body> 
    <img src="http://i.stack.imgur.com/oURrw.png" /> 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
</body> 

내 페이지를 렌더링 할 때 실제로 지연이 발생합니까?

+0

"[페이지에 3 개의 차단 스크립트 리소스가 있습니다 ..."* 오류가 있음을 증명하는 [mcve]를 넣고 질문에 마크 업을 넣을 수 있습니까? –

답변

0

IMHO Google의 PageSpeed는 일부 페이지 렌더링 시간을 차단하는 리소스를 참조해야합니다. b/c는 스크립트를 동 기적으로 실행하므로 이론적으로 페이지가로드되고 지연이 비동기로 실행되므로 그 이유는 없습니다. 지연 모드로로드되도록 변경 한 후에 불만을 제기하십시오. 정말 좋은 설명이 좋은 게시물을 확인할 수 있습니다 here.

+0

확인. 그러나 '지연 (defer)'을 추가하면 페이지 스피드 인사이트 (PageSpeed ​​Insights) 만 만족할뿐 실제로 ''이전에 스크립트를 만드는 것에 비해 이익이되는 것은 아닙니다. –

1

나는 스크립트가 내 </body> 끝나기 전에 렌더링을 지연시키지 않을 것이라고 생각 했습니까?

정확함.

...

나는 img을 제거하면 렌더링 차단 자바 스크립트 : 예를 들어

은 나를 위해,이 (이미지와 함께) 렌더링 차단 https://code.jquery.com/jquery-3.1.1.min.js에 대한 경고를 트리거 경고가 사라집니다.

버그로 신고하고 싶습니다. 그 스크립트에 대한 렌더링 블로킹 (render-blocking)이 보이지 않습니다. 심지어 img 고정 된 크기, overflow: nonediv 래핑 시도하고 여전히 오류가 있습니다. 왜 그 스크립트가 render-blocking인지 알 수 없다. 버그로보고하면 이유가 있습니다. 좋은 결과입니다. 하지만 버그 일 가능성이 높습니다.

+0

이 버그를보고 할 수있는 곳을 아십니까? –

+0

@RuudLenders : 아니, 아니,하지만 Google은 일을 공정하게 유지하는 데 꽤 능숙합니다. (때때로 가끔 쓰다듬어 야합니다.) –