Files
crawler-plugin/frontend-vue/src/shared/utils/history-paging.ts
T
huangzd1997 67223f8950 perf(frontend): 工具页分页/历史截断/轻量轮询/共享纯逻辑(审查 F5/F6/F9/F12/G3)
- F9 新增 useTablePaging composable 并接入 7 个工具页"匹配结果"表(只切渲染窗口,
  不加选择语义;每页 100 条)+ 深色分页样式
- F6 历史任务抽屉渲染截断(默认 50 条 + "显示全部/收起"),全选口径改为当前可见条目
- F5 新增 task-progress-polling 适配器:等待任务终态的紧循环走 /tasks/progress/light,
  异常或空响应回退重型 batch;已接入跟价/定时匹配的 waitForTaskTerminal
- F12 背景图 bg.jpg 251KB → 166KB(1920 宽 + quality 80,image-set 仍优先 webp)
- G3 抽出共享纯逻辑 task-queue-state(开始时间表序列化校验 + 记录缺失错误判定),
  5 个工具页删除逐字重复实现
- 新增 4 个单测文件(分页切片/历史截断/轻量轮询归一/任务队列纯逻辑)
2026-09-14 06:23:46 +08:00

33 lines
1.2 KiB
TypeScript

/**
* 历史任务抽屉的渲染截断(2026-09 全维度审查 F6)。
*
* 历史条目由页面从后端/本地缓存整批传入,抽屉此前全量渲染:条目多时(每卡 8+ 节点)
* 打开即产生大量 DOM,关闭后虽然 destroy-on-close 会销毁,但打开期间的首屏渲染成本
* 与内存占用仍随条数线性增长。这里统一按上限截断渲染,由 UI 提供「显示全部」入口。
*/
/** 首屏渲染条数上限 */
export const HISTORY_VISIBLE_LIMIT = 50
export interface HistorySlice<T> {
/** 实际渲染的条目 */
visible: T[]
/** 被截断的条数(0 表示未截断) */
hiddenCount: number
/** 是否处于截断状态 */
capped: boolean
}
export function sliceHistoryItems<T>(
items: T[] | null | undefined,
showAll: boolean,
limit: number = HISTORY_VISIBLE_LIMIT,
): HistorySlice<T> {
const list = Array.isArray(items) ? items : []
const safeLimit = Number.isFinite(limit) && limit > 0 ? Math.floor(limit) : HISTORY_VISIBLE_LIMIT
if (showAll || list.length <= safeLimit) {
return { visible: list, hiddenCount: 0, capped: false }
}
return { visible: list.slice(0, safeLimit), hiddenCount: list.length - safeLimit, capped: true }
}