// 1. 創(chuàng)建 Web Worker
const dataWorker = new Worker('./dataAggregator.worker.js');

// 2. 從 WebSocket 接收原始數(shù)據(jù)
const ws = new WebSocket('wss://api.example.com/trades');
ws.onmessage = (event) => {
  const rawData = JSON.parse(event.data);
  
  // 3. 發(fā)送原始數(shù)據(jù)到 Worker（避免 JSON 序列化開銷）
  const buffer = new ArrayBuffer(rawData.length * 4);
  const view = new DataView(buffer);
  rawData.forEach((val, i) => view.setFloat32(i * 4, val.price));
  dataWorker.postMessage(buffer, [buffer]); // 使用 Transferable 對象
};

// 4. 接收聚合結(jié)果
dataWorker.onmessage = (event) => {
  const { heatmapData } = event.data;
  renderHeatmap(heatmapData); // 主線程只負責(zé)渲染
};

self.onmessage = (event) => {
  // 1. 接收二進制數(shù)據(jù)（零拷貝）
  const buffer = event.data;
  const view = new DataView(buffer);
  const prices = [];
  
  // 2. 解析二進制數(shù)據(jù)
  for (let i = 0; i < buffer.byteLength / 4; i++) {
    prices.push(view.getFloat32(i * 4));
  }

  // 3. 執(zhí)行聚合計算（耗時操作）
  const heatmapData = prices.reduce((acc, price) => {
    const timeSlot = Math.floor(Date.now() / 1000) * 1000; // 按秒聚合
    if (!acc[timeSlot]) acc[timeSlot] = { sum: 0, count: 0 };
    acc[timeSlot].sum += price;
    acc[timeSlot].count++;
    return acc;
  }, {});

  // 4. 返回結(jié)果（通過結(jié)構(gòu)化克隆）
  self.postMessage({ heatmapData });
};

// 1. 創(chuàng)建 Worker 池（4 線程并行）
const workers = Array.from({ length: 4 }, () => new Worker('./imageProcessor.worker.js'));

// 2. 用戶選擇圖片后分片處理
input.addEventListener('change', async (e) => {
  const image = await loadImage(e.target.files);
  const canvas = document.createElement('canvas');
  const ctx = canvas.getContext('2d');
  ctx.drawImage(image, 0, 0);
  
  // 3. 獲取像素數(shù)據(jù)并分片
  const imageData = ctx.getImageData(0, 0, image.width, image.height);
  const totalPixels = imageData.data.length;
  const chunkSize = Math.ceil(totalPixels / workers.length);
  
  // 4. 分配任務(wù)到 Worker
  workers.forEach((worker, i) => {
    const start = i * chunkSize;
    const end = Math.min(start + chunkSize, totalPixels);
    const chunk = new Uint8ClampedArray(imageData.data.slice(start, end));
    
    // 使用 Transferable 對象傳輸
    worker.postMessage({
      chunk,
      width: image.width,
      startIndex: start
    }, [chunk.buffer]);
  });
});

self.onmessage = (event) => {
  // 1. 接收圖像分片數(shù)據(jù)
  const { chunk, width, startIndex } = event.data;
  
  // 2. 應(yīng)用高斯模糊濾鏡（核心算法）
  const processedChunk = applyGaussianBlur(chunk, width);
  
  // 3. 返回處理結(jié)果
  self.postMessage({
    chunk: processedChunk,
    startIndex
  });
};

function applyGaussianBlur(data, width) {
  // 實現(xiàn)卷積運算（此處為簡化示例）
  const kernel = [1, 2, 1, 2, 4, 2, 1, 2, 1];
  const result = new Uint8ClampedArray(data.length);
  
  for (let i = 0; i < data.length; i += 4) {
    // 每個像素計算耗時約 0.1ms
    const neighbors = getNeighbors(i, width, data);
    const r = convolve(neighbors.r, kernel);
    const g = convolve(neighbors.g, kernel);
    const b = convolve(neighbors.b, kernel);
    
    result.set([r, g, b, 255], i);
  }
  
  return result;
}

// 1. 創(chuàng)建 AudioWorklet + Worker 混合架構(gòu)
const audioContext = new AudioContext();
await audioContext.audioWorklet.addModule('audio-processor.js');

// 2. 創(chuàng)建 Web Worker 進行特征分析
const audioWorker = new Worker('./audioAnalyzer.worker.js');

// 3. 設(shè)置音頻輸入流
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
  const source = audioContext.createMediaStreamSource(stream);
  const workletNode = new AudioWorkletNode(audioContext, 'audio-processor');
  
  source.connect(workletNode);
  workletNode.port.onmessage = (event) => {
    // 4. 將音頻數(shù)據(jù)發(fā)送到 Worker
    audioWorker.postMessage(event.data.audioBuffer);
  };
});

// 5. 接收分析結(jié)果
audioWorker.onmessage = (event) => {
  displaySpeechStats(event.data.pitch, event.data.volume);
};

class AudioProcessor extends AudioWorkletProcessor {
  process(inputs) {
    const inputBuffer = inputs; // 獲取單聲道數(shù)據(jù)
    this.port.postMessage({ audioBuffer: inputBuffer });
    return true;
  }
}
registerProcessor('audio-processor', AudioProcessor);

self.onmessage = (event) => {
  // 1. 接收原始 PCM 數(shù)據(jù)
  const audioData = event.data;
  
  // 2. 執(zhí)行 FFT 和特征分析
  const fftResult = performFFT(audioData);
  const pitch = calculatePitch(fftResult);
  const volume = calculateRMS(audioData);
  
  // 3. 返回實時分析結(jié)果
  self.postMessage({ pitch, volume });
};

function performFFT(data) {
  // 使用漢寧窗和 2048 點 FFT
  const windowedData = applyHanningWindow(data);
  const fft = new FFT(2048);
  fft.forward(windowedData);
  return fft.spectrum;
}