nanhaoluo/argon-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 移除 lazyload 插件，改用浏览器原生懒加载

Browse Source
This commit is contained in:
nanhaoluo
2026-01-12 15:17:52 +08:00
parent e604c8ed4c
commit e1039dcee4
9 changed files with 22 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
argontheme.js
View File

@@ -1425,7 +1425,7 @@ if (argonConfig.waterflow_columns != "1") {
timeout: 5000
});
//插入新评论
result.html = result.html.replace(/<img class='comment-sticker lazyload'(.*?)\/>/g, "").replace(/<(\/).noscript>/g, "");
result.html = result.html.replace(/<(\/).noscript>/g, "");
let parentID = result.parentID;
if (parentID == "" || parentID == null){
parentID = 0;
@@ -1611,7 +1611,7 @@ if (argonConfig.waterflow_columns != "1") {
}
//发送成功，替换原评论
result.new_comment = result.new_comment.replace(/<img class='comment-sticker lazyload'(.*?)\/>/g, "").replace(/<(\/).noscript>/g, "");
result.new_comment = result.new_comment.replace(/<(\/).noscript>/g, "");
$("#comment-" + editID + " .comment-item-text").html(result.new_comment);
$("#comment-" + editID + " .comment-item-source").html(result.new_comment_source);
if ($("#comment-" + editID + " .comment-info .comment-edited").length == 0){
@@ -1857,20 +1857,16 @@ $(document).on("click" , ".comment-upvote" , function(){
});
/*评论表情面板*/
function lazyloadStickers(){
if (typeof $.fn.lazyload !== 'function') return;
$(".emotion-keyboard .emotion-group:not(d-none) .emotion-item > img.lazyload").lazyload({threshold: 500, effect: "fadeIn"}).removeClass("lazyload");
$("html").trigger("scroll");
// 原生懒加载无需额外处理
}
$(document).on("click" , "#comment_emotion_btn" , function(){
$("#comment_emotion_btn").toggleClass("comment-emotion-keyboard-open");
lazyloadStickers();
});
$(document).on("click" , ".emotion-keyboard .emotion-group-name" , function(){
$(".emotion-keyboard .emotion-group-name.active").removeClass("active");
$(this).addClass("active");
$(".emotion-keyboard .emotion-group:not(d-none)").addClass("d-none");
$(".emotion-keyboard .emotion-group[index='" + $(this).attr("index") + "']").removeClass("d-none");
lazyloadStickers();
});
function inputInsertText(text, input){
$(input).focus();
@@ -2043,9 +2039,6 @@ $(document).on("submit" , ".post-password-form" , function(){
foldLongComments();
calcHumanTimesOnPage();
panguInit();
if (typeof $.fn.lazyload === 'function') {
$(".comment-item-text .comment-sticker.lazyload").lazyload(argonConfig.lazyload).removeClass("lazyload");
}
},
error : function(){
window.location.href = url;
@@ -2077,9 +2070,6 @@ $(document).on("submit" , ".post-password-form" , function(){
foldLongComments();
calcHumanTimesOnPage();
panguInit();
if (typeof $.fn.lazyload === 'function') {
$(".comment-item-text .comment-sticker.lazyload").lazyload(argonConfig.lazyload).removeClass("lazyload");
}
},
error : function(){
window.location.href = url;
@@ -2179,76 +2169,10 @@ $.fancybox.defaults.i18n = {
}
};
/*Lazyload*/
/*Lazyload - 已改用浏览器原生 loading="lazy"*/
function lazyloadInit(){
if (argonConfig.lazyload == false){
return;
}
// 检查 lazyload 插件是否已加载
if (typeof $.fn.lazyload !== 'function') {
// 插件未加载，延迟重试
setTimeout(lazyloadInit, 100);
return;
}
var lazyloadEffect = argonConfig.lazyload.effect;
if (lazyloadEffect == "none"){
lazyloadEffect = undefined;
}
// 文章内图片和相关文章缩略图
$("article img.lazyload:not(.lazyload-loaded) , .related-post-thumbnail.lazyload:not(.lazyload-loaded) , .shuoshuo-preview-container img.lazyload:not(.lazyload-loaded)").lazyload({
threshold: argonConfig.lazyload.threshold,
effect: lazyloadEffect,
load: function () {
$(this).addClass("lazyload-loaded");
$(this).parent().removeClass("lazyload-container-unload");
}
});
// 文章特色图片 - 确保加载后显示
$(".post-thumbnail.lazyload:not(.lazyload-loaded)").each(function() {
var $img = $(this);
var originalSrc = $img.attr("data-original");
if (originalSrc) {
// 创建一个新图片对象来预加载
var img = new Image();
img.onload = function() {
$img.attr("src", originalSrc);
$img.addClass("lazyload-loaded");
$img.css("opacity", "1");
$img.parent().removeClass("lazyload-container-unload");
waterflowInit();
};
img.onerror = function() {
// 图片加载失败，隐藏图片容器
$img.closest(".post-header-with-thumbnail").removeClass("post-header-with-thumbnail");
$img.remove();
waterflowInit();
};
img.src = originalSrc;
}
});
// 也保留原有的 lazyload 调用作为备用
$(".post-thumbnail.lazyload:not(.lazyload-loaded)").lazyload({
threshold: argonConfig.lazyload.threshold,
effect: lazyloadEffect,
load: function () {
$(this).addClass("lazyload-loaded");
$(this).css("opacity", "1");
$(this).parent().removeClass("lazyload-container-unload");
waterflowInit();
}
});
$(".comment-item-text .comment-sticker.lazyload").lazyload({
threshold: argonConfig.lazyload.threshold,
effect: lazyloadEffect,
load: function(){
$(this).removeClass("lazyload");
}
});
// 原生懒加载无需 JS 初始化
// 保留此函数以兼容可能的外部调用
}
lazyloadInit();

26
functions.php
View File

@@ -989,7 +989,7 @@ function argon_get_comment_text($comment_ID = 0, $args = array()) {
if (!isset($emotion['src']) || mb_strlen($emotion['src']) == 0){
continue;
}
$comment_text = str_replace(':' . $emotion['code'] . ':', "<img class='comment-sticker lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='" . $emotion['src'] . "'/><noscript><img class='comment-sticker' src='" . $emotion['src'] . "'/></noscript>", $comment_text);
$comment_text = str_replace(':' . $emotion['code'] . ':', "<img class='comment-sticker' src='" . $emotion['src'] . "' loading='lazy'/>", $comment_text);
}
}
}
@@ -2262,35 +2262,23 @@ function get_banner_background_url(){
return $url;
}
}
//Lazyload 对 <img> 标签预处理以加载 Lazyload
//原生懒加载：对 <img> 标签添加 loading="lazy" 属性
function argon_lazyload($content){
$lazyload_loading_style = get_option('argon_lazyload_loading_style');
if ($lazyload_loading_style == ''){
$lazyload_loading_style = 'none';
}
$lazyload_loading_style = "lazyload-style-" . $lazyload_loading_style;
if(!is_feed() && !is_robots() && !is_home()){
$content = preg_replace('/<img(.*?)src=[\'"](.*?)[\'"](.*?)((\/>)|(<\/img>))/i',"<img class=\"lazyload " . $lazyload_loading_style . "\" src=\"data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+\" \$1data-original=\"\$2\" src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC\"\$3$4" , $content);
$content = preg_replace('/<img(.*?)data-full-url=[\'"]([^\'"]+)[\'"](.*)>/i',"<img$1data-full-url=\"$2\" data-original=\"$2\"$3>" , $content);
$content = preg_replace('/<img(.*?)srcset=[\'"](.*?)[\'"](.*?)>/i',"<img$1$3>" , $content);
// 为没有 loading 属性的图片添加 loading="lazy"
$content = preg_replace('/<img((?!loading=)[^>]*)>/i', '<img$1 loading="lazy">', $content);
}
return $content;
}
function argon_fancybox($content){
if(!is_feed() && !is_robots() && !is_home()){
if (get_option('argon_enable_lazyload') != 'false'){
$content = preg_replace('/<img(.*?)data-original=[\'"](.*?)[\'"](.*?)((\/>)|>|(<\/img>))/i',"<div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='$2'>$0</div>" , $content);
}else{
$content = preg_replace('/<img(.*?)src=[\'"](.*?)[\'"](.*?)((\/>)|>|(<\/img>))/i',"<div class='fancybox-wrapper' data-fancybox='post-images' href='$2'>$0</div>" , $content);
}
$content = preg_replace('/<img(.*?)src=[\'"](.*?)[\'"](.*?)((\/>)|>|(<\/img>))/i',"<div class='fancybox-wrapper' data-fancybox='post-images' href='$2'>$0</div>" , $content);
}
return $content;
}
function the_content_filter($content){
if (get_option('argon_enable_lazyload') != 'false'){
$content = argon_lazyload($content);
}
// 始终使用原生懒加载
$content = argon_lazyload($content);
if (get_option('argon_enable_fancybox') != 'false' && get_option('argon_enable_zoomify') == 'false'){
$content = argon_fancybox($content);
}

17
header.php
View File

@@ -333,21 +333,8 @@
pangu: "<?php echo get_option('argon_enable_pangu', 'false'); ?>",
<?php if (get_option('argon_enable_lazyload') != 'false'){ ?>
lazyload: {
threshold: <?php echo get_option('argon_lazyload_threshold', 800); ?>,
effect: "<?php echo get_option('argon_lazyload_effect', 'fadeIn'); ?>"
},
<?php } else { ?>
lazyload: false,
<?php } ?>
// 原生懒加载已启用，无需 JS lazyload 配置
lazyload: false,
fold_long_comments: <?php echo get_option('argon_fold_long_comments', 'false'); ?>,

2
single.php
View File

@@ -185,7 +185,7 @@
if ($hasThumbnail){
echo '<img class="related-post-thumbnail lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABBJREFUeNpi+P//PwNAgAEACPwC/tuiTRYAAAAASUVORK5CYII=" data-original="' . argon_get_post_thumbnail(get_the_ID()) . '"/>';
echo '<img class="related-post-thumbnail" src="' . argon_get_post_thumbnail(get_the_ID()) . '" loading="lazy"/>';
}

11
style.css
View File

@@ -4096,16 +4096,9 @@ html.filter-grayscale {
}
.post-thumbnail.lazyload {
/* 图片加载过渡效果 */
.post-thumbnail {
transition: opacity 0.3s ease 0s;
}
.post-thumbnail.lazyload.lazyload-loaded {
opacity: 1 !important;
}
.single .post-thumbnail,

10
template-parts/content-preview-1.php
View File

@@ -8,15 +8,7 @@
$thumbnail_url = argon_get_post_thumbnail();
if (get_option('argon_enable_lazyload') != 'false'){
echo "<img class='post-thumbnail lazyload' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABBJREFUeNpi+P//PwNAgAEACPwC/tuiTRYAAAAASUVORK5CYII=' data-original='" . $thumbnail_url . "' alt='thumbnail' style='opacity: 0;'></img>";
}else{
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
}
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "' alt='thumbnail' loading='lazy'>";
echo "<div class='post-header-text-container'>";

10
template-parts/content-preview-2.php
View File

@@ -8,15 +8,7 @@
$thumbnail_url = argon_get_post_thumbnail();
if (get_option('argon_enable_lazyload') != 'false'){
echo "<img class='post-thumbnail lazyload' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABBJREFUeNpi+P//PwNAgAEACPwC/tuiTRYAAAAASUVORK5CYII=' data-original='" . $thumbnail_url . "' alt='thumbnail' style='opacity: 0;'></img>";
}else{
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
}
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "' alt='thumbnail' loading='lazy'>";
}

10
template-parts/content-preview-3.php
View File

@@ -8,15 +8,7 @@
$thumbnail_url = argon_get_post_thumbnail();
if (get_option('argon_enable_lazyload') != 'false'){
echo "<img class='post-thumbnail lazyload' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABBJREFUeNpi+P//PwNAgAEACPwC/tuiTRYAAAAASUVORK5CYII=' data-original='" . $thumbnail_url . "' alt='thumbnail' style='opacity: 0;'></img>";
}else{
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "'></img>";
}
echo "<img class='post-thumbnail' src='" . $thumbnail_url . "' alt='thumbnail' loading='lazy'>";
echo "</header>";

2
template-parts/emotion-keyboard.php
View File

@@ -21,7 +21,7 @@
echo "<div class='emotion-item' text='" . esc_attr($emotion['text']) . "' title='" . esc_attr($title) . "'>" . esc_html($emotion['text']) . "</div>";
}
if ($emotion['type'] == 'sticker'){
echo "<div class='emotion-item emotion-item-sticker' code='" . $emotion['code'] . "' title='" . esc_attr($title) . "'><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='" . $emotion['src'] . "'/></div>";
echo "<div class='emotion-item emotion-item-sticker' code='" . $emotion['code'] . "' title='" . esc_attr($title) . "'><img src='" . $emotion['src'] . "' loading='lazy'/></div>";
}
}
if (isset($group['description'])){