Luca Sacchi Ricciardi
893376dc14
Issues fixed:
1. Web Worker localStorage error - Remove localStorage calls from worker
- Worker cannot access localStorage (browser context only)
- Worker now sends data to main thread via postMessage
- Main thread handles all localStorage operations
2. Add favicon to avoid 404 error
- Use inline SVG favicon (llama emoji)
- No external file request
3. Optimize Tailwind CSS for production
- Add tailwind.config.js for content scanning
- Add app/web/static/css/input.css (Tailwind directives)
- Update package.json with tailwind build commands
- Update Dockerfile multi-stage build:
* Stage 1: Node.js - compile Tailwind CSS
* Stage 2: Python - install dependencies
* Stage 3: Runtime - use compiled CSS
- Update index.html to use compiled output.css
- Add fallback to CDN for development
4. Add DEVELOPMENT.md documentation
- Setup instructions for local development
- Tailwind CSS workflow (watch mode)
- Docker build explanation
- Development tips and best practices
Benefits:
- No more localStorage errors in console
- No more 404 favicon requests
- Optimized CSS for production (~30KB minified)
- Clear development workflow
- Multi-stage Docker build is efficient (~300MB image)
83 lines
2.1 KiB
JavaScript
83 lines
2.1 KiB
JavaScript
/**
|
|
* LLM Monitor - Data Sync Worker
|
|
* Aggiorna i dati in background e notifica il main thread
|
|
*/
|
|
|
|
const API_BASE = "/api/v1";
|
|
const REFRESH_INTERVAL = 30000; // 30 secondi
|
|
|
|
// Formattare bytes
|
|
function formatBytes(bytes) {
|
|
if (bytes === 0) return "0 B";
|
|
const k = 1024;
|
|
const sizes = ["B", "KB", "MB", "GB"];
|
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
return (bytes / Math.pow(k, i)).toFixed(2) + " " + sizes[i];
|
|
}
|
|
|
|
// Recuperare health
|
|
async function fetchHealth() {
|
|
try {
|
|
const response = await fetch(`${API_BASE}/health`);
|
|
if (response.ok) {
|
|
const data = await response.json();
|
|
return {
|
|
status: data.status,
|
|
ollama_status: data.ollama_status,
|
|
timestamp: new Date().toISOString()
|
|
};
|
|
}
|
|
} catch (error) {
|
|
console.error("Health check error:", error);
|
|
}
|
|
return null;
|
|
}
|
|
|
|
// Recuperare modelli
|
|
async function fetchModels() {
|
|
try {
|
|
const response = await fetch(`${API_BASE}/models`);
|
|
if (!response.ok) throw new Error("Errore nel caricamento");
|
|
|
|
const data = await response.json();
|
|
const models = data.models || [];
|
|
|
|
return {
|
|
models,
|
|
total: models.length,
|
|
totalSize: formatBytes(models.reduce((sum, m) => sum + m.size, 0)),
|
|
timestamp: new Date().toISOString()
|
|
};
|
|
} catch (error) {
|
|
console.error("Error loading models:", error);
|
|
return null;
|
|
}
|
|
}
|
|
|
|
// Sincronizzare i dati
|
|
async function syncData() {
|
|
const health = await fetchHealth();
|
|
const modelsData = await fetchModels();
|
|
|
|
// Notificare il main thread
|
|
// (il main thread gestisce localStorage)
|
|
self.postMessage({
|
|
type: "DATA_UPDATED",
|
|
health,
|
|
modelsData
|
|
});
|
|
}
|
|
|
|
// Eseguire la sincronizzazione iniziale
|
|
syncData();
|
|
|
|
// Pianificare aggiornamenti periodici
|
|
setInterval(syncData, REFRESH_INTERVAL);
|
|
|
|
// Gestire messaggi dal main thread
|
|
self.onmessage = (event) => {
|
|
if (event.data.type === "SYNC_NOW") {
|
|
syncData();
|
|
}
|
|
};
|