如何使用 ChatGPT 帮我们分析前端 Bug

背景

作为前端程序员,我们每个月都能够大量稳定的产出 bug 😂,而每个月的 bug 统计都会令人无从下手。

以下是测试组提供的一份 bug 清单,通过 Tapd 的 excel 文档导出,可以看到满满的 bug,琳琅满目,应接不暇。

以上还只是本月的其中一人的bug,整个前端组加起来的 bug 可达到数百个以上。如何把这些杂乱的信息归类整理,并能更好的为我们的复盘提供支持,成为当下的问题。

改进

类似这种大量无序的信息,想来应该特别适合用 AI 帮我们处理。说干就干,马上登录 ChatGPT,把数据喂给 AI 并经过无数次的调教,终于得出令人满意的结果:

经过 AI 的重新归类整理,现在我们的 bug 清单清晰明了,可读性大大增加,bug 也可以有效的沉淀复盘了。

后续

除了编码方面的帮助,ChatGPT 对一些软技能的方面的协助也不容小觑,欢迎大家一起讨论,继续探索 AI 在我们日常工作中的帮助~

附录

提供一份由 ChatGPT 生成的前端常见 bug 类型清单:

  • 语法错误: 这是最基本的错误,通常是由于拼写错误、缺少分号或括号不匹配等引起的。
  • 逻辑错误: 程序在逻辑上不正确,导致功能不能按预期工作。
  • 页面布局问题: HTML、CSS、布局框架等方面的问题,导致页面元素错位、错乱或不按预期排列。
  • 样式问题: 包括样式不生效、样式覆盖、样式失效等。
  • 响应式设计问题: 页面在不同设备上(如移动设备、平板电脑、桌面)上显示不正确,导致页面不适应不同的屏幕尺寸。
  • 浏览器兼容性问题: 不同浏览器对CSS和JavaScript的解释可能不同,导致在某些浏览器上出现问题。
  • 缓存问题: 旧的资源被缓存导致更新未能及时生效。
  • 网络请求问题: AJAX 请求失败、响应不正确,或者跨域请求问题。
  • 性能问题: 页面加载速度慢、资源过多、内存泄漏等。
  • 安全问题: XSS(跨站脚本攻击)、CSRF(跨站请求伪造)等安全漏洞。
  • 框架或库问题: 使用的框架或库本身的bug,或者与其他库不兼容。
  • 事件处理问题: 事件监听、触发、冒泡等问题,导致交互不正常。
  • 移动端特有问题: 触摸事件、手势、视口问题等。
  • 本地存储问题: 使用localStorage或sessionStorage时的问题,包括数据不正确、存储限制等。
  • 异步操作问题: 回调地狱、Promise处理不当等。
  • 数据处理问题: 数据格式不正确、处理逻辑错误等。
  • 路由问题: 单页面应用中的路由配置、切换问题等。
  • 跨域问题: 跨域资源共享(CORS)问题。
  • 缺乏错误处理: 没有适当的错误处理机制,导致问题难以定位和解决。
  • 环境问题: 开发环境和生产环境之间的差异导致问题。
  • 版本问题: 使用的库、框架或工具的版本问题。
  • 工具配置问题: Webpack、Babel等工具的配置错误。
  • 测试问题: 缺乏充分的测试,导致问题在发布后才被发现。
  • 移动端适配问题: 页面在不同移动设备上显示不正常。
  • 国际化问题: 多语言支持引起的问题。
  • 特定场景问题: 只在特定情况下才出现的bug,难以重现和修复。
  • 调试问题: 缺乏有效的调试技巧和工具,导致问题难以定位和修复。
  • 功能缺失问题:没有调研好产品需求,需求漏做少做。
  • 前后端对接问题:接口请求出入参和文档不一致,导致的接口报错。
  • 数据处理问题:数据取数不对,或者对数据的加工过滤有误导致的错误。
相关推荐
正小安29 分钟前
如何在微信小程序中实现分包加载和预下载
前端·微信小程序·小程序
_.Switch2 小时前
Python Web 应用中的 API 网关集成与优化
开发语言·前端·后端·python·架构·log4j
一路向前的月光2 小时前
Vue2中的监听和计算属性的区别
前端·javascript·vue.js
长路 ㅤ   2 小时前
vite学习教程06、vite.config.js配置
前端·vite配置·端口设置·本地开发
长路 ㅤ   2 小时前
vue-live2d看板娘集成方案设计使用教程
前端·javascript·vue.js·live2d
Fan_web2 小时前
jQuery——事件委托
开发语言·前端·javascript·css·jquery
安冬的码畜日常2 小时前
【CSS in Depth 2 精译_044】第七章 响应式设计概述
前端·css·css3·html5·响应式设计·响应式
莹雨潇潇3 小时前
Docker 快速入门(Ubuntu版)
java·前端·docker·容器
Jiaberrr3 小时前
Element UI教程:如何将Radio单选框的圆框改为方框
前端·javascript·vue.js·ui·elementui
Tiffany_Ho4 小时前
【TypeScript】知识点梳理(三)
前端·typescript