mirror of
https://github.com/lanyeeee/bilibili-video-downloader.git
synced 2026-09-08 17:16:52 +08:00
fix: 修复下载任务很多时导致前端性能下降的问题
This commit is contained in:
+11
-19
@@ -27,36 +27,28 @@ export const useStore = defineStore('store', () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
function useProgresses() {
|
function useProgresses() {
|
||||||
// 内部的高频更新状态
|
|
||||||
const _progresses = new Map<string, ProgressData>()
|
|
||||||
// 对外暴露的响应式状态
|
// 对外暴露的响应式状态
|
||||||
const progresses = ref<Map<string, ProgressData>>(new Map())
|
const progresses = ref<Map<string, ProgressData>>(new Map())
|
||||||
|
|
||||||
|
// 等待在同一渲染帧内执行的更新函数
|
||||||
|
const pendingUpdateFns: Array<(progresses: Map<string, ProgressData>) => void> = []
|
||||||
|
|
||||||
// 用于确保在同一渲染帧内只安排一次UI更新
|
// 用于确保在同一渲染帧内只安排一次UI更新
|
||||||
let isUpdateScheduled = false
|
let isUpdateScheduled = false
|
||||||
|
|
||||||
// 将 `_progresses` 的内容更新到 `progresses` 中,并触发重新渲染
|
// 在同一渲染帧内集中执行等待中的更新函数
|
||||||
const updateProgressesOnFrame = () => {
|
const updateProgressesOnFrame = () => {
|
||||||
const newProgressesMap = new Map<string, ProgressData>()
|
|
||||||
|
|
||||||
for (const [key, value] of _progresses.entries()) {
|
|
||||||
const progressData = progresses.value.get(key)
|
|
||||||
|
|
||||||
if (progressData !== undefined) {
|
|
||||||
Object.assign(progressData, value)
|
|
||||||
newProgressesMap.set(key, progressData)
|
|
||||||
} else {
|
|
||||||
newProgressesMap.set(key, { ...value })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
progresses.value = newProgressesMap
|
|
||||||
|
|
||||||
isUpdateScheduled = false
|
isUpdateScheduled = false
|
||||||
|
|
||||||
|
const updateFns = pendingUpdateFns.splice(0)
|
||||||
|
for (const updateFn of updateFns) {
|
||||||
|
updateFn(progresses.value)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const updateProgresses = (updateFn: (progresses: Map<string, ProgressData>) => void) => {
|
const updateProgresses = (updateFn: (progresses: Map<string, ProgressData>) => void) => {
|
||||||
// 使用传入的更新函数来修改 `_progresses`
|
// 将传入的更新函数添加到等待队列
|
||||||
updateFn(_progresses)
|
pendingUpdateFns.push(updateFn)
|
||||||
|
|
||||||
if (!isUpdateScheduled) {
|
if (!isUpdateScheduled) {
|
||||||
// 如果没有安排过UI更新,则安排一次
|
// 如果没有安排过UI更新,则安排一次
|
||||||
|
|||||||
Reference in New Issue
Block a user