Make loading much more efficient and have it not shit itself when you start on anything other than the index page.

This commit is contained in:
wearrrrr 2024-04-09 19:47:57 -05:00
parent 55b0708016
commit 949f7c4936
3 changed files with 76 additions and 22 deletions

View file

@ -1,11 +1,6 @@
<script src="/uv/uv.bundle.js" transition:persist is:inline defer></script>
<script src="/uv.config.js" transition:persist is:inline defer></script>
<script src="/epoxy/index.js" transition:persist is:inline defer></script>
<script src="/libcurl/index.js" transition:persist is:inline defer></script>
<script src="/bare_transport.js" transition:persist is:inline defer></script>
<script> <script>
import { initTransport } from "./ts/TransportManager"; import { initTransport, loadSelectedTransportScript } from "./ts/TransportManager";
loadSelectedTransportScript();
let form = document.querySelector("form"); let form = document.querySelector("form");
let input = document.querySelector("input"); let input = document.querySelector("input");
document.addEventListener("astro:after-swap", initForm); document.addEventListener("astro:after-swap", initForm);

View file

@ -81,3 +81,69 @@ export async function initTransport() {
}); });
}); });
} }
export async function loadUltraviolet(): Promise<void> {
return new Promise((resolve) => {
let UVBundle = document.createElement("script");
UVBundle.src = "/uv/uv.bundle.js";
document.body.appendChild(UVBundle);
UVBundle.onload = () => {
resolve();
};
});
}
export async function loadUltravioletConfig(): Promise<void> {
return new Promise((resolve) => {
let UVConfig = document.createElement("script");
UVConfig.src = "/uv.config.js";
document.body.appendChild(UVConfig);
UVConfig.onload = () => {
resolve();
};
});
}
export async function loadSelectedTransportScript(): Promise<void> {
return new Promise((resolve) => {
let selectedTransport = localStorage.getItem("alu__selectedTransport");
if (!selectedTransport) {
localStorage.setItem("alu__selectedTransport", JSON.stringify({ value: "uv" }));
return;
}
let transport = JSON.parse(selectedTransport).value;
console.log(`Loading script for ${transport}`);
let script;
switch (transport) {
case "EpxMod.EpoxyClient": {
script = document.createElement("script");
script.src = "/epoxy/index.js";
script.defer = true;
break;
}
case "CurlMod.LibcurlClient": {
script = document.createElement("script");
script.src = "/libcurl/index.js";
script.defer = true;
break;
}
case "BareMod.BareClient": {
script = document.createElement("script");
script.src = "/bare_transport.js";
script.defer = true;
break;
}
default: {
script = document.createElement("script");
script.src = "/epoxy/index.js";
script.defer = true;
break;
}
}
document.body.appendChild(script);
script.onload = () => {
resolve();
};
});
}

View file

@ -64,14 +64,19 @@ export function getStaticPaths() {
</div> </div>
<ProxyRegistrar /> <ProxyRegistrar />
<script> <script>
import { TransportMgr, initTransport } from "@components/ts/TransportManager"; import { TransportMgr, initTransport, loadSelectedTransportScript, loadUltraviolet, loadUltravioletConfig } from "@components/ts/TransportManager";
document.addEventListener("astro:after-swap", () => { document.addEventListener("astro:after-swap", async () => {
console.log("Updating transport..."); console.log("Updating transport...");
await loadUltraviolet();
await loadUltravioletConfig();
await loadSelectedTransportScript();
TransportMgr.updateTransport(); TransportMgr.updateTransport();
}); });
type Suggestion = { type Suggestion = {
phrase: string; phrase: string;
}; };
await loadUltraviolet();
await loadUltravioletConfig();
async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) { async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) {
if (!urlInput) throw new Error("urlInput is null"); if (!urlInput) throw new Error("urlInput is null");
@ -125,20 +130,8 @@ export function getStaticPaths() {
urlInput.classList.remove("search-results"); urlInput.classList.remove("search-results");
}); });
function debounce(cb: Function, delay = 1000) {
let timeout: string | number | NodeJS.Timeout | undefined;
return (...args: any) => {
clearTimeout(timeout);
timeout = setTimeout(() => {
cb(...args);
}, delay);
};
}
urlInput.addEventListener("keyup", async () => { urlInput.addEventListener("keyup", async () => {
debounce(async () => {
return await sendAPIRequest(urlInput, searchSuggestions); return await sendAPIRequest(urlInput, searchSuggestions);
}, 500)();
}); });
} }
document.addEventListener("astro:after-swap", addEventListeners); document.addEventListener("astro:after-swap", addEventListeners);