印象深刻的BUG合集
一、第三方引发类
1.1 WPS
2023-12-01
事件描述：页面上的 a 标签，用户复制粘贴到 wps excel 单元格中，此时编辑超链接可以看到，hash 值被复制了一份
复现步骤：
- F12 往页面上写个标签
document.write('<a href="https://baidu.com/#/abc?a=1">我是百度</a>') - 复制页面上的标签到 wps excel 单元格中
- 编辑单元格超链接
教训总结：用户在点击单元格超链接时，前端截取方法处理不当，引发多个重复参数。
题外话：有时看到开发同学编码没来由的在去重，或者做一些奇怪的兜底，可能不是我方代码不行，而是第三方的神迹。
1.2 高德地图前端SDK
2021-12-23 17:40 切身经历，没有高德事故报告，无从考究
事件描述：前端初始化高德地图异常，页面没剩啥功能可操作，amap 提供的定位获取失效，无法完成业务作业-打卡等各个流程
排查得出高德 CDN 返回的 JS，格式化后，比平时多了15行。约 25 分钟后恢复正常。
教训总结：
- 第三方依赖尽量本地化（大部分情况下，这种做法是OK的，不排除极端情况，如：API变更）
- 兜底/降级方案，比如该场景下的定位、自动降级切换地图等等
1.3 腾讯地图前端SDK
2023-08-07 14:45 同事分享，没有实质证据，无从考究
事件描述：腾讯地图 CDN 凉凉，无法加载，同事的 SPA 系统在模板 html 中 script 同步加载了该资源，导致白屏 2min 才能进去系统（2min 后 js fetch fail）
教训总结：
- 第三方依赖尽量本地化（大部分情况下，这种做法是OK的，不排除极端情况，如：API变更）
- 不能本地化别同步加载，在用到的页面异步添加 script load
- 兜底/降级方案，比如该场景下的定位、自动降级切换地图等等
性能类
2.1 out of memory
事件描述：Table场景，行是懒加载，然而是动态列，忽然业务侧爆发了新场景，5000+列，初始化渲染导致内存泄漏
教训总结：
- 想办法懒加载
- 不能懒加载的时候，从产品方案设置渲染上限
2.2 计算导致渲染进程卡死
事件描述：两个下拉具备关联关系，比如一个送礼页面，礼物下拉筛选有 品类 和 品类下的实体礼物。这里前端同学答应了产品和后端的无理请求，从后端拿了所有的品类和实体枚举项，刚进页面/没选品类的时候要加载所有品类下的实体下拉项。开发顺利，上线进入页面先卡 8s 后，才能正常操作。
教训总结：
- 质疑产品方案的合理性，产品所谓的用户体验，有时就是YY出来的交互，也不是用户需要的东西
- 质疑后端方案的合理性，为啥不动态搜索，灵活拆接口
- 纯计算可以放 web-worker，异步，不会阻塞渲染。比如这里就让这两个下拉去 loading，其他操作正常用
- 做压测