大规模请求数据并发问题

1.请求队列

javascript 复制代码
const queue = [];

queue.push();
queue.shift;

class RequestQueue {
    constructor(maxConcurrent) {
        this.maxConcurrent = maxConcurrent; // 最大并发请求数
        this.currentConcurrent = 0; // 当前并发请求数
        this.queue = []; // 请求队列
    add(request) {
        return new Promise(resolve,reject) => {
            this.queue.push({ request, resolve, reject });
            this.processQuese();
        });
}

processQuese() {
    if (this.queue.length > 0 && this.currentConcurrent  < maxConcurrent) {
        const { request, resolve, reject } = this.queue.shift();
        this.currentConcurrent++;
        request() 
            .then(resolve)
            .catch(reject)
            .finaly(() => {
                this.currentConcurrent--;
                 this.processQuese();
            });
    }
   }
}

// 实力请求函数
function fetchData(url) {
    return fetch(url).then(respomse => response.json());
}

// 使用请求队列
constrequestQuese = new RequestQueue(5); // 设定并发请求数为5

const urls = [ 
                "https://api.example.com/data1",
                 "https://api.example.com/data2",
            };

const requests = urls.map(url => () => fetchData((url));
Promise.all(requests.map(request => requestQueue.add(request)))
    .then(results => {
        console.log("所有请求完成", result);
    })
    .catch(error => {
        console.error("请求失败", error);
    });

2.防抖/节流

-防抖(debounce)

-节流 (throttle)

-防抖 (Debounce) : 确保在指定时间内函数只执行一次,常用于输入框的搜索建议

-节流 (Throttle) : 确保在指定时间间隔内函数执行一次,常用于窗口的 resize scroll 事件

javascript 复制代码
function debounce(func, wait) {
    let timeout;
return function(...args) {
    clearTimeout(timeout);
    timeout = setTimeout(() => {
        func.apply(this
相关推荐
go不是csgo8 小时前
GORM 上手:一个 main.go 跑通 Go 数据库增删改查
jvm·数据库·golang
半个落月8 小时前
彻底搞懂 JavaScript 变量提升(Hoisting)—— 从现象到底层原理
前端·javascript
零度晚风8 小时前
React 底层原理 & 新特性
前端
学代码的真由酱8 小时前
WebSocket背景知识及简单实现-Java
java·websocket
用户61848240219518 小时前
我受够了 Electron 的 IPC 样板代码,于是写了 electron-ipc-auto-import
前端
lld9510279 小时前
(一)云回测:量化策略上线前的必经之路
java·服务器·数据库
云云只是个程序马喽9 小时前
海外短剧系统开发_云微传媒:多语言短剧平台定制与变现解决方案
java·php
梦想的颜色9 小时前
TypeScript 完全指南(中):函数、接口、类与高级类型
前端·typescript
鹏多多9 小时前
OpenSpec+SDD规范驱动AI Agent开发项目实战指南
前端·vue.js·react.js
叶小树咯9 小时前
React 为什么不能像 Vue 那样 state.count++
前端·react.js