Freeze-Fixed

static/app.js

@@ -11,6 +11,11 @@ const logoutBtn = document.getElementById("logout-btn");
 const stlLoader = new STLLoader();
 const mfLoader = new ThreeMFLoader();
 
+// Files above this size are not auto-loaded into a 3D preview, since
+// parsing a huge mesh can freeze the browser tab. The user can opt in
+// via a button instead.
+const PREVIEW_SIZE_LIMIT = 150 * 1024 * 1024; // 150 MB
+
 let currentProject = null;
 const activeViewers = []; // track for cleanup / resize
 
@@ -375,10 +380,32 @@ async function loadFileGrid(projectName, container) {
 
     grid.appendChild(card);
     const canvasHost = card.querySelector(".file-card-canvas");
-    initViewer(canvasHost, `/api/projects/${encodeURIComponent(projectName)}/files/${encodeURIComponent(file.name)}`, file.type);
+    const fileUrlForViewer = `/api/projects/${encodeURIComponent(projectName)}/files/${encodeURIComponent(file.name)}`;
+
+    if (file.size > PREVIEW_SIZE_LIMIT) {
+      renderLazyPreviewPlaceholder(canvasHost, fileUrlForViewer, file.type, file.size);
+    } else {
+      initViewer(canvasHost, fileUrlForViewer, file.type);
+    }
   }
 }
 
+function renderLazyPreviewPlaceholder(host, url, type, size) {
+  host.style.position = "relative";
+  const wrap = document.createElement("div");
+  wrap.className = "preview-placeholder";
+  wrap.innerHTML = `
+    <span class="preview-placeholder-text">Große Datei (${formatSize(size)})<br />keine automatische Vorschau</span>
+    <button class="btn preview-load-btn" type="button">Vorschau laden</button>
+  `;
+  host.appendChild(wrap);
+
+  wrap.querySelector(".preview-load-btn").addEventListener("click", () => {
+    wrap.remove();
+    initViewer(host, url, type);
+  });
+}
+
 // ---------- Three.js viewer ----------
 
 function initViewer(host, url, type) {

static/style.css

@@ -348,6 +348,29 @@ button {
   height: 100%;
 }
 
+.preview-placeholder {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 16px;
+  text-align: center;
+}
+
+.preview-placeholder-text {
+  font-size: 12px;
+  color: var(--text-muted);
+  line-height: 1.5;
+}
+
+.preview-load-btn {
+  padding: 7px 14px;
+  font-size: 13px;
+}
+
 .file-card-info {
   padding: 12px 14px;
   display: flex;