How Can PHP Embed Video or Slide Presentations in a Web Page Making the Page Load Faster Using Lazy Loading - PHP Embed Video package blog

What is Lazy Loading of Content from Other Sites Embedded in Your Pages

All pages have content that takes some time to be served by the Web server in the form of HTML pages. That content also takes some time to load and be rendered by your Web browser.

If a page has content from other sites like for instance YouTube Videos, that content is loaded using the HTML that may contain iframes or JavaScript that is loaded from those other sites.

Lazy loading is a technique to avoid slow page elements being loaded after the main content is loaded. 

Why Lazy Loading is Important When You Need to Embed Other Sites Content

The problem with slow page elements is that they may cause a significant delay to the load of the whole page and cause bad user experiences.

Nowadays the user experience of Web site pages is a ranking factor considered by search engines like Google.

If you have pages that provide bad user experiences during the page loading and rendering due to slow content, those pages will rank lower in Google search results.

If improve the page loading speed of the page's main content, those pages may rank higher than others of similar content. This way your Web pages may get more visitors that use Google to search for content like yours.

How You Can You Embed External Content Using Lazy Loading to Avoid Slowing Down Your Pages

The PHP Embed Video class can generate HTML for content from other sites that may be slow when it is loaded in the way those sites recommended in the past.

This package generates better HTML code to embed those page elements in a way that will not delay the loading and rendering of the main content.

It uses HTML tag attributes like loading="lazy" or alternative ways to load remote site content using iframes that ask the user to click on the content page containers, so the remote site content is not loaded immediately.

Here is some commented example code extracted from this package example script test_video_details.php that can show details of YouTube video and also displays a video on a Web page.

Set the video page URL.

$url = 'https://www.youtube.com/watch?v=UZe7hcbNlXY';

Set the embed_video_class variables with values for the width and height of the page element where the video will appear.

$video = new embed_video_class;
$video->width = '560px';
$video->height = '315px';

Set the lazy load flag variable to true to make the class generate HTML code that will delay the loading of iframes and make the content be loaded after the user clicks on the content element.

$video->lazy_load = true;

Set the youtube_key variable with a value obtained from the Google API console following instructions from the Google YouTube Data API.

$video->youtube_key = ''; $application_line = __LINE__;
if($video->youtube_key === '')
{
	echo '<h1>You need to set the YouTube API Key in line ', $application_line, '.</h1>', "\n";
	echo '<p>', 'Please go to ',
		'<a href="https://console.developers.google.com/project">Google Developer API Console</a>,'.
		' get a key for the YouTube API'.'
		and set it in the line '.$application_line, '</p>';
}
else
{

Call the GetVideoDetails function to get details for a given video passing its URL in the remote site. This function will return several types of video details including the HTML code to embed the video on your Web site pages using lazy loading.

	if($video->GetVideoDetails($url, '', $details))
	{
		$tags = $video->GetVideo(0, true, $details['title'], $url);
		echo '<h1>Details for video: ', $url, '</h1>', "\n";
		echo '<pre>';
		print_r($details);
		echo '</pre>';
		echo '<div align="center">'.$tags.'</div>';
		echo '<div align="center"><pre style="width: 40em; border-style: solid; border-width: 1px; text-align: left; white-space: pre-wrap; word-wrap: break-word;">'.htmlspecialchars($tags), '</pre></div>';
	}
	else
		echo '<h1>Error: ', HtmlSpecialChars($video->error), '</h1>', "\n";
}

Here you can find a screenshot of the output of the example script that contains the code shown above.

How Can You Download or Install the PHP Embed Video Package to Using PHP Composer

This package can be obtained in two ways. You can use the PHP Composer tool to install the package from the PHP Classes site Composer repository.

In this case, the Composer tool will also install several other packages that this package needs to work. You can find instructions to install this package using the Composer tool by going to the package page Download tab.

You can also use the traditional way of downloading the package files in a tar.gz or zip archive. In this case, you also need to download dependency packages.

In the package page Download tab, you can also find links to the needed package pages. If you go to those package pages, you can also find the download links for those packages.