hightjs 0.2.42 → 0.2.43

package/src/hotReload.ts

@@ -6,28 +6,45 @@ import { IncomingMessage } from 'http';
 import * as url from 'url';
 import { clearFileCache } from './router';
 import Console, {Levels} from "./api/console"
+
+interface ClientConnection {
+    ws: WebSocket;
+    pingTimer: NodeJS.Timeout;
+    lastPong: number;
+}
+
 export class HotReloadManager {
     private wss: WebSocketServer | null = null;
     private watchers: chokidar.FSWatcher[] = [];
     private projectDir: string;
-    private clients: Set<WebSocket> = new Set();
-    private pingInterval: NodeJS.Timeout | null = null;
+    private clients: Map<WebSocket, ClientConnection> = new Map();
     private backendApiChangeCallback: (() => void) | null = null;
     private frontendChangeCallback: (() => void) | null = null;
+    private isShuttingDown: boolean = false;
+    private debounceTimers: Map<string, NodeJS.Timeout> = new Map();
+    private customHotReloadListener: ((file: string) => Promise<void> | void) | null = null;
 
     constructor(projectDir: string) {
         this.projectDir = projectDir;
     }
 
     async start() {
-        // Não cria servidor na porta separada - será integrado ao Express
         this.setupWatchers();
     }
 
-    // Novo método para integrar com Express
+    // Método para integrar com Express
     handleUpgrade(request: IncomingMessage, socket: any, head: Buffer) {
+        if (this.isShuttingDown) {
+            socket.destroy();
+            return;
+        }
+
         if (!this.wss) {
-            this.wss = new WebSocketServer({ noServer: true });
+            this.wss = new WebSocketServer({
+                noServer: true,
+                perMessageDeflate: false, // Desabilita compressão para melhor performance
+                maxPayload: 1024 * 1024 // Limite de 1MB por mensagem
+            });
             this.setupWebSocketServer();
         }
 
@@ -40,200 +57,350 @@ export class HotReloadManager {
         if (!this.wss) return;
 
         this.wss.on('connection', (ws: WebSocket) => {
-            this.clients.add(ws);
+            if (this.isShuttingDown) {
+                ws.close();
+                return;
+            }
 
-            // Setup ping/pong para manter conexão viva
-            const ping = () => {
-                if (ws.readyState === WebSocket.OPEN) {
+            // Setup ping/pong para detectar conexões mortas
+            const pingTimer = setInterval(() => {
+                const client = this.clients.get(ws);
+                if (client && ws.readyState === WebSocket.OPEN) {
+                    // Se não recebeu pong há mais de 60 segundos, desconecta
+                    if (Date.now() - client.lastPong > 60000) {
+                        ws.terminate();
+                        return;
+                    }
                     ws.ping();
                 }
+            }, 30000);
+
+            const clientConnection: ClientConnection = {
+                ws,
+                pingTimer,
+                lastPong: Date.now()
             };
 
-            const pingTimer = setInterval(ping, 30000); // Ping a cada 30 segundos
+            this.clients.set(ws, clientConnection);
 
             ws.on('pong', () => {
-                // Cliente respondeu ao ping - conexão ainda ativa
+                const client = this.clients.get(ws);
+                if (client) {
+                    client.lastPong = Date.now();
+                }
             });
 
             ws.on('close', () => {
-                this.clients.delete(ws);
-                clearInterval(pingTimer);
+                this.cleanupClient(ws);
             });
 
-            ws.on('error', () => {
-                this.clients.delete(ws);
-                clearInterval(pingTimer);
+            ws.on('error', (error) => {
+                Console.logWithout(Levels.ERROR, `WebSocket error: ${error.message}`);
+                this.cleanupClient(ws);
             });
+
+            Console.logWithout(Levels.INFO, '🔌 Hot-reload cliente conectado');
         });
     }
 
+    private cleanupClient(ws: WebSocket) {
+        const client = this.clients.get(ws);
+        if (client) {
+            clearInterval(client.pingTimer);
+            this.clients.delete(ws);
+        }
+    }
+
     private setupWatchers() {
-        // 1. Watcher para arquivos frontend (rotas, componentes) - EXCLUINDO backend
-        const frontendWatcher = chokidar.watch([
-            path.join(this.projectDir, 'src/web/**/*.{tsx,ts,jsx,js}'),
+        // Remove watchers antigos e use apenas um watcher global para src
+        const debouncedChange = this.debounce((filePath: string) => {
+            this.handleAnySrcChange(filePath);
+        }, 100);
+
+        const watcher = chokidar.watch([
+            path.join(this.projectDir, 'src/**/*'),
         ], {
             ignored: [
                 /(^|[\/\\])\../, // arquivos ocultos
-                path.join(this.projectDir, 'src/web/backend/**/*') // exclui toda a pasta backend
+                '**/node_modules/**',
+                '**/.git/**',
+                '**/dist/**'
             ],
             persistent: true,
-            ignoreInitial: true
-        });
-
-        frontendWatcher.on('change', async (filePath) => {
-            Console.logWithout(Levels.INFO, `🔄 Frontend alterado: ${filePath}`);
-            clearFileCache(filePath);
-            // Checa build do arquivo alterado
-            const result = await this.checkFrontendBuild(filePath);
-            if (result.error) {
-                this.notifyClients('frontend-error', { file: filePath, error: result.error });
-            } else {
-                this.frontendChangeCallback?.();
-                this.notifyClients('frontend-reload');
-            }
-        });
-        frontendWatcher.on('add', async (filePath) => {
-            Console.info(`➕ Novo arquivo frontend: ${path.basename(filePath)}`);
-            const result = await this.checkFrontendBuild(filePath);
-            if (result.error) {
-                this.notifyClients('frontend-error', { file: filePath, error: result.error });
-            } else {
-                this.frontendChangeCallback?.();
-                this.notifyClients('frontend-reload');
+            ignoreInitial: true,
+            usePolling: false,
+            awaitWriteFinish: {
+                stabilityThreshold: 100,
+                pollInterval: 50
             }
         });
-        frontendWatcher.on('unlink', (filePath) => {
-            Console.info(`🗑️ Arquivo frontend removido: ${path.basename(filePath)}`);
+
+        watcher.on('change', debouncedChange);
+        watcher.on('add', debouncedChange);
+        watcher.on('unlink', (filePath) => {
+            Console.info(`🗑️ Arquivo removido: ${path.basename(filePath)}`);
             clearFileCache(filePath);
+            this.clearBackendCache(filePath);
             this.frontendChangeCallback?.();
-            this.notifyClients('frontend-reload');
+            this.backendApiChangeCallback?.();
+            this.notifyClients('src-reload', { file: filePath, event: 'unlink' });
         });
 
-        // 2. Watcher específico para rotas de API backend
-        const backendApiWatcher = chokidar.watch([
-            path.join(this.projectDir, 'src/web/backend/routes/**/*.{ts,tsx,js,jsx}'),
-        ], {
-            ignored: /(^|[\/\\])\../,
-            persistent: true,
-            ignoreInitial: true
-        });
+        this.watchers.push(watcher);
+    }
 
-        backendApiWatcher.on('change', (filePath) => {
-            Console.info(`🔄 API backend alterada: ${path.basename(filePath)}`);
-            this.clearBackendCache(filePath);
-            this.notifyClients('backend-api-reload');
+    private debounce(func: Function, wait: number): (...args: any[]) => void {
+        return (...args: any[]) => {
+            const key = args[0]; // usa o primeiro argumento como chave
 
-            // Chama o callback, se definido
-            this.backendApiChangeCallback?.();
-        });
+            const existingTimer = this.debounceTimers.get(key);
+            if (existingTimer) {
+                clearTimeout(existingTimer);
+            }
 
-        backendApiWatcher.on('add', (filePath) => {
-            Console.info(`➕ Nova API backend: ${path.basename(filePath)}`);
-            this.notifyClients('backend-api-reload');
-        });
+            const timer = setTimeout(() => {
+                this.debounceTimers.delete(key);
+                func.apply(this, args);
+            }, wait);
 
-        backendApiWatcher.on('unlink', (filePath) => {
-            Console.info(`🗑️ API backend removida: ${path.basename(filePath)}`);
-            this.clearBackendCache(filePath);
-            this.notifyClients('backend-api-reload');
-        });
+            this.debounceTimers.set(key, timer);
+        };
+    }
 
-        // 3. Watcher para arquivos backend (server.ts, configs)
-        const backendWatcher = chokidar.watch([
-            path.join(this.projectDir, 'src/server.ts'),
-            path.join(this.projectDir, 'src/**/*.ts'),
-            '!**/src/web/**', // exclui pasta web
-        ], {
-            ignored: /(^|[\/\\])\../,
-            persistent: true,
-            ignoreInitial: true
-        });
+    private async handleAnySrcChange(filePath: string) {
+        Console.logWithout(Levels.INFO, `🔄 Arquivo alterado: ${path.basename(filePath)}`);
 
-        backendWatcher.on('change', () => {
-            this.restartServer();
-        });
+        // Detecta se é arquivo de frontend ou backend
+        const isFrontendFile = filePath.includes(path.join('src', 'web', 'routes')) ||
+                               filePath.includes(path.join('src', 'web', 'components')) ||
+                               filePath.includes('layout.tsx') ||
+                               filePath.includes('not-found.tsx') ||
+                               filePath.endsWith('.tsx') ||
+                               filePath.endsWith('.jsx');
+
+        const isBackendFile = filePath.includes(path.join('src', 'web', 'backend')) ||
+                              (filePath.includes(path.join('src', 'web')) && !isFrontendFile);
+
+        // Limpa o cache do arquivo alterado
+        clearFileCache(filePath);
+        this.clearBackendCache(filePath);
+
+        // Checa build se for .ts/.tsx/.js/.jsx
+        const ext = path.extname(filePath);
+        if ([".ts", ".tsx", ".js", ".jsx"].includes(ext)) {
+            const result = await this.checkFrontendBuild(filePath);
+            if (result.error) {
+                this.notifyClients('src-error', { file: filePath, error: result.error });
+                return;
+            }
+        }
 
-        this.watchers.push(frontendWatcher, backendApiWatcher, backendWatcher);
+        // Se for arquivo de frontend, notifica o cliente para recarregar a página
+        if (isFrontendFile) {
+            Console.logWithout(Levels.INFO, `📄 Recarregando frontend...`);
+            this.frontendChangeCallback?.();
+            this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+        }
+
+        // Se for arquivo de backend, recarrega o módulo e notifica
+        if (isBackendFile) {
+            Console.logWithout(Levels.INFO, `⚙️ Recarregando backend...`);
+            this.backendApiChangeCallback?.();
+            this.notifyClients('backend-api-reload', { file: filePath, event: 'change' });
+        }
+
+        // Fallback: se não for nem frontend nem backend detectado, recarrega tudo
+        if (!isFrontendFile && !isBackendFile) {
+            Console.logWithout(Levels.INFO, `🔄 Recarregando aplicação...`);
+            this.frontendChangeCallback?.();
+            this.backendApiChangeCallback?.();
+            this.notifyClients('src-reload', { file: filePath, event: 'change' });
+        }
+
+        // Chama listener customizado se definido
+        if (this.customHotReloadListener) {
+            try {
+                await this.customHotReloadListener(filePath);
+            } catch (error) {
+                // @ts-ignore
+                Console.logWithout(Levels.ERROR, `Erro no listener customizado: ${error.message}`);
+            }
+        }
     }
 
     private notifyClients(type: string, data?: any) {
-        const message = JSON.stringify({ type, data, timestamp: Date.now() });
+        if (this.isShuttingDown || this.clients.size === 0) {
+            return;
+        }
 
-        this.clients.forEach((client) => {
-            if (client.readyState === WebSocket.OPEN) {
-                client.send(message);
+        const message = JSON.stringify({ type, data, timestamp: Date.now() });
+        const deadClients: WebSocket[] = [];
+
+        this.clients.forEach((client, ws) => {
+            if (ws.readyState === WebSocket.OPEN) {
+                try {
+                    ws.send(message);
+                } catch (error) {
+                    Console.logWithout(Levels.ERROR, `Erro ao enviar mensagem WebSocket: ${error}`);
+                    deadClients.push(ws);
+                }
+            } else {
+                deadClients.push(ws);
             }
         });
+
+        // Remove clientes mortos
+        deadClients.forEach(ws => this.cleanupClient(ws));
     }
 
     private restartServer() {
-        // Notifica clientes que o servidor está reiniciando
         this.notifyClients('server-restart');
-
-        // Aguarda um pouco e tenta reconectar
         setTimeout(() => {
             this.notifyClients('server-ready');
         }, 2000);
     }
 
     stop() {
+        this.isShuttingDown = true;
+
+        // Limpa todos os debounce timers
+        this.debounceTimers.forEach(timer => clearTimeout(timer));
+        this.debounceTimers.clear();
+
         // Para todos os watchers
         this.watchers.forEach(watcher => watcher.close());
         this.watchers = [];
 
-        // Para ping interval
-        if (this.pingInterval) {
-            clearInterval(this.pingInterval);
-        }
+        // Limpa todos os clientes
+        this.clients.forEach((client, ws) => {
+            clearInterval(client.pingTimer);
+            if (ws.readyState === WebSocket.OPEN) {
+                ws.close();
+            }
+        });
+        this.clients.clear();
 
         // Fecha WebSocket server
         if (this.wss) {
             this.wss.close();
+            this.wss = null;
         }
     }
 
-    // Retorna o script do cliente para injetar no HTML
+    // Script do cliente otimizado com reconnection backoff
     getClientScript(): string {
         return `
         <script>
         (function() {
             if (typeof window !== 'undefined') {
                 let ws;
-                let reconnectInterval;
+                let reconnectAttempts = 0;
+                let maxReconnectInterval = 30000; // 30 segundos max
+                let reconnectInterval = 1000; // Começa com 1 segundo
+                let reconnectTimer;
+                let isConnected = false;
                 
                 function connect() {
-                    ws = new WebSocket('ws://localhost:3000/hweb-hotreload/');
+                    // Evita múltiplas tentativas simultâneas
+                    if (ws && (ws.readyState === WebSocket.CONNECTING || ws.readyState === WebSocket.OPEN)) {
+                        return;
+                    }
+
+                    try {
+                        ws = new WebSocket('ws://localhost:3000/hweb-hotreload/');
+                        
+                        ws.onopen = function() {
+                            console.log('🔌 Hot-reload conectado');
+                            isConnected = true;
+                            reconnectAttempts = 0;
+                            reconnectInterval = 1000;
+                            clearTimeout(reconnectTimer);
+                        };
+                        
+                        ws.onmessage = function(event) {
+                            try {
+                                const message = JSON.parse(event.data);
+                                
+                                switch(message.type) {
+                                    case 'frontend-reload':
+                                        window.location.reload();
+                                        break;
+                                    case 'backend-api-reload':
+                                        // Recarrega apenas se necessário
+                                        window.location.reload();
+                                        break;
+                                    case 'server-restart':
+                                        console.log('🔄 Servidor reiniciando...');
+                                        break;
+                                    case 'server-ready':
+                                        setTimeout(() => window.location.reload(), 500);
+                                        break;
+                                    case 'frontend-error':
+                                        console.error('❌ Erro no frontend:', message.data);
+                                        break;
+                                }
+                            } catch (e) {
+                                console.error('Erro ao processar mensagem do hot-reload:', e);
+                            }
+                        };
+                        
+                        ws.onclose = function(event) {
+                            isConnected = false;
+                            
+                            // Não tenta reconectar se foi fechamento intencional
+                            if (event.code === 1000) {
+                                return;
+                            }
+                            
+                            scheduleReconnect();
+                        };
+                        
+                        ws.onerror = function(error) {
+                            isConnected = false;
+                            // Não loga erros de conexão para evitar spam no console
+                        };
+                        
+                    } catch (error) {
+                        console.error('Erro ao criar WebSocket:', error);
+                        scheduleReconnect();
+                    }
+                }
+                
+                function scheduleReconnect() {
+                    if (reconnectTimer) {
+                        clearTimeout(reconnectTimer);
+                    }
                     
-                    ws.onopen = function() {
-                        clearInterval(reconnectInterval);
-                    };
+                    reconnectAttempts++;
                     
-                    ws.onmessage = function(event) {
-                        const message = JSON.parse(event.data);
-                        
-                        switch(message.type) {
-                            case 'frontend-reload':
-                                window.location.reload();
-                                break;
-                            case 'server-restart':
-                                break;
-                            case 'server-ready':
-                                setTimeout(() => window.location.reload(), 500);
-                                break;
-                        }
-                    };
+                    // Exponential backoff com jitter
+                    const baseInterval = Math.min(reconnectInterval * Math.pow(1.5, reconnectAttempts - 1), maxReconnectInterval);
+                    const jitter = Math.random() * 1000; // Adiciona até 1 segundo de variação
+                    const finalInterval = baseInterval + jitter;
                     
-                    ws.onclose = function() {
-                        reconnectInterval = setInterval(() => {
+                    reconnectTimer = setTimeout(() => {
+                        if (!isConnected) {
                             connect();
-                        }, 1000);
-                    };
-                    
-                    ws.onerror = function() {
-                        // Silencioso - sem logs
-                    };
+                        }
+                    }, finalInterval);
                 }
                 
+                // Detecta quando a página está sendo fechada para evitar reconexões desnecessárias
+                window.addEventListener('beforeunload', function() {
+                    if (ws && ws.readyState === WebSocket.OPEN) {
+                        ws.close(1000, 'Page unloading');
+                    }
+                    clearTimeout(reconnectTimer);
+                });
+                
+                // Detecta quando a aba fica visível novamente para reconectar se necessário
+                document.addEventListener('visibilitychange', function() {
+                    if (!document.hidden && !isConnected) {
+                        reconnectAttempts = 0; // Reset do contador quando a aba fica ativa
+                        connect();
+                    }
+                });
+                
                 connect();
             }
         })();
@@ -242,48 +409,67 @@ export class HotReloadManager {
     }
 
     private clearBackendCache(filePath: string) {
-        // Limpa o cache do require para forçar reload da rota de API
         const absolutePath = path.resolve(filePath);
         delete require.cache[absolutePath];
 
-        // Também limpa dependências relacionadas
+        // Limpa dependências relacionadas de forma mais eficiente
+        const dirname = path.dirname(absolutePath);
         Object.keys(require.cache).forEach(key => {
-            if (key.includes(path.dirname(absolutePath))) {
+            if (key.startsWith(dirname)) {
                 delete require.cache[key];
             }
         });
     }
 
-    // Método para registrar callback de mudança de API backend
     onBackendApiChange(callback: () => void) {
         this.backendApiChangeCallback = callback;
     }
 
-    // Método para registrar callback de mudança de frontend
     onFrontendChange(callback: () => void) {
         this.frontendChangeCallback = callback;
     }
 
+    setHotReloadListener(listener: (file: string) => Promise<void> | void) {
+        this.customHotReloadListener = listener;
+        Console.info('🔌 Hot reload listener customizado registrado');
+    }
+
+    removeHotReloadListener() {
+        this.customHotReloadListener = null;
+    }
+
     private async checkFrontendBuild(filePath: string) {
-        // Usa ts-node para checar erros de compilação do arquivo alterado
-        const tsNodePath = require.resolve('ts-node');
-        const { spawn } = require('child_process');
-        return new Promise<{ error?: string }>((resolve) => {
-            const proc = spawn(process.execPath, [tsNodePath, '--transpile-only', filePath], {
-                cwd: this.projectDir,
-                env: process.env,
-            });
-            let errorMsg = '';
-            proc.stderr.on('data', (data: Buffer) => {
-                errorMsg += data.toString();
-            });
-            proc.on('close', (code: number) => {
-                if (code !== 0 && errorMsg) {
-                    resolve({ error: errorMsg });
-                } else {
-                    resolve({});
-                }
+        try {
+            const tsNodePath = require.resolve('ts-node');
+            const { spawn } = require('child_process');
+
+            return new Promise<{ error?: string }>((resolve) => {
+                const proc = spawn(process.execPath, [tsNodePath, '--transpile-only', filePath], {
+                    cwd: this.projectDir,
+                    env: process.env,
+                    timeout: 10000 // Timeout de 10 segundos
+                });
+
+                let errorMsg = '';
+
+                proc.stderr.on('data', (data: Buffer) => {
+                    errorMsg += data.toString();
+                });
+
+                proc.on('close', (code: number) => {
+                    if (code !== 0 && errorMsg) {
+                        resolve({ error: errorMsg });
+                    } else {
+                        resolve({});
+                    }
+                });
+
+                proc.on('error', (error: Error) => {
+                    resolve({ error: error.message });
+                });
             });
-        });
+        } catch (error) {
+            return { error: `Erro ao verificar build: ${error}` };
+        }
     }
 }