当前位置:首页 > JavaScript

js实现线程池

2026-04-07 11:24:06JavaScript

实现线程池的基本概念

JavaScript 是单线程语言,但通过 Web Workers 可以实现多线程。线程池(Thread Pool)是一种管理多个 Worker 线程的机制,用于优化资源利用和任务调度。

js实现线程池

使用 Web Workers 创建线程池

Web Workers 允许在后台运行脚本,独立于主线程。以下是一个简单的线程池实现:

js实现线程池

class ThreadPool {
  constructor(size) {
    this.size = size;
    this.workers = [];
    this.taskQueue = [];
    this.initializeWorkers();
  }

  initializeWorkers() {
    for (let i = 0; i < this.size; i++) {
      const worker = new Worker('worker.js');
      worker.onmessage = (event) => {
        this.handleWorkerResponse(worker, event);
      };
      this.workers.push(worker);
    }
  }

  handleWorkerResponse(worker, event) {
    const taskCallback = this.taskQueue.shift();
    if (taskCallback) {
      worker.postMessage(taskCallback.data);
    }
  }

  executeTask(data, callback) {
    if (this.workers.length > 0) {
      const worker = this.workers.pop();
      worker.postMessage(data);
      worker.onmessage = (event) => {
        callback(event.data);
        this.workers.push(worker);
        this.processQueue();
      };
    } else {
      this.taskQueue.push({ data, callback });
    }
  }

  processQueue() {
    if (this.taskQueue.length > 0 && this.workers.length > 0) {
      const { data, callback } = this.taskQueue.shift();
      this.executeTask(data, callback);
    }
  }
}

Worker 脚本示例

创建 worker.js 文件,用于处理实际任务:

self.onmessage = function(event) {
  const result = performTask(event.data);
  self.postMessage(result);
};

function performTask(data) {
  // 模拟耗时任务
  return data * 2;
}

使用线程池

在主线程中初始化并使用线程池:

const pool = new ThreadPool(4);

pool.executeTask(10, (result) => {
  console.log('Task result:', result);
});

pool.executeTask(20, (result) => {
  console.log('Task result:', result);
});

优化线程池

  1. 错误处理:添加 Worker 的 onerror 事件处理,确保任务失败时有备用方案。
  2. 任务优先级:扩展 taskQueue 支持优先级队列,高优先级任务优先执行。
  3. 动态调整:根据系统负载动态增加或减少 Worker 数量。

注意事项

  • Web Workers 不能直接操作 DOM,需通过 postMessage 通信。
  • 大量 Worker 可能消耗较多内存,需合理设置池大小。
  • 部分浏览器可能限制同时激活的 Worker 数量。

标签: 线程js
分享给朋友:

相关文章

js实现vue路由

js实现vue路由

Vue路由基础实现 使用Vue Router实现前端路由需要先安装并配置路由库。Vue Router是Vue.js官方的路由管理器。 安装Vue Router: npm install vue-r…

js实现轮播

js实现轮播

实现轮播图的基本思路 轮播图的核心逻辑是通过定时切换展示的图片或内容,通常结合左右滑动按钮和指示器(小圆点)增强交互性。以下是基于原生JavaScript的实现方法。 HTML结构 构建轮播图的HT…

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('image…

jquery.js

jquery.js

jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互等操作。以下是关于 jQuery.js 的核心信息和使用方法: 获取 jQ…

js实现图表

js实现图表

在JavaScript中实现图表通常使用流行的图表库,以下是几种常见的方法和工具: 使用Chart.js Chart.js是一个简单灵活的库,适合快速生成响应式图表。安装方式包括CDN引入或npm安…

js实现密码

js实现密码

密码强度验证 使用正则表达式验证密码强度是一种常见方法。以下代码检查密码是否包含大小写字母、数字和特殊字符,且长度至少为8位: function checkPasswordStrength(pass…