hexo-theme-stellar 1.35.0 → 1.36.0

package/_config.yml

@@ -1,6 +1,6 @@
 ######## Stellar info ########
 stellar:
-  version: '1.35.0'
+  version: '1.36.0'
   homepage: 'https://xaoxuu.com/wiki/stellar/'
   repo: 'https://github.com/xaoxuu/hexo-theme-stellar'
   main_css: /css/main.css
@@ -222,7 +222,6 @@ search:
 comments:
   service: # beaudar, utterances, giscus, twikoo, waline, artalk
   comment_title: 快来参与讨论吧~
-  lazyload: false # true / false
   custom_css: # artalk,twikoo,... 可以为没有全局启用的评论加载自定义样式
   # beaudar
   # https://beaudar.lipk.org/
@@ -319,7 +318,6 @@ comments:
     server: # 后端服务地址
     site: '' # 站点名称
     darkMode: auto # 其它模式都有问题，慎用，否则后果自负
-    fancybox: true # 是否为评论区启用 fancybox
     # artalk 有三类图片：1.上传至服务端 2.上传至服务端后利用upgit上传至图床 3.前端上传至图床（本配置为此类）
     # 配置此项时将覆盖服务端上传能力
     imageUploader:
@@ -409,7 +407,7 @@ tag_plugins:
     default_color: theme # theme, accent, red, orange, yellow, green, cyan, blue, purple
   # {% image %}
   image:
-    fancybox: false # true, false
+    parse_markdown: false # true / false（自动将 markdown 图片转为 {% image %} 标签）
   # {% copy xxx %}
   copy:
     toast: 复制成功
@@ -454,8 +452,8 @@ tag_plugins:
 
 # 基础依赖
 dependencies:
-  jquery: https://gcore.jsdelivr.net/npm/jquery@3.7/dist/jquery.slim.min.js
   marked: https://gcore.jsdelivr.net/npm/marked@13.0/lib/marked.umd.min.js
+  # 懒加载强制开启（无 enable 开关），图片默认懒加载，no-lazy 是唯一例外
   lazyload:
     js: https://gcore.jsdelivr.net/npm/vanilla-lazyload@19.1/dist/lazyload.min.js
     transition: fade # blur, fade
@@ -522,6 +520,22 @@ data_services:
   rss:
     js: /js/services/rss.js
 
+# 动态数据缓存
+# 将动态数据缓存到浏览器本地：TTL 未过期直接显示缓存，过期后先显示缓存再后台刷新
+data_cache:
+  enable: true # 总开关
+  default_ttl: 3600 # 默认缓存时长（秒）
+  ttl: # 按服务覆盖缓存时长（秒），未列出的服务使用 default_ttl；设为 0 表示该服务不缓存
+    giscus: 600
+    waline: 600
+    artalk: 600
+    memos: 600
+    sites: 86400
+    friends: 86400
+    friends_and_posts: 86400
+    siteinfo: 86400
+  max_entries: 200 # 本地缓存条目上限，超出后按写入时间淘汰最旧的
+
 # 扩展插件接入方法：(插件名下面用 #plugin# 代替)
 # 1. 在这里增加 #plugin# 配置，至少应含有 enable 字段，默认为空（不启用）
 # 2. 新建文件 layout/_plugins/#plugin#.ejs 文件中设置编写加载代码。
@@ -539,8 +553,10 @@ plugins:
 
   # https://fancyapps.com/docs/ui/fancybox/
   # available for {% image xxx %}
+  # mode: auto=按需（页面有可弹窗图片才加载）/ global=全局（所有页面加载）
   fancybox:
-    enable: true
+    enable: true # 插件注册必需字段，恒为 true（不再支持关闭）
+    mode: auto # auto / global
     js: https://gcore.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js
     css: https://gcore.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css
     # 让 md 语法图片支持放大可以这样写: .md-text img:not([class]), .md-text .image img
@@ -557,7 +573,7 @@ plugins:
 
   # https://scrollrevealjs.org/api/reveal.html
   scrollreveal:
-    enable: #true # 慎用，有些时候打开页面空白
+    enable: true
     js: https://gcore.jsdelivr.net/npm/scrollreveal@4.0/dist/scrollreveal.min.js
     distance: 8px
     duration: 1000 # ms
@@ -613,8 +629,8 @@ plugins:
   mermaid:
     enable: # true # 可以在特定文章的 front-matter 中设置 mermaid: true 来开启，也可以在这里设置全局开启
     style_optimization: false # use custom style in stellar
-    # js: https://unpkg.com/mermaid@9.0.0/dist/mermaid.min.js
-    js: https://gcore.jsdelivr.net/npm/mermaid@v9/dist/mermaid.min.js
+    # js: https://unpkg.com/mermaid@11/dist/mermaid.min.js
+    js: https://gcore.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js
     # Available themes: default | dark | forest | neutral
     theme: neutral
   
@@ -636,7 +652,6 @@ plugins:
 
 style:
   prefers_theme: auto # auto / light / dark
-  smooth_scroll: true # true / false 开启时如果目录过长可能无法准确定位
   font-size:
     root: 16px # 改这个会影响全局所有文字的字号
     body: 17px # 影响正文区域的字号，如果改成 px 则不受 root 影响

package/layout/_partial/comments/artalk/layout.ejs

@@ -1,7 +1,7 @@
 <%
 function layoutDiv() {
   var el = '';
-  el += `<div class="artalk ${theme.comments.artalk?.fancybox ? 'with-fancybox' : ''}" id="artalk_container"`;
+  el += `<div class="artalk with-fancybox" id="artalk_container"`;
   let cfg = {};
   if (page.comment_id) {
     cfg['comment_id'] = page.comment_id;
@@ -16,4 +16,4 @@ function layoutDiv() {
 }
 %>
 
-<%- layoutDiv() %>
+<%- layoutDiv() %>

package/layout/_partial/comments/artalk/script.ejs

@@ -1,6 +1,5 @@
-<script>
+<script type="module">
   (function() {
-    const lazyload = <%= theme.comments.lazyload ?? false %>;
     
     function initArtalk() {
       const el = document.getElementById('artalk_container');
@@ -43,15 +42,10 @@
         });
       }
       
-      util.viewportLazyload(el, load_artalk, lazyload);
+      util.viewportLazyload(el, load_artalk);
     }
     
-    // Store in global stellar namespace for PJAX reinitialization
-    window.stellar = window.stellar || {};
-    window.stellar.initComments = window.stellar.initComments || {};
-    window.stellar.initComments.artalk = initArtalk;
-    
     // Initialize on page load
     initArtalk();
   })();
-</script>
+</script>

package/layout/_partial/comments/beaudar/script.ejs

@@ -1,6 +1,5 @@
-<script>
+<script type="module">
   (function() {
-    const lazyload = <%= theme.comments.lazyload ?? false %>;
     
     function initBeaudar() {
       const el = document.querySelector('#comments #beaudar');
@@ -24,14 +23,9 @@
         el.appendChild(script);
       }
       
-      util.viewportLazyload(el, load_beaudar, lazyload);
+      util.viewportLazyload(el, load_beaudar);
     }
     
-    // Store in global stellar namespace for PJAX reinitialization
-    window.stellar = window.stellar || {};
-    window.stellar.initComments = window.stellar.initComments || {};
-    window.stellar.initComments.beaudar = initBeaudar;
-    
     // Initialize on page load
     initBeaudar();
   })();

package/layout/_partial/comments/giscus/script.ejs

@@ -1,6 +1,5 @@
-<script>
+<script type="module">
   (function() {
-    const lazyload = <%= theme.comments.lazyload ?? false %>;
     
     function initGiscus() {
       const el = document.querySelector('#comments #giscus');
@@ -23,14 +22,9 @@
         el.appendChild(script);
       }
       
-      util.viewportLazyload(el, load_giscus, lazyload);
+      util.viewportLazyload(el, load_giscus);
     }
     
-    // Store in global stellar namespace for PJAX reinitialization
-    window.stellar = window.stellar || {};
-    window.stellar.initComments = window.stellar.initComments || {};
-    window.stellar.initComments.giscus = initGiscus;
-    
     // Initialize on page load
     initGiscus();
   })();

package/layout/_partial/comments/twikoo/layout.ejs

@@ -1,7 +1,7 @@
 <%
 function layoutDiv() {
   var el = '';
-  el += '<div id="twikoo_container"';
+  el += '<div id="twikoo_container" class="with-fancybox"';
   let cfg = {};
   if (page.comment_id) {
     cfg['comment_id'] = page.comment_id;
@@ -16,4 +16,4 @@ function layoutDiv() {
 }
 %>
 
-<%- layoutDiv() %>
+<%- layoutDiv() %>

package/layout/_partial/comments/twikoo/script.ejs

@@ -1,6 +1,5 @@
-<script>
+<script type="module">
   (function() {
-    const lazyload = <%= theme.comments.lazyload ?? false %>;
     
     function initTwikoo() {
       const el = document.getElementById('twikoo_container');
@@ -16,15 +15,10 @@
         });
       }
       
-      util.viewportLazyload(el, load_twikoo, lazyload);
+      util.viewportLazyload(el, load_twikoo);
     }
     
-    // Store in global stellar namespace for PJAX reinitialization
-    window.stellar = window.stellar || {};
-    window.stellar.initComments = window.stellar.initComments || {};
-    window.stellar.initComments.twikoo = initTwikoo;
-    
     // Initialize on page load
     initTwikoo();
   })();
-</script>
+</script>

package/layout/_partial/comments/utterances/script.ejs

@@ -1,6 +1,5 @@
-<script>
+<script type="module">
   (function() {
-    const lazyload = <%= theme.comments.lazyload ?? false %>;
     
     function initUtterances() {
       const el = document.querySelector("#comments #utterances");
@@ -24,14 +23,9 @@
         el.appendChild(script);
       }
       
-      util.viewportLazyload(el, load_utterances, lazyload);
+      util.viewportLazyload(el, load_utterances);
     }
     
-    // Store in global stellar namespace for PJAX reinitialization
-    window.stellar = window.stellar || {};
-    window.stellar.initComments = window.stellar.initComments || {};
-    window.stellar.initComments.utterances = initUtterances;
-    
     // Initialize on page load
     initUtterances();
   })();

package/layout/_partial/comments/waline/layout.ejs

@@ -1,7 +1,7 @@
 <%
 function layoutDiv() {
   var el = '';
-  el += '<div id="waline_container" class="waline_thread"';
+  el += '<div id="waline_container" class="waline_thread with-fancybox"';
   let cfg = {};
   if (page.comment_id) {
     cfg['comment_id'] = page.comment_id;

package/layout/_partial/comments/waline/script.ejs

@@ -1,7 +1,6 @@
 <script type="module">
   import { init } from '<%- theme.comments.waline.js %>';
 
-  const lazyload = <%= theme.comments.lazyload ?? false %>;
   
   function initWaline() {
     const el = document.getElementById('waline_container');
@@ -35,14 +34,9 @@
       }));
     }
     
-    util.viewportLazyload(el, load_waline, lazyload);
+    util.viewportLazyload(el, load_waline);
   }
   
-  // Store in global stellar namespace for PJAX reinitialization
-  window.stellar = window.stellar || {};
-  window.stellar.initComments = window.stellar.initComments || {};
-  window.stellar.initComments.waline = initWaline;
-  
   // Initialize on page load
   initWaline();
 </script>

package/layout/_partial/scripts/defines.ejs

@@ -19,6 +19,123 @@
     const scrollHandler = () => {
       const wikiCover = document.querySelector('#l_cover .l_cover.wiki');
       const startEl = document.getElementById('start');
+      // 存在有效锚点时，等待布局稳定后滚动到目标
+      // （浏览器原生锚点滚动发生在布局完成前，长文章的懒加载图片/异步组件会把目标顶偏）
+      const hash = window.location.hash;
+      if (hash.length > 1) {
+        let anchorId = hash.slice(1);
+        try {
+          anchorId = decodeURIComponent(anchorId);
+        } catch (e) {
+          // 片段含非法编码时按原样查找
+        }
+        const anchor = document.getElementById(anchorId);
+        if (anchor) {
+          const offset = 32; // 与 TOC 点击滚动保持一致
+          const targetY = () => anchor.getBoundingClientRect().top + window.scrollY - offset;
+          let timer = null;
+          let lastY = null;
+          let quiet = 0;
+          let attempts = 0;
+          // 记录最近一次资源加载完成时间，判断异步数据/图片是否仍在改变布局
+          let lastResourceTime = performance.now();
+          let observer = null;
+          try {
+            observer = new PerformanceObserver(function (list) {
+              lastResourceTime = performance.now();
+            });
+            observer.observe({ entryTypes: ['resource'] });
+          } catch (e) {}
+          // 统计进行中的 fetch/XHR 请求，异步组件（timeline 等）未完成前不判定布局稳定
+          let pendingRequests = 0;
+          const trackRequest = (fn) => {
+            pendingRequests++;
+            try {
+              const result = fn();
+              if (result && typeof result.finally === 'function') {
+                result.finally(function () {
+                  pendingRequests = Math.max(0, pendingRequests - 1);
+                });
+              } else {
+                pendingRequests = Math.max(0, pendingRequests - 1);
+              }
+              return result;
+            } catch (e) {
+              pendingRequests = Math.max(0, pendingRequests - 1);
+              throw e;
+            }
+          };
+          if (typeof window.fetch === 'function') {
+            const origFetch = window.fetch.bind(window);
+            window.fetch = function () {
+              const args = arguments;
+              return trackRequest(function () {
+                return origFetch.apply(window, args);
+              });
+            };
+          }
+          if (window.XMLHttpRequest) {
+            const origOpen = window.XMLHttpRequest.prototype.open;
+            const origSend = window.XMLHttpRequest.prototype.send;
+            window.XMLHttpRequest.prototype.open = function () {
+              this.__anchorTracked = true;
+              return origOpen.apply(this, arguments);
+            };
+            window.XMLHttpRequest.prototype.send = function () {
+              if (this.__anchorTracked) {
+                pendingRequests++;
+                const done = () => {
+                  if (this.__anchorTracked) {
+                    this.__anchorTracked = false;
+                    pendingRequests = Math.max(0, pendingRequests - 1);
+                  }
+                };
+                this.addEventListener('loadend', done);
+              }
+              return origSend.apply(this, arguments);
+            };
+          }
+          const cancel = () => {
+            if (timer !== null) {
+              clearInterval(timer);
+              timer = null;
+            }
+            if (observer !== null) {
+              try {
+                observer.disconnect();
+              } catch (e) {}
+            }
+          };
+          const adjust = () => {
+            const y = targetY();
+            const atTarget = Math.abs(window.scrollY - y) <= 2;
+            if (!atTarget || lastY === null || Math.abs(y - lastY) > 2) {
+              window.scrollTo({ top: y, behavior: 'instant' });
+              lastY = y;
+              quiet = 0;
+            } else {
+              quiet++;
+            }
+            attempts++;
+            const resourceQuiet = performance.now() - lastResourceTime > 3000;
+            // 位置连续 1.8 秒无变化、无进行中的请求且最近 3 秒无资源加载才视为稳定；最长等待 30 秒
+            if ((quiet >= 3 && pendingRequests === 0 && resourceQuiet) || attempts >= 50) {
+              cancel();
+            }
+          };
+          requestAnimationFrame(() => {
+            // 锚点链接打开时直接定位，不做动画；用户主动点击（如 TOC）仍走平滑滚动
+            window.scrollTo({ top: targetY(), behavior: 'instant' });
+            timer = setInterval(adjust, 600);
+          });
+          // 用户主动滚动时停止自动校正
+          window.addEventListener('wheel', cancel, { passive: true });
+          window.addEventListener('touchstart', cancel, { passive: true });
+          window.addEventListener('mousedown', cancel, { passive: true });
+          window.addEventListener('keydown', cancel, { passive: true });
+          return;
+        }
+      }
       if (wikiCover && startEl) {
         window.scrollTo(0, startEl.offsetTop);
       } else {
@@ -54,9 +171,9 @@
     avatar: `<%- theme.default.avatar %>`,
     cover: `<%- theme.default.cover %>`,
     loading: `<%- theme.default.loading %>`,
+    data_cache: <%- JSON.stringify(theme.data_cache || {}) %>,
   };
   const deps = {
-    jquery: `<%- url_for(theme.dependencies.jquery) %>`,
     marked: `<%- url_for(theme.dependencies.marked) %>`,
     lazyload: `<%- url_for(theme.dependencies.lazyload.js) %>`
   }

package/layout/_partial/scripts/lazyload.ejs

@@ -1,5 +1,6 @@
-<script async src="<%- url_for(theme.dependencies.lazyload.js) %>"></script>
 <script>
+  // 先声明配置与初始化监听，再异步加载库：
+  // 保证库执行时 lazyLoadOptions 已就绪，避免 async 脚本抢先执行导致自初始化失败
   // https://www.npmjs.com/package/vanilla-lazyload
   // Set the options globally
   // to make LazyLoad self-initialize
@@ -7,13 +8,13 @@
     elements_selector: ".lazy",
     callback_loaded: (el) => {
       el.classList.add('loaded');
-      const wrapper = el.closest('.lazy-box');
+      // {% image %} 没有 .lazy-box 包裹，回退到父元素查找加载图标
+      const wrapper = el.closest('.lazy-box') || el.parentElement;
       const icon = wrapper?.querySelector('.lazy-icon');
       if (icon) icon.remove();
     }
   };
-  // Listen to the initialization event
-  // and get the instance of LazyLoad
+  // 监听初始化事件，获取 LazyLoad 实例
   window.addEventListener(
     "LazyLoad::Initialized",
     function (event) {
@@ -63,5 +64,5 @@
       window.lazyLoadInstance.update();
     }
   }
-
-</script>
+</script>
+<script async src="<%- url_for(theme.dependencies.lazyload.js) %>"></script>

package/layout/_partial/scripts/services.ejs

@@ -42,28 +42,26 @@
       } else {
         const els = document.getElementsByClassName(`ds-${id}`);
         if (els?.length > 0) {
-          utils.jq(() => {
-            if (id == 'timeline' || id == 'memos' || id == 'marked') {
-              utils.js(deps.marked).then(function () {
-                utils.js(js, { defer: true });
-              });
-            } else {
+          if (id == 'timeline' || id == 'memos' || id == 'marked' || id == 'mdrender') {
+            utils.js(deps.marked).then(function () {
               utils.js(js, { defer: true });
-            }
-          }, false);
+            });
+          } else {
+            utils.js(js, { defer: true });
+          }
         }
       }
     }
 
     // search
     if (ctx.search && typeof searchFunc === 'function') {
-      const $inputArea = $("input#search-input");
-      if ($inputArea.length > 0 && !$inputArea[0]._searchInitialized) {
+      const inputArea = document.querySelector("input#search-input");
+      if (inputArea && !inputArea._searchInitialized) {
         const path = ctx.search.path.startsWith('/') ? ctx.root + ctx.search.path.substring(1) : ctx.root + ctx.search.path;
-        const filter = $inputArea.attr('data-filter') || '';
+        const filter = inputArea.getAttribute('data-filter') || '';
         searchFunc(path, filter, 'search-wrapper', 'search-input', 'search-result');
         // 标记为已初始化，防止重复绑定
-        $inputArea[0]._searchInitialized = true;
+        inputArea._searchInitialized = true;
       }
     }
 
@@ -177,4 +175,4 @@
   };
 
   utils.initPlugin(initServices, 'services');
-</script>
+</script>