Function init

examples/worker-rendering/main.ts:728–776

()

// ============================================================================

function init(): void {
  initializeMetricsDisplay();
  
  // Initialize total points display
  updateTotalPointsDisplay();

  // Button event listeners
  document.getElementById('btnGenerate')?.addEventListener('click', handleGenerate);
  document.getElementById('btnStream')?.addEventListener('click', handleStartStreaming);
  document.getElementById('btnClear')?.addEventListener('click', handleClear);
  document.getElementById('btnEmergency')?.addEventListener('click', handleEmergencyStop);

  // Update total points display when inputs change
  document.getElementById('pointCount')?.addEventListener('input', () => updateTotalPointsDisplay());
  document.getElementById('seriesCount')?.addEventListener('input', () => updateTotalPointsDisplay());

  // Resize handling
  let resizeScheduled = false;
  const resizeObserver = new ResizeObserver(() => {
    if (resizeScheduled || !state.chart) return;
    resizeScheduled = true;
    requestAnimationFrame(() => {
      resizeScheduled = false;
      state.chart?.resize();
    });
  });

  const container = document.getElementById('chart');
  if (container) {
    resizeObserver.observe(container);
  }

  // Cleanup on page unload
  window.addEventListener('beforeunload', () => {
    stopStreaming();
    disposeChart();
  });

  // HMR cleanup
  if (import.meta.hot) {
    import.meta.hot.dispose(() => {
      stopStreaming();
      disposeChart();
      resizeObserver.disconnect();
    });
  }

  showStatus('Ready. Configure and generate your benchmark.', 'success');
}

// Start the app
if (document.readyState === 'loading') {