게으른 부하 내장 YouTube 비디오

Arthur Corenzan이 생각한이 독창적 인 방법은 표준 YouTube Embeds보다 크게 개선됩니다. 사용자 상호 작용에 관계없이 상당한 리소스를로드하는 대신 YouTube embed에 연결된 작은 자리 표시 자 이미지를 사용합니다. 이미지를 클릭하면 비디오 재생이 매끄럽게 시작됩니다.

기능은 사실상 변하지 않습니다. 간단한 클릭은 지정된 공간에서 비디오를 재생합니다.

열쇠는<iframe></iframe> 태그의 srcdoc 속성. 이 속성을 사용하면 인라인 스타일과 유사하지만 전체 문서 용으로 전체 HTML 문서를 태그 내 직접 포함시킬 수 있습니다. 이 기술은 MailChimp 뉴스 레터와 같은 컨텐츠를 포함시키는 데 유용한 것으로 입증되었습니다.

Arthur는 IE 11 호환성 및 Adrian의 접근성 향상에 대한 Remy의 기여를 인정합니다.

의견에 대한 휴의 제안도 주목할 만하다. Chrome의 기본 Lazy Loading Support가 주어지면 loading="lazy" 추가하면 성능을 더욱 최적화하여 비디오가 뷰포트 외부에있는 경우 요청을 방지합니다.

시연은 다음과 같습니다.

독자 인 Tracey Rich는 명확성을 향상시키기 위해 유니 코드 재생 버튼 대신 ► 사용을 제안했습니다.

위 내용은 게으른 부하 내장 YouTube 비디오의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!