优化加载卡顿问题,最稳定版本
This commit is contained in:
1 parent
422e567afb
commit
dd5701615b
3 files changed
+71
-111
No files matched your search
@@ -3504,66 +3504,60 @@ input[type=submit] {
|
||||
/* GenericOutput */ [data-theme="dark"] .chroma .go { color:#44475a }
|
||||
/* GenericPrompt */ [data-theme="dark"] .chroma .gp { }
|
||||
|
||||
/* Floating Tools */
|
||||
/* Floating Tools */
|
||||
.floating-tools {
|
||||
position: fixed;
|
||||
bottom: 28px;
|
||||
bottom: 24px;
|
||||
right: 16px;
|
||||
z-index: 900;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
transform: translateZ(0);
|
||||
will-change: transform;
|
||||
opacity: 1;
|
||||
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 {
|
||||
opacity: 0 !important;
|
||||
visibility: hidden !important;
|
||||
transform: translateZ(0) translateY(12px) !important;
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
.floating-tools a {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
color: rgba(24, 24, 27, 0.86);
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: rgba(255, 255, 255, 0.6);
|
||||
backdrop-filter: blur(12px);
|
||||
-webkit-backdrop-filter: blur(12px);
|
||||
color: rgba(24, 24, 27, 0.75);
|
||||
border-radius: 50%;
|
||||
font-size: 20px;
|
||||
font-size: 17px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
-webkit-backdrop-filter: none;
|
||||
backdrop-filter: none;
|
||||
border: 1px solid rgba(0, 0, 0, 0.08);
|
||||
box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
|
||||
transform: translateZ(0);
|
||||
transition: background 0.2s ease, transform 0.2s ease;
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.floating-tools a:hover {
|
||||
background: #fff;
|
||||
transform: translateZ(0) translateY(-2px);
|
||||
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
|
||||
background: rgba(255, 255, 255, 0.85);
|
||||
color: rgba(24, 24, 27, 0.95);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .floating-tools a {
|
||||
background: rgba(30, 41, 59, 0.94);
|
||||
color: rgba(241, 245, 249, 0.9);
|
||||
border-color: rgba(148, 163, 184, 0.22);
|
||||
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.34);
|
||||
background: rgba(30, 41, 59, 0.6);
|
||||
color: rgba(241, 245, 249, 0.75);
|
||||
border-color: rgba(148, 163, 184, 0.15);
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .floating-tools a:hover {
|
||||
background: rgba(51, 65, 85, 0.98);
|
||||
box-shadow: 0 12px 26px rgba(0, 0, 0, 0.42);
|
||||
background: rgba(30, 41, 59, 0.85);
|
||||
color: rgba(241, 245, 249, 0.95);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* ── ViewImage — Apple-style lightbox ── */
|
||||
|
||||
@@ -94,89 +94,54 @@ document.addEventListener("pjax:success", function () {
|
||||
});
|
||||
|
||||
// pjax加载完成
|
||||
// 代码折叠初始化 — 独立监听器,确保不被其他初始化错误影响
|
||||
document.addEventListener("pjax:complete", function () {
|
||||
setTimeout(function() {
|
||||
if (typeof window.initCodeFold === 'function') window.initCodeFold();
|
||||
}, 200);
|
||||
});
|
||||
|
||||
document.addEventListener("pjax:complete", function () {
|
||||
// pjax完成动画
|
||||
if (typeof NProgress !== 'undefined') {
|
||||
NProgress.done();
|
||||
}
|
||||
|
||||
// 重载一些js样式调整
|
||||
// 立即执行:进度条、基础 UI
|
||||
if (typeof NProgress !== 'undefined') NProgress.done();
|
||||
pjax_reload();
|
||||
|
||||
// 初始化代码复制
|
||||
if (typeof initCodeCopy === 'function') initCodeCopy();
|
||||
|
||||
// 初始化段落评论
|
||||
if (typeof window.initParagraphComments === 'function') {
|
||||
try {
|
||||
window.initParagraphComments();
|
||||
} catch (e) {
|
||||
console.error('initParagraphComments error:', e);
|
||||
// 下一帧执行:轻量初始化
|
||||
requestAnimationFrame(function() {
|
||||
if (typeof initCodeCopy === 'function') initCodeCopy();
|
||||
if (typeof window.initSearch === 'function') {
|
||||
try { window.initSearch(); } catch(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) {
|
||||
window.initInfiniteScroll();
|
||||
}
|
||||
|
||||
// 初始化友链状态
|
||||
if (typeof window.initLinkStatus === 'function') {
|
||||
try {
|
||||
window.initLinkStatus();
|
||||
} catch(e) { console.error('initLinkStatus error:', e); }
|
||||
}
|
||||
|
||||
// 重载评论
|
||||
if (typeof window.initArtalk === 'function') {
|
||||
try {
|
||||
window.initArtalk();
|
||||
} catch(e) { console.error('initArtalk error:', e); }
|
||||
}
|
||||
|
||||
// 重载不蒜子统计
|
||||
if (typeof window.bsz_fetch === 'function') {
|
||||
try {
|
||||
window.bsz_fetch();
|
||||
} catch(e) { console.error('bsz_fetch error:', e); }
|
||||
}
|
||||
|
||||
// 重载 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); }
|
||||
}
|
||||
// 空闲时执行:非关键功能
|
||||
var idle = window.requestIdleCallback || function(fn) { return setTimeout(fn, 200); };
|
||||
idle(function() {
|
||||
if (typeof window.initParagraphComments === 'function') {
|
||||
try { window.initParagraphComments(); } catch(e) {}
|
||||
}
|
||||
if (typeof window.initInfiniteScroll === 'function' && window.enableInfiniteScroll) {
|
||||
window.initInfiniteScroll();
|
||||
}
|
||||
if (typeof window.initLinkStatus === 'function') {
|
||||
try { window.initLinkStatus(); } catch(e) {}
|
||||
}
|
||||
if (typeof window.initArtalk === 'function') {
|
||||
try { window.initArtalk(); } catch(e) {}
|
||||
}
|
||||
if (typeof window.bsz_fetch === 'function') {
|
||||
try { window.bsz_fetch(); } catch(e) {}
|
||||
}
|
||||
if (typeof window.initImageFrameReveal === 'function') {
|
||||
try { window.initImageFrameReveal(); } catch(e) {}
|
||||
}
|
||||
// 链接卡片和中英文间距(DOM 扫描,非关键)
|
||||
if (typeof window.initLinkify === 'function') window.initLinkify();
|
||||
if (typeof window.initPangu === 'function') window.initPangu();
|
||||
});
|
||||
|
||||
// 重载图片框架滚动显示
|
||||
if (typeof window.initImageFrameReveal === 'function') {
|
||||
try {
|
||||
window.initImageFrameReveal();
|
||||
} 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();
|
||||
// 延迟:代码折叠
|
||||
setTimeout(function() {
|
||||
if (typeof window.initCodeFold === 'function') window.initCodeFold();
|
||||
}, 300);
|
||||
});
|
||||
@@ -28,10 +28,11 @@
|
||||
function initPostScrollspy() {
|
||||
var content = document.getElementById('post-writing');
|
||||
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');
|
||||
});
|
||||
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');
|
||||
});
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user