fix: pjax下waline内存泄露

D-Sketon · Jun 6, 2024 · 7b6050a · 7b6050a
1 parent d339d5b
commit 7b6050a
Show file tree

Hide file tree

Showing 7 changed files with 60 additions and 44 deletions.
diff --git a/layout/_partial/after-footer.ejs b/layout/_partial/after-footer.ejs
@@ -65,7 +65,7 @@
   <script data-pjax type="module">
     import { init } from "<%= vendorCdn(theme.vendor.js.waline)[0] %>";
     if(_$('.wcomment')) {
-      init({
+      window.walineInstance = init({
         el: '.wcomment',
         serverURL: '<%= theme.waline.serverURL %>',
         lang: '<%= theme.waline.lang %>',

diff --git a/layout/_partial/post/gallery.ejs b/layout/_partial/post/gallery.ejs
@@ -3,7 +3,7 @@
     <div class="article-gallery-photos">
       <% post.photos.forEach((photo, i) => { %>
         <a class="article-gallery-img article-gallery-item" href="<%- url_for(photo) %>" target="_blank">
-          <img src="<%- url_for(photo) %>" itemprop="image">
+          <img src="<%- url_for(photo) %>" itemprop="image" alt="gallery">
         </a>
       <% }) %>
     </div>

diff --git a/layout/layout.ejs b/layout/layout.ejs
@@ -20,7 +20,7 @@
         </div>
         <%- partial('_partial/footer', null, {cache: !config.relative_link}) %>
         <div class="sidebar-top">
-          <img src="/images/taichi.png" height="50" width="50" />
+          <img src="/images/taichi.png" height="50" width="50" alt="backtop" />
           <div class="arrow-up"></div>
         </div>
         <div id="mask"></div>

diff --git a/scripts/tag/externalLinkCard.js b/scripts/tag/externalLinkCard.js
@@ -13,7 +13,7 @@ hexo.extend.tag.register("externalLinkCard", (args) => {
   const coverDom = cover
     ? cover === "auto"
       ? `<div class="post-link-card-cover-wrap auto"><div class="icon-globe"></div></div>`
-      : `<div class="post-link-card-cover-wrap"><img src=${cover} class="no-lightbox" title=${title} /></div>`
+      : `<div class="post-link-card-cover-wrap"><img src="${cover}" class="no-lightbox" title="${title}" alt="${title}"/></div>`
     : "";
   return `<div class="post-link-card-wrap">
     <div class="post-link-card">

diff --git a/scripts/tag/postLinkCard.js b/scripts/tag/postLinkCard.js
@@ -42,13 +42,13 @@ hexo.extend.tag.register("postLinkCard", (args) => {
 
   let title = post.title || post.slug;
   // Let attribute be the true post title so it appears in tooltip.
-  const attrTitle = escapeHTML(post.title || post.slug);
+  const attrTitle = escapeHTML(title);
   if (escape === "true") title = escapeHTML(title);
 
   const link = url_for.call(hexo, post.path + (hash ? `#${hash}` : ""));
   if(cover === "auto") cover = hexo.theme.config.banner;
   const coverDom = cover
-    ? `<div class="post-link-card-cover-wrap"><img src=${cover} class="no-lightbox" title=${title} /></div>`
+    ? `<div class="post-link-card-cover-wrap"><img src="${cover}" class="no-lightbox" title="${attrTitle}" alt="${attrTitle}"/></div>`
     : "";
   return `<div class="post-link-card-wrap">
     <div class="post-link-card">

diff --git a/source/js/pjax.js b/source/js/pjax.js
@@ -27,6 +27,11 @@ window.addEventListener("pjax:complete", () => {
   } else if (mode == "false") {
     document.body.dispatchEvent(new CustomEvent("light-theme-set"));
   }
+  // destroy waline
+  if(window.walineInstance) {
+    window.walineInstance.destroy();
+    window.walineInstance = null;
+  }
 });
 window.addEventListener("pjax:send", () => {
   window.lightboxStatus = "loading";

diff --git a/source/js/script.js b/source/js/script.js
@@ -1,46 +1,57 @@
 (function () {
   // A Simple EventListener
-  HTMLElement.prototype.on = function (name, listener, options) {
-    if (!this.__listeners__) {
-      this.__listeners__ = {};
-    }
-    if (!this.__listeners__[name]) {
-      this.__listeners__[name] = [];
-    }
-    // Check if the listener is already added
-    for (let [l, o] of this.__listeners__[name]) {
-      if (l === listener && JSON.stringify(o) === JSON.stringify(options)) {
-        return this; // Listener is already added, do nothing
+  [Element, Document, Window].forEach((target) => {
+    target.prototype._addEventListener = target.prototype.addEventListener;
+    target.prototype._removeEventListener =
+      target.prototype.removeEventListener;
+    target.prototype.addEventListener = target.prototype.on = function (
+      name,
+      listener,
+      options
+    ) {
+      if (!this.__listeners__) {
+        this.__listeners__ = {};
       }
-    }
-    this.__listeners__[name].push([listener, options]);
-    this.addEventListener(name, listener, options);
-    return this;
-  };
-  HTMLElement.prototype.off = function (name, listener, options) {
-    if (!this.__listeners__ || !this.__listeners__[name]) {
+      if (!this.__listeners__[name]) {
+        this.__listeners__[name] = [];
+      }
+      // Check if the listener is already added
+      for (let [l, o] of this.__listeners__[name]) {
+        if (l === listener && JSON.stringify(o) === JSON.stringify(options)) {
+          return this; // Listener is already added, do nothing
+        }
+      }
+      this.__listeners__[name].push([listener, options]);
+      this._addEventListener(name, listener, options);
       return this;
-    }
-    if (!listener) {
-      // remove all event listeners
-      this.__listeners__[name].forEach(([listener, options]) => {
-        this.removeEventListener(name, listener, options);
-      });
-      delete this.__listeners__[name];
+    };
+    target.prototype.removeEventListener = target.prototype.off = function (
+      name,
+      listener,
+      options
+    ) {
+      if (!this.__listeners__ || !this.__listeners__[name]) {
+        return this;
+      }
+      if (!listener) {
+        // remove all event listeners
+        this.__listeners__[name].forEach(([listener, options]) => {
+          this.removeEventListener(name, listener, options);
+        });
+        delete this.__listeners__[name];
+        return this;
+      }
+      this._removeEventListener(name, listener, options);
+      this.__listeners__[name] = this.__listeners__[name].filter(
+        ([l, o]) =>
+          l !== listener || JSON.stringify(o) !== JSON.stringify(options)
+      );
+      if (this.__listeners__[name].length === 0) {
+        delete this.__listeners__[name];
+      }
       return this;
-    }
-    this.removeEventListener(name, listener, options);
-    this.__listeners__[name] = this.__listeners__[name].filter(
-      ([l, o]) =>
-        l !== listener || JSON.stringify(o) !== JSON.stringify(options)
-    );
-    if (this.__listeners__[name].length === 0) {
-      delete this.__listeners__[name];
-    }
-    return this;
-  };
-  window.on = HTMLElement.prototype.on.bind(window);
-  window.off = HTMLElement.prototype.off.bind(window);
+    };
+  });
   // Simple Selector
   window._$ = (selector) => {
     if (selector.startsWith("#")) {