Include remaining tags/attributes for lazy loading (#7636)

* Include remaining tags/attributes for lazy loading

* Suggested change
This commit is contained in:
Inverle
2025-06-03 00:14:50 +02:00
committed by GitHub
parent 58a264db40
commit dd5ea7ab4e
2 changed files with 18 additions and 6 deletions

View File

@@ -368,7 +368,11 @@ function customSimplePie(array $attributes = [], array $curl_options = []): \Sim
'iframe' => 'src',
'img' => [
'longdesc',
'src'
'src',
],
'image' => [
'longdesc',
'src',
],
'input' => 'src',
'ins' => 'cite',
@@ -632,16 +636,20 @@ function validateEmailAddress(string $email): bool {
/**
* Add support of image lazy loading
* Move content from src attribute to data-original
* Move content from src/poster attribute to data-original
* @param string $content is the text we want to parse
*/
function lazyimg(string $content): string {
return preg_replace([
'/<((?:img|iframe)[^>]+?)src="([^"]+)"([^>]*)>/i',
"/<((?:img|iframe)[^>]+?)src='([^']+)'([^>]*)>/i",
'/<((?:img|image|iframe)[^>]+?)src="([^"]+)"([^>]*)>/i',
"/<((?:img|image|iframe)[^>]+?)src='([^']+)'([^>]*)>/i",
'/<((?:video)[^>]+?)poster="([^"]+)"([^>]*)>/i',
"/<((?:video)[^>]+?)poster='([^']+)'([^>]*)>/i",
], [
'<$1src="' . Minz_Url::display('/themes/icons/grey.gif') . '" data-original="$2"$3>',
"<$1src='" . Minz_Url::display('/themes/icons/grey.gif') . "' data-original='$2'$3>",
'<$1poster="' . Minz_Url::display('/themes/icons/grey.gif') . '" data-original="$2"$3>',
"<$1poster='" . Minz_Url::display('/themes/icons/grey.gif') . "' data-original='$2'$3>",
],
$content
) ?? '';

View File

@@ -431,8 +431,12 @@ const freshrssOpenArticleEvent = document.createEvent('Event');
freshrssOpenArticleEvent.initEvent('freshrss:openArticle', true, true);
function loadLazyImages(rootElement) {
rootElement.querySelectorAll('img[data-original], iframe[data-original]').forEach(function (el) {
el.src = el.getAttribute('data-original');
rootElement.querySelectorAll('img[data-original], iframe[data-original], video[data-original]').forEach(function (el) {
if (el.tagName === 'VIDEO') {
el.poster = el.getAttribute('data-original');
} else {
el.src = el.getAttribute('data-original');
}
el.removeAttribute('data-original');
});
}