Reply To: Youtube embed deffer loading

• John Huebner

• June 4, 2020 at 11:24 pm

Add this filter to functions.php. It removes the src attribute value and add a data-src-defer

	
	// defer loading of videos
	function defer_video_src_to_data($data, $url, $args) {
		$data = preg_replace('/(src="([^\"\']+)")/', 'src="" data-src-defer="$2"', $data);
		return $data;
	} // end function defer_video_src_to_data
	add_filter('oembed_result', 'defer_video_src_to_data', 99, 3);
	add_filter('embed_oembed_html', 'defer_video_src_to_data', 99, 3);

then add this javascript to your site which resets the src value after the page is loaded

	
	// load defered videos
	(function($){
		$(window).load(function(e) {
			$('[data-src-defer]').each(function(index, element) {
				$(element).attr('src', $(element).attr('data-src-defer'));
			});
		});
	})(jQuery);