RxSwift中throttle和debounce区别及实现原理

throttle

swift 复制代码
let subject = PublishSubject<String>()

let _ = subject
    .throttle(.seconds(1), scheduler: MainScheduler())
    .subscribe(onNext: { str in
		debugPrint(str)
    })

subject.onNext("1")
subject.onNext("2")
subject.onNext("3")
subject.onNext("4")

DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
	subject.onNext("5")
}
DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
	subject.onNext("6")
}

DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
	subject.onNext("7")
}

输出结果为
1
5
7

throttle实现原理

从原理分析 throttle ,实现如下

swift 复制代码
// 用 Timer 实现
class Throttle {
    
    var timer: Timer?
    
    func throttle(_ second: Int, _ completion: @escaping ( () -> Void )) {
        // 当timer运行期间,在接受到的事件则直接return
        if timer?.isValid == true {
            return
        }
        completion()
        
        timer = Timer.scheduledTimer(withTimeInterval: TimeInterval(second), repeats: false, block: { (tm) in
            self.cleanTimer()
        })
        RunLoop.current.add(timer!, forMode: .common)
    }
    
    func cleanTimer() {
        timer?.invalidate()
        timer = nil
    }
    
}

// 记录执行事件
class Throttle {
    
    var dueTime: CFTimeInterval = -1
    
    func throttle(_ second: Int, _ completion: @escaping ( () -> Void )) {
        // 当timer运行期间,在接受到的事件则直接return
        if CACurrentMediaTime() - dueTime < second {
            return
        }
        dueTime = CACurrentMediaTime()
    }
    
}

回到最上方 throttle 的例子,如果假如每0.1s发出一个信号,则 throttle 会保证每1s执行下订阅的内容

debounce

swift 复制代码
let subject = PublishSubject<String>()

let _ = subject
    .debounce(.seconds(1), scheduler: MainScheduler())
    .subscribe(onNext: { str in
		debugPrint(str)
    })

subject.onNext("1")
subject.onNext("2")
subject.onNext("3")
subject.onNext("4")

DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
	subject.onNext("5")
}
DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
	subject.onNext("6")
}

DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
	subject.onNext("7")
}

输出结果为
4
7

也就是 debounce 会对小于设定时间内的连续触发事件进行去重,当最后一个时间输入后大于设定时间才会发出通知

探讨debounce实现原理

从原理分析 debounce ,实现如下

swift 复制代码
// 用 Timer 实现
class Debounce {
    
    var timer: Timer?
    
    func throttle(_ second: Int, _ completion: @escaping ( () -> Void )) {
		self.cleanTimer()
        
        timer = Timer.scheduledTimer(withTimeInterval: TimeInterval(second), repeats: false, block: { (tm) in
			completion()
            self.cleanTimer()
        })
        RunLoop.current.add(timer!, forMode: .common)
    }
    
    func cleanTimer() {
        timer?.invalidate()
        timer = nil
    }
    
}

回到最上方 debounce 的例子,如果假如每0.1s发出一个信号,则 debounce 将一直无法执行订阅中的内容,当停止发出信号后1s,才会执行一次订阅中的内容

相关推荐
转转技术团队10 分钟前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY14 分钟前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程
远航_34 分钟前
OpenSpec 完整详细介绍
前端·后端
召钱熏1 小时前
状态枚举正确≠渲染正确:一个语音按钮的状态机边界修复实录
android·前端
SkyWalking中文站1 小时前
认识 Horizon UI · 1/17:SkyWalking 新一代可观测性控制台
运维·前端·监控
cidy_981 小时前
Dify 操作教程:工作流编排 & Chat 对话编排
前端·工作流引擎
tangdou3690986551 小时前
AI真好玩系列-2分钟快速了解DeepAgents | Quick Guide to DeepAgents in 2 Minutes
前端·javascript·后端
小四的小六1 小时前
AI Agent效果评测实战——搭完Agent才是噩梦的开始
前端
梨子同志1 小时前
JavaScript
前端
彭于晏爱编程1 小时前
纯 JS + Node,一个下午手搓了能读懂公司代码的 AI 助手,老板以为我转行了
前端·javascript