server optimizations

Overlord-Server/public/assets/data.js

@@ -71,6 +71,8 @@ export async function loadWithOptions(options = {}) {
     }
     state.lastDigest = digest;
     render(data, { reorder });
+    const pag = document.getElementById("pagination");
+    if (pag) pag.style.visibility = "";
     
     if (!state.thumbnailsRequested) {
       state.thumbnailsRequested = true;

Overlord-Server/public/assets/main.js

@@ -11,7 +11,6 @@ import {
   requestThumbnail,
   markManualDisconnect,
 } from "./data.js";
-import { initCountryPicker } from "./country-picker.js";
 
 const grid = document.getElementById("grid");
 const totalPill = document.getElementById("total-pill");
@@ -620,13 +619,15 @@ filterGroupSelect?.addEventListener("change", (e) => {
   loadWithOptions({ force: true, reorder: true });
 });
 
-initCountryPicker((code) => {
+import("./country-picker.js").then(({ initCountryPicker }) => {
+  initCountryPicker((code) => {
     state.filterCountry = code;
     localStorage.setItem(PREF_FILTER_COUNTRY_KEY, code);
     state.page = 1;
     state.lastDigest = "";
     loadWithOptions({ force: true, reorder: true });
-}, localStorage.getItem(PREF_FILTER_COUNTRY_KEY) || "all");
+  }, localStorage.getItem(PREF_FILTER_COUNTRY_KEY) || "all");
+});
 
 (function restoreFilterStatus() {
   const savedStatus = localStorage.getItem(PREF_FILTER_STATUS_KEY);

Overlord-Server/public/assets/nav.js

@@ -9,13 +9,13 @@ import {
 import { mountNav } from "./nav/template.js";
 import { createAdaptiveNavController } from "./nav/layout.js";
 import { applyUserRoleUI } from "./nav/role-ui.js";
-import { showCertBannerIfNeeded } from "./cert-banner.js";
-import * as chatWidget from "./chat-widget.js";
 
 const host = document.getElementById("top-nav");
 if (host) {
   const refs = mountNav(host);
+  import("./cert-banner.js").then(({ showCertBannerIfNeeded }) => {
     showCertBannerIfNeeded(document.getElementById("sb-mobile-bar") || host);
+  });
   const { applyAdaptiveNavLayout, navHide } = createAdaptiveNavController(host, refs);
 
   if (refs.navHideBtn && navHide) {
@@ -156,6 +156,7 @@ if (host) {
     loadCurrentUser();
   }
 
+  import("./chat-widget.js").then((chatWidget) => {
     chatWidget.init();
 
     if (chatWidget.isHidden() && refs.navUtility) {
@@ -170,4 +171,5 @@ if (host) {
       });
       refs.navUtility.insertBefore(restoreBtn, refs.navUtility.firstChild);
     }
+  });
 }

Overlord-Server/public/index.html

@@ -13,7 +13,10 @@
     <link rel="icon" type="image/x-icon" href="/assets/favicon.ico" />
     <link rel="stylesheet" href="/assets/main.css" />
     <link rel="stylesheet" href="/assets/custom.css" />
-    <script src="/vendor/animejs/anime.min.js"></script>
+    <script defer src="/vendor/animejs/anime.min.js"></script>
+    <link rel="preload" href="/api/clients?page=1&amp;pageSize=12&amp;q=&amp;sort=stable&amp;status=all&amp;os=all&amp;country=all&amp;group=all" as="fetch" crossorigin />
+    <link rel="preload" href="/api/auth/me" as="fetch" crossorigin />
+    <link rel="preload" href="/api/groups" as="fetch" crossorigin />
   </head>
   <body class="min-h-screen bg-slate-950 text-slate-100">
     <header id="top-nav"></header>
@@ -151,8 +154,8 @@
             </button>
           </div>
         </div>
-        <div id="grid" class="flex flex-col gap-3"></div>
+        <div id="grid" class="flex flex-col gap-3 min-h-[420px]"></div>
-        <div class="flex items-center justify-center gap-3 py-4">
+        <div id="pagination" class="flex items-center justify-center gap-3 py-4" style="visibility:hidden">
           <button
             id="prev"
             class="px-4 py-2 rounded-lg border border-slate-700/60 bg-slate-800/70 hover:bg-slate-700/70 text-slate-300 disabled:opacity-40"