move ws out of window.onload

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "rusty-live-server"
-version = "0.5.0"
+version = "0.5.1"
 edition = "2021"
 
 [dependencies]

src/routing.rs

@@ -102,17 +102,15 @@ async fn serve_file(
         .to_str()
         .unwrap_or_default()
         .ends_with(".html");
-    let mut contents = Vec::new();
+    let mut contents = fs.get_file(file_path).await?.read_to_end().await;
     if is_html {
         contents.append(
-            &mut format!("<script>{}</script>", include_str!("updater.js"))
+            &mut format!("<script defer>{}</script>", include_str!("updater.js"))
                 .as_bytes()
                 .to_vec(),
         )
     }
 
-    contents.append(&mut fs.get_file(file_path).await?.read_to_end().await);
-
     let response = format!(
         "HTTP/1.1 200 OK\r\nContent-Length: {}\r\n\r\n",
         contents.len()

src/updater.js

@@ -2,39 +2,36 @@ function getAbsoluteUrl(url) {
   return new URL(url, window.location).href;
 }
 
-window.onload = () => {
-  const socket = new WebSocket(`ws://${window.location.host}/ws`);
-
-  socket.onmessage = (event) => {
-    if (event.data === "reload") {
-      window.location.reload();
-    } else if (event.data.startsWith("update-css://")) {
-      const filePath = event.data.substring(13);
-      const links = document.getElementsByTagName("link");
-      for (const link of links) {
-        if (link.rel !== "stylesheet") continue;
-        const clonedLink = link.cloneNode(true);
-        if (getAbsoluteUrl(link.href).startsWith(getAbsoluteUrl(filePath))) {
-          const indexOf = link.href.indexOf("?");
-          if (indexOf !== -1 && link.href.slice(indexOf).includes("counter=")) {
-            const url = new URL(link.href);
-            const params = new URLSearchParams(url.search);
-            const counter = params.get("counter");
-            if (counter) {
-              params.set("counter", Number.parseInt(counter) + 1);
-            }
-            url.search = params.toString();
-            clonedLink.href = url.toString();
-          } else {
-            clonedLink.href += `${indexOf !== -1 ? "&" : "?"}counter=1`;
+const socket = new WebSocket(`ws://${window.location.host}/ws`);
+socket.onmessage = (event) => {
+  if (event.data === "reload") {
+    window.location.reload();
+  } else if (event.data.startsWith("update-css://")) {
+    const filePath = event.data.substring(13);
+    const links = document.getElementsByTagName("link");
+    for (const link of links) {
+      if (link.rel !== "stylesheet") continue;
+      const clonedLink = link.cloneNode(true);
+      if (getAbsoluteUrl(link.href).startsWith(getAbsoluteUrl(filePath))) {
+        const indexOf = link.href.indexOf("?");
+        if (indexOf !== -1 && link.href.slice(indexOf).includes("counter=")) {
+          const url = new URL(link.href);
+          const params = new URLSearchParams(url.search);
+          const counter = params.get("counter");
+          if (counter) {
+            params.set("counter", Number.parseInt(counter) + 1);
           }
+          url.search = params.toString();
+          clonedLink.href = url.toString();
+        } else {
+          clonedLink.href += `${indexOf !== -1 ? "&" : "?"}counter=1`;
         }
-        link.replaceWith(clonedLink);
       }
+      link.replaceWith(clonedLink);
     }
-  };
+  }
+};
 
-  socket.onerror = (error) => {
-    console.error("Reload WebSocket error:", error);
-  };
+socket.onerror = (error) => {
+  console.error("Reload WebSocket error:", error);
 };