大屏可视化
大屏场景一般指 指挥舱、展厅、监控中心：固定或超大分辨率、长时间运行、强调 实时数据与动效，技术栈多为 Canvas / WebGL（ECharts、Three.js、AntV G2、自研 WebGL） + 自适应布局。
架构要点
| 要点 | 说明 |
|---|---|
| 分辨率与缩放 | 设计稿基准（1920×1080 等）+ transform: scale 或 rem/vw 整体等比，避免拉伸字体模糊 |
| 数据刷新 | WebSocket / SSE / 定时轮询；控制频率避免卡顿 |
| 性能 | 大量粒子与图层时控制 重绘区域、降低 DOM 节点数（Canvas 优于海量 div） |
| 稳定性 | 内存泄漏（定时器、图表实例 dispose）、长时间运行 自动刷新页面或重建上下文（慎用） |
选型优势（Web 大屏）
- 交付快：相对 QT/C++ 定制，Web 迭代与热更新友好。
- 生态丰富：地图、3D、图表库成熟。
- 嵌入容易：浏览器全屏、嵌入式 Chromium 壳均可。
边界与风险
- 超高分辨率拼接屏：单浏览器窗口像素极限、显卡负载，可能需要 多窗口分屏 或 原生合成。
- IE 老旧现场：若仍存在，需单独降级方案（现已少见）。
- 动效与数据一致性：展示数据 延迟可接受 时需标明，避免指挥误判。
小结
大屏架构的核心是 布局缩放策略 + 渲染通道选型（Canvas/WebGL）+ 数据通道稳定性。与 微前端 组合时，大屏常作为 独立子应用 / 独立路由，避免与中后台表格生态互相拖累打包体积。