优化加载卡顿问题,最稳定版本

This commit is contained in:
Vaica committed 2026-06-02 16:26:38 +08:00
1 parent fadefdc0a1
commit 8c1ee075e8
3 files changed
+71 -111

No files matched your search

+24 -30
View File
@@ -3504,66 +3504,60 @@ input[type=submit] {
/* GenericOutput */ [data-theme="dark"] .chroma .go { color:#44475a } /* GenericOutput */ [data-theme="dark"] .chroma .go { color:#44475a }
/* GenericPrompt */ [data-theme="dark"] .chroma .gp { } /* GenericPrompt */ [data-theme="dark"] .chroma .gp { }
/* Floating Tools */
/* Floating Tools */ /* Floating Tools */
.floating-tools { .floating-tools {
position: fixed; position: fixed;
bottom: 28px; bottom: 24px;
right: 16px; right: 16px;
z-index: 900; z-index: 900;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 8px; gap: 8px;
align-items: center; align-items: center;
transform: translateZ(0);
will-change: transform;
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;
transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease; transition: opacity 0.2s ease, visibility 0.2s ease;
} }
.floating-tools.hidden { .floating-tools.hidden {
opacity: 0 !important; opacity: 0 !important;
visibility: hidden !important; visibility: hidden !important;
transform: translateZ(0) translateY(12px) !important;
pointer-events: none !important; pointer-events: none !important;
} }
.floating-tools a { .floating-tools a {
width: 42px; width: 36px;
height: 42px; height: 36px;
background: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.6);
color: rgba(24, 24, 27, 0.86); backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
color: rgba(24, 24, 27, 0.75);
border-radius: 50%; border-radius: 50%;
font-size: 20px; font-size: 17px;
cursor: pointer; cursor: pointer;
text-decoration: none; text-decoration: none;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
-webkit-backdrop-filter: none; border: 1px solid rgba(255, 255, 255, 0.3);
backdrop-filter: none; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
border: 1px solid rgba(0, 0, 0, 0.08); transition: all 0.2s ease;
box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
transform: translateZ(0);
transition: background 0.2s ease, transform 0.2s ease;
} }
.floating-tools a:hover { .floating-tools a:hover {
background: #fff; background: rgba(255, 255, 255, 0.85);
transform: translateZ(0) translateY(-2px); color: rgba(24, 24, 27, 0.95);
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16); transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
} }
[data-theme="dark"] .floating-tools a { [data-theme="dark"] .floating-tools a {
background: rgba(30, 41, 59, 0.94); background: rgba(30, 41, 59, 0.6);
color: rgba(241, 245, 249, 0.9); color: rgba(241, 245, 249, 0.75);
border-color: rgba(148, 163, 184, 0.22); border-color: rgba(148, 163, 184, 0.15);
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.34); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
} }
[data-theme="dark"] .floating-tools a:hover { [data-theme="dark"] .floating-tools a:hover {
background: rgba(51, 65, 85, 0.98); background: rgba(30, 41, 59, 0.85);
box-shadow: 0 12px 26px rgba(0, 0, 0, 0.42); color: rgba(241, 245, 249, 0.95);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
} }
/* ── ViewImage — Apple-style lightbox ── */ /* ── ViewImage — Apple-style lightbox ── */
+44 -79
View File
@@ -94,89 +94,54 @@ document.addEventListener("pjax:success", function () {
}); });
// pjax加载完成 // pjax加载完成
// 代码折叠初始化 — 独立监听器,确保不被其他初始化错误影响
document.addEventListener("pjax:complete", function () { document.addEventListener("pjax:complete", function () {
setTimeout(function() { // 立即执行:进度条、基础 UI
if (typeof window.initCodeFold === 'function') window.initCodeFold(); if (typeof NProgress !== 'undefined') NProgress.done();
}, 200);
});
document.addEventListener("pjax:complete", function () {
// pjax完成动画
if (typeof NProgress !== 'undefined') {
NProgress.done();
}
// 重载一些js样式调整
pjax_reload(); pjax_reload();
// 初始化代码复制 // 下一帧执行:轻量初始化
if (typeof initCodeCopy === 'function') initCodeCopy(); requestAnimationFrame(function() {
if (typeof initCodeCopy === 'function') initCodeCopy();
// 初始化段落评论 if (typeof window.initSearch === 'function') {
if (typeof window.initParagraphComments === 'function') { try { window.initSearch(); } catch(e) {}
try {
window.initParagraphComments();
} catch (e) {
console.error('initParagraphComments error:', e);
} }
} if (typeof window.refreshFloatingTools === 'function') {
window.refreshFloatingTools();
} else if (typeof window.initFloatingTools === 'function') {
try { window.initFloatingTools(); } catch(e) {}
}
// 文章动画
if (typeof window.initPostScrollspy === 'function') window.initPostScrollspy();
});
// 初始化无限加载 // 空闲时执行:非关键功能
if (typeof window.initInfiniteScroll === 'function' && window.enableInfiniteScroll) { var idle = window.requestIdleCallback || function(fn) { return setTimeout(fn, 200); };
window.initInfiniteScroll(); idle(function() {
} if (typeof window.initParagraphComments === 'function') {
try { window.initParagraphComments(); } catch(e) {}
// 初始化友链状态 }
if (typeof window.initLinkStatus === 'function') { if (typeof window.initInfiniteScroll === 'function' && window.enableInfiniteScroll) {
try { window.initInfiniteScroll();
window.initLinkStatus(); }
} catch(e) { console.error('initLinkStatus error:', e); } if (typeof window.initLinkStatus === 'function') {
} try { window.initLinkStatus(); } catch(e) {}
}
// 重载评论 if (typeof window.initArtalk === 'function') {
if (typeof window.initArtalk === 'function') { try { window.initArtalk(); } catch(e) {}
try { }
window.initArtalk(); if (typeof window.bsz_fetch === 'function') {
} catch(e) { console.error('initArtalk error:', e); } try { window.bsz_fetch(); } catch(e) {}
} }
if (typeof window.initImageFrameReveal === 'function') {
// 重载不蒜子统计 try { window.initImageFrameReveal(); } catch(e) {}
if (typeof window.bsz_fetch === 'function') { }
try { // 链接卡片和中英文间距(DOM 扫描,非关键)
window.bsz_fetch(); if (typeof window.initLinkify === 'function') window.initLinkify();
} catch(e) { console.error('bsz_fetch error:', e); } if (typeof window.initPangu === 'function') window.initPangu();
} });
// 重载 Search 和 Floating Tools (Moved from main.js)
if (typeof window.refreshFloatingTools === 'function') {
window.refreshFloatingTools();
} else if (typeof window.initFloatingTools === 'function') {
requestAnimationFrame(function() {
try {
window.initFloatingTools();
} catch(e) { console.error('initFloatingTools error:', e); }
});
}
if (typeof window.initSearch === 'function') {
try {
window.initSearch();
} catch(e) { console.error('initSearch error:', e); }
}
// 重载图片框架滚动显示 // 延迟:代码折叠
if (typeof window.initImageFrameReveal === 'function') { setTimeout(function() {
try { if (typeof window.initCodeFold === 'function') window.initCodeFold();
window.initImageFrameReveal(); }, 300);
} catch(e) { console.error('initImageFrameReveal error:', e); }
}
// 重载文章动画
if (typeof window.initPostScrollspy === 'function') window.initPostScrollspy();
// 重载链接卡片
if (typeof window.initLinkify === 'function') window.initLinkify();
// 重载中英文间距
if (typeof window.initPangu === 'function') window.initPangu();
refreshHeatmap();
}); });
+3 -2
View File
@@ -28,10 +28,11 @@
function initPostScrollspy() { function initPostScrollspy() {
var content = document.getElementById('post-writing'); var content = document.getElementById('post-writing');
if (!content) return; if (!content) return;
content.querySelectorAll('h2, h3, h4, p, ul, ol, blockquote, table').forEach(function(el) { // 只给关键元素加动画,减少 observer 数量
content.querySelectorAll('h2, h3, blockquote, table, figure').forEach(function(el) {
if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-fade; delay: 60'); if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-fade; delay: 60');
}); });
content.querySelectorAll('figure, img, .post-video, .link-card').forEach(function(el) { content.querySelectorAll('.post-video, .link-card').forEach(function(el) {
if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-slide-bottom-small; delay: 100'); if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-slide-bottom-small; delay: 100');
}); });
} }