Lots of optimizations :D

index.js

@@ -133,9 +133,8 @@ app.use(function (req, res, next) {
 });
 app.use("/custom-favicon", async (req, res) => {
   try {
-    const { url } = req.query;
+    const { url, type } = req.query;
     const response = await fetch(url).then((apiRes) => apiRes.buffer());
-    res.setHeader("Content-Type", "image/png");
     res.send(response);
   } catch (err) {
     console.log(err)

package.json

@@ -11,7 +11,7 @@
     "lint": "eslint ."
   },
   "dependencies": {
-    "@astrojs/node": "^8.2.0",
+    "@astrojs/node": "^8.2.5",
     "@mercuryworkshop/bare-mux": "^1.0.5",
     "@mercuryworkshop/epoxy-transport": "^1.1.0",
     "@mercuryworkshop/libcurl-transport": "^1.3.1",
@@ -25,11 +25,7 @@
     "dotenv": "^16.3.1",
     "express": "^4.18.2",
     "node-fetch": "^3.3.2",
-    "npm": "^10.2.5",
-    "path": "^0.12.7",
     "rammerhead": "https://github.com/NebulaServices/rammerhead/releases/download/rammerhead-1.2.41-nebula.8/rammerhead-1.2.41-nebula.7.tgz",
-    "ts-debounce": "^4.0.0",
-    "typescript": "^5.3.3",
     "wisp-server-node": "^1.0.2"
   },
   "devDependencies": {

public/games

@@ -1 +1 @@
-Subproject commit 06285f2a5abb58ef55e5127424be59cd46a66ae9
+Subproject commit 8793db1e2fe64cae8936c00bcd4f333f158f6ebd

public/sw.js

@@ -1,7 +1,5 @@
 importScripts("/libcurl/index.js");
-if (!navigator.userAgent.includes("Firefox")) {
-    importScripts("/epoxy/index.js");
-}
+importScripts("/epoxy/index.js");
 importScripts("/bare_transport.js")
 importScripts("/uv/uv.bundle.js");
 importScripts("/uv.config.js");

src/components/ProxyRegistrar.astro

@@ -1,6 +1,11 @@
 <script src="/uv/uv.bundle.js" transition:persist is:inline></script>
 <script src="/uv.config.js" transition:persist is:inline></script>
+<script src="/epoxy/index.js" transition:persist is:inline></script>
+<script src="/libcurl/index.js" transition:persist is:inline></script>
+<script src="/bare_transport.js" transition:persist is:inline></script>
 <script>
+import { initTransport } from "./ts/TransportManager";
+
   let form = document.querySelector("form");
   let input = document.querySelector("input");
   document.addEventListener("astro:after-swap", initForm);
@@ -48,6 +53,7 @@
   }
 
   async function loadContent() {
+    await initTransport();
     let openWith = localStorage.getItem("alu__selectedOpenWith");
     let currentProxy = localStorage.getItem("alu__selectedProxy");
     let url = input!.value.trim();
@@ -55,7 +61,7 @@
     else if (!(url.startsWith("https://") || url.startsWith("http://"))) url = "http://" + url;
     if (openWith) {
       let openWithParsed = JSON.parse(openWith);
-      if (openWithParsed.value === "newTab" || JSON.parse(currentProxy!).value === "rammerhead") {
+      if (openWithParsed.value === "newTab" || (currentProxy && JSON.parse(currentProxy).value === "rammerhead")) {
         window.open(await getProxyURL(), "_blank");
         return;
       }
@@ -130,9 +136,11 @@
 
   async function formEventListener(event: Event) {
     event.preventDefault();
+    setTimeout(() => {
       loadContent();
+    }, 200);
   }
-  (window as any).loadFormContent = loadContent;
+  window.loadFormContent = loadContent;
 
   function isUrl(val = "") {
     if (/^http(s?):\/\//.test(val) || (val.includes(".") && val.substr(0, 1) !== " ")) return true;
@@ -202,7 +210,7 @@
     }
   }
 
-  function updateProxiedFavicon(iframe: HTMLIFrameElement) {
+  function updateProxiedFavicon(iframe: HTMLIFrameElement, hasErrored = false) {
     if (!iframe) return;
     let proxiedFavicon = document.getElementById("proxied-favicon") as HTMLImageElement;
     if (iframe) {
@@ -211,10 +219,13 @@
           iframe.contentDocument.querySelector("link[rel='icon']") as HTMLLinkElement ||
           iframe.contentDocument.querySelector("link[rel*='icon']") as HTMLLinkElement;
           if(favicon && favicon.href) {
-            if (proxiedFavicon.src == `${window.location.origin}/custom-favicon?url=${encodeURIComponent(favicon.href)}`) return;
+            if (proxiedFavicon.src == `${window.location.origin}/custom-favicon?url=${encodeURIComponent(favicon.href)}` || hasErrored) return;
           }
         if (favicon) {
           proxiedFavicon.src = `/custom-favicon?url=${encodeURIComponent(favicon.href)}`;
+          proxiedFavicon.addEventListener("error", () => {
+            proxiedFavicon.src = "/favicon.ico";
+          });
         } else {
           if (proxiedFavicon.src != window.location.origin + "/favicon.ico") {
             proxiedFavicon.src = "/favicon.ico";

src/components/ts/TransportManager.ts

@@ -8,6 +8,7 @@ declare global {
       prefix: string;
       encodeUrl: (url: string) => string;
     };
+    loadFormContent: Function | null;
   }
 }
 
@@ -36,6 +37,17 @@ export default class TransportManager {
       localStorage.setItem("alu__selectedTransport", JSON.stringify({ value: this.transport }));
     }
   }
+  updateTransport() {
+    try {
+      this.setTransport(JSON.parse(localStorage.getItem("alu__selectedTransport")!).value);
+      console.log(this.transport)
+    } catch {
+      console.log("Failed to update transport! Falling back to old transport.")
+      this.setTransport(this.transport);
+    }
+
+  }
+
   getTransport() {
     return this.transport;
   }
@@ -54,6 +66,7 @@ export default class TransportManager {
 
 export const TransportMgr = new TransportManager();
 export async function initTransport() {
+  return new Promise(async (resolve) => {
     await registerRemoteListener(navigator.serviceWorker.controller!);
     await navigator.serviceWorker
       .register("/sw.js", {
@@ -66,5 +79,8 @@ export async function initTransport() {
             localStorage.getItem("alu__wispUrl") || wispURLDefault
           );
         });
+        resolve(null);
       });
+  });
+
 }

src/layouts/Layout.astro

@@ -85,20 +85,6 @@ const { title, optionalPreloads } = Astro.props;
         box-sizing: border-box;
       }
 
-      body {
-        opacity: 0;
-        animation: fadeIn ease 0.4s forwards;
-      }
-
-      @keyframes fadeIn {
-        0% {
-          opacity: 0;
-        }
-        100% {
-          opacity: 1;
-        }
-      }
-
       [data-theme="mocha"] {
         /* Catppucin Mocha theme */
         --background-color: #1e1e2e;
@@ -202,7 +188,8 @@ const { title, optionalPreloads } = Astro.props;
         height: 100%;
       }
       #proxied-favicon {
-        height: 80%;
+        height: 32px;
+        width: 32px;
       }
       #close-button {
         padding: 5px;

src/pages/[lang]/index.astro

@@ -12,8 +12,6 @@ export function getStaticPaths() {
 ---
 
 <Layout title={t("pages.home")}>
-  <script src="/libcurl/index.js" is:inline></script>
-  <script src="/bare_transport.js" is:inline></script>
   <div class="main-content">
     <h1 class="title-text">{t("menu.welcome")}</h1>
     <div class="form-wrapper">
@@ -65,25 +63,11 @@ export function getStaticPaths() {
   </div>
 </Layout>
 <script>
-  import { initTransport, TransportMgr } from "../../components/ts/TransportManager";
-  document.addEventListener("astro:after-swap", async () => {
-    let savedTransport = localStorage.getItem("alu__selectedTransport");
-    if (savedTransport) {
-      let parsedTransport = JSON.parse(savedTransport);
-      TransportMgr.setTransport(parsedTransport.value);
-    }
-    await initTransport();
-  });
-  // Inject Epoxy, Libcurl, and Bare scripts into the DOM
-  // Firefox doesn't support the Epoxy transport, so we don't want to inject it.
-  if (!(navigator.userAgent.indexOf("Firefox") > 0)) {
-    let epoxyScript = document.createElement("script");
-    epoxyScript.src = "/epoxy/index.js";
-    document.body.appendChild(epoxyScript);
-  } else {
-    console.log("Firefox detected, not injecting Epoxy transport!");
-  }
-  await initTransport();
+  import { TransportMgr } from "../../components/ts/TransportManager";
+  document.addEventListener("astro:after-swap", () => {
+    console.log("Updating transport...")
+    TransportMgr.updateTransport();
+  })
   type Suggestion = {
     phrase: string;
   };