Additional fixes for dynamic page loading optimization (#402)

- Update to wabac.js 2.21.1
- Hide 'Show non-seed pages' when doing a dynamic query
- bump to 2.3.1

Author: ikreymer

CHANGES.md

@@ -2,6 +2,9 @@
 
 ## CHANGES
 
+v2.3.1
+- Loading: additional loading optimizations, bump wabac.js to 2.21.1
+
 v2.3.0
 
 - UI: Add animating spinner for loading, show progress bar only when progress is available

package.json

@@ -1,7 +1,7 @@
 {
   "name": "replaywebpage",
   "productName": "ReplayWeb.page",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "description": "Serverless Web Archive Replay",
   "repository": "https://github.com/webrecorder/replayweb.page",
   "homepage": "https://replayweb.page/",
@@ -18,7 +18,7 @@
   "dependencies": {
     "@fortawesome/fontawesome-free": "^5.15.4",
     "@shoelace-style/shoelace": "~2.15.1",
-    "@webrecorder/wabac": "^2.21.0",
+    "@webrecorder/wabac": "^2.21.1",
     "bulma": "^0.9.3",
     "electron-log": "^4.4.1",
     "electron-updater": "^6.3.9",

src/pages.ts

@@ -241,7 +241,9 @@ class Pages extends LitElement {
           this.showAllPages || !seedPages.length
             ? [...this.collInfo!.pages]
             : seedPages;
-        this.hasExtraPages = seedPages.length !== this.collInfo!.pages.length;
+        this.hasExtraPages = seedPages.length < this.collInfo!.pages.length;
+      } else {
+        this.hasExtraPages = false;
       }
       this.dynamicPageCount = 1;
       await this.addDynamicPages();
@@ -283,6 +285,10 @@ class Pages extends LitElement {
       return;
     }
 
+    if (!json.pages.length) {
+      this.skipScrollMore = true;
+    }
+
     const knownPages = new Set();
     this.filteredPages.forEach((x) => knownPages.add(x.id));
 
@@ -334,11 +340,7 @@ class Pages extends LitElement {
       this.filteredPages = [...this.filteredPages, ...newPages];
     }
 
-    if (json.total) {
-      this.totalPages = json.total;
-    } else {
-      this.totalPages = this.filteredPages.length;
-    }
+    this.totalPages = this.filteredPages.length;
   }
 
   async filterCurated() {
@@ -1336,10 +1338,7 @@ class Pages extends LitElement {
       element.scrollHeight - element.scrollTop - element.clientHeight;
     if (diff < 40 && !this.skipScrollMore) {
       this.skipScrollMore = true;
-      if (
-        this.dynamicPagesQuery &&
-        this.filteredPages.length < this.totalPages
-      ) {
+      if (this.dynamicPagesQuery) {
         this.dynamicPageCount += 1;
         await this.addDynamicPages();
       }

yarn.lock

@@ -1028,10 +1028,10 @@
   resolved "https://registry.yarnpkg.com/@webpack-cli/serve/-/serve-2.0.5.tgz#325db42395cd49fe6c14057f9a900e427df8810e"
   integrity sha512-lqaoKnRYBdo1UgDX8uF24AfGMifWK19TxPmM5FHc2vAGxrJ/qtyUyFBWoY1tISZdelsQ5fBcOusifo5o5wSJxQ==
 
-"@webrecorder/wabac@^2.21.0":
-  version "2.21.0"
-  resolved "https://registry.yarnpkg.com/@webrecorder/wabac/-/wabac-2.21.0.tgz#cc3483f15cb3f1502fdef89e1c9a4ee5709bcaec"
-  integrity sha512-28G3ci/m/qJXnLDoUP/Kt09PiTuORBZH0bw/JlKhPCeLL4IdYsODeXaImVwvTT12R9tV7Zp37w26jhkMfcur0w==
+"@webrecorder/wabac@^2.21.1":
+  version "2.21.1"
+  resolved "https://registry.yarnpkg.com/@webrecorder/wabac/-/wabac-2.21.1.tgz#c5b9ce33f1ab9fa0c1a4a4a7ae2f217c99a0b47e"
+  integrity sha512-sS9/TBE+/cIz51OX+X62HerGmjtQLsotQOsUD4GDZgKJzjGATqpjA6CFNRKMZDJ9pY21G+s6NDov3czDHC4kzg==
   dependencies:
     "@peculiar/asn1-ecc" "^2.3.4"
     "@peculiar/asn1-schema" "^2.3.3"