Add per-component logging control for Live Components

[MarcosBrendonDePaula]

Summary

Introduces a comprehensive logging system for Live Components that enables fine-grained, per-component control over debug output. Components are silent by default and opt-in to logging via a static logging property, with support for category-based filtering and global configuration via environment variables.

Key Changes

• New LiveLogger module (core/server/live/LiveLogger.ts):

  • Implements liveLog() and liveWarn() functions gated by component configuration
  • Maintains a registry of per-component logging configs
  • Supports 6 log categories: lifecycle, messages, state, performance, rooms, websocket
  • Global logs controlled by LIVE_LOGGING environment variable (supports true, false, or comma-separated categories)

• Updated LiveComponent base class (core/types/types.ts):

  • Added static logging property for per-component configuration
  • Accepts boolean (all categories) or readonly LiveLogCategory[] (specific categories)
  • Defaults to undefined/false (silent)

• Integrated logging throughout Live Components framework:

  • ComponentRegistry: Registers/unregisters component logging on mount/unmount; replaced console.log calls with liveLog()
  • websocket-plugin.ts: Logs WebSocket connection events, authentication, and message handling
  • StateSignature.ts: Logs state signing, compression, encryption, and validation
  • LiveComponentPerformanceMonitor.ts: Logs performance alerts and optimization suggestions
  • LiveRoomManager.ts: Logs room lifecycle events (create, join, leave)
  • LiveComponent methods: Logs broadcast and room event operations

• Documentation:

  • New LLMD/resources/live-logging.md with comprehensive usage guide, category reference, and examples
  • Updated LLMD/config/environment-vars.md with LIVE_LOGGING variable documentation
  • Updated LLMD/INDEX.md to link to logging documentation
  • Updated example component (app/server/live/LiveCounter.ts) with logging enabled

• Exports: Added liveLog, liveWarn, registerComponentLogging, unregisterComponentLogging to core/server/live/index.ts

Implementation Details

• Silent by default: Components must explicitly enable logging via static logging property
• Type-safe: Uses TypeScript as const pattern for category arrays to ensure type safety
• Lazy parsing: Global config from LIVE_LOGGING env var is parsed once and cached
• No performance impact when disabled: shouldLog() checks registry before any console output
• Consistent emoji prefixes: All logs use emoji indicators for quick visual scanning (🚀, 📡, 🔒, etc.)
• console.error always visible: Error-level logs are not gated by configuration

https://claude.ai/code/session_013UpdCKDUobQ4Vn3fBeBeBN