Files
lisglosips/docs/UI_PERFORMANCE_REMEDIATION_IMPLEMENTATION_20260827.md
T

2.7 KiB

UI 与页面性能整改实施记录(2026-08-27)

实施范围

本次按《LisgloSIPS UI 性能整改方案》实施前端加载体验、按页面取数、Dashboard 请求合并、话单首屏性能、质检与号码库懒加载、宽表可读性和中文状态文案。TLS 证书按要求不在本次代码整改范围内,未修改证书或生产环境配置。

已完成

  • 全局请求增加 10 秒超时和主动取消;切换菜单时取消上一页面请求,避免旧响应覆盖当前页面。
  • 页面请求超过 2 秒才显示加载弹窗,完成、失败或取消后立即隐藏;表格加载中显示骨架,不再与空状态同时出现。
  • 登录首页由全站 11 组接口预加载改为按当前路由加载;Dashboard 新增 /api/v2/dashboard/overview,服务端并行取得 summary 与 trends,前端只发一个首页概览请求。
  • 话单默认页大小由 100/50 降为 25;列表与总数改为并行查询,并增加 startedAt desc, id desc 稳定排序;主表精简为核心字段,完整信息保留在详情抽屉。
  • 质检录音默认限制为 50;抽检规则及客户/线路依赖只在打开规则抽屉时加载。
  • 号码库由首次同时加载四个页签改为只加载当前页签,其他页签首次打开时再读取。
  • 当前通话自动刷新改为静默更新;失败后停止自动轮询,避免 5 秒间隔持续叠加失败请求;手动首次加载仍使用延迟弹窗。
  • 宽表支持横向滚动、右侧操作列固定、长文本自动断行;长列表启用浏览器内容可见性优化。
  • Dashboard 未接入指标明确显示“等待真实数据”,不再使用开发 fixture 伪装实时数据;操作向文案已做中文化。

暂未直接实施

  • 未新增数据库索引。整改方案要求先以生产库 EXPLAIN ANALYZE 或等价执行计划确认慢点;当前没有获得生产数据库只读诊断授权和执行计划,直接增加索引可能放大写入成本。
  • 未修改 TLS 证书、Nginx 或生产部署配置。
  • 未发布生产。当前改动仅在本地源码、测试和构建层验证。

本地验证

  • ESLint:通过。
  • TypeScript project build/typecheck:通过。
  • Vitest:26 个测试文件、95 个测试全部通过。
  • Web production build:通过,生成 dist/index.html、CSS 和 JS hash 产物。
  • 浏览器验收:本地 Vite 页面 URL、标题、非空 DOM、登录页截图和浏览器 console 已检查,未发现 console warning/error 或框架错误覆盖层。本机未配置 API 所需的 MySQL/Redis/鉴权环境,因此登录页按预期显示本地 API 500;已登录 Dashboard、话单和 2 秒延迟交互仍需在接入可用后端后做最终浏览器回归。