带你读《2022技术人的百宝黑皮书》——前端质量之灰度监控的有效实践(3)

简介: 带你读《2022技术人的百宝黑皮书》——前端质量之灰度监控的有效实践(3)

带你读《2022技术人的百宝黑皮书》——前端质量之灰度监控的有效实践(2) https://developer.aliyun.com/article/1242721?groupCode=taobaotech




api错误

因为api错误的统计标准与我们的实际需求有出入(见下图)我们主要看新增错误、同比环比数据


image.png


错误率:主要统计同比环比。为什么不看api成功率?成功率99.5%下降到99%(下降了0.5%)数据非常不明显,失败率0.5%提升到1%(上升100%)很明显,才更能发现问题。比如我们有个detail页接口成功率常年维持在99.5%,有次发布前端bug成功率仅仅掉到99.3%,但影响了1w+用户一天

错误数:(某api新增错误信息)错误数,1~2(每10分钟)是warn级别

影响用户数:(某api新增错误信息)影响用户数,

a.会结合错误数一起看,辅助分析大量错误是否集中在个别用户上,

b.影响用户数权重大于错误数,说明影响面更广

调用量:调用量异常也能反映前端bug,0一般是错误导致无调用,异常高一般是多次调用

案例:2020.12.01 - 异常日志排查到订单结果轮询的 bug


image.png


观察日志时发现有个接口突然调用量相对平日大涨,排查日志发现有同一个用户一直重复请求同一个接口,猜测可能是轮询逻辑有问题,通过排查代码发现一个取数逻辑有误引起的 bug



带你读《2022技术人的百宝黑皮书》——前端质量之灰度监控的有效实践(4) https://developer.aliyun.com/article/1242716?groupCode=taobaotech

相关文章
|
18天前
|
机器学习/深度学习 人工智能 前端开发
探索未来前端技术发展趋势
随着科技的不断进步,前端技术在不断演进。本文将探索未来前端技术的发展趋势,并讨论其对用户体验、开发效率和安全性的影响。
|
2天前
|
前端开发 JavaScript 数据管理
引领潮流:React框架在前端开发中的革新与实践
React,始于2013年,由Facebook驱动,以其组件化、Virtual DOM、单向数据流和Hooks改革前端。组件化拆分UI,提升代码复用;Virtual DOM优化渲染性能;Hooks简化无类组件的状态管理。庞大的生态系统,包括Redux、React Router等库,支持各种需求。例如,`useState` Hook在计数器应用中实现状态更新,展示React的实用性。React现已成为现代Web开发的首选框架。【6月更文挑战第24天】
23 2
|
7天前
|
缓存 监控 前端开发
前端性能监控:从Lighthouse到Real User Monitoring
**前端性能监控关乎用户体验。Lighthouse是自动化审计工具,评估网页性能、最佳实践、可访问性等,通过CLI或Chrome DevTools使用。RUM则实时监控用户与网站互动,收集性能数据。两者结合,从开发到生产环境,全面优化前端性能,包括资源加载、代码优化、网络性能和用户体验。使用Lighthouse和RUM数据,结合CI/CD,持续改进并设定性能预算,采用SSR、Service Worker、Code Splitting等高级策略,确保高性能和用户满意度。**
13 2
|
10天前
|
前端开发 JavaScript 开发工具
Web前端开发学习资料:深度探索与开发实践
Web前端开发学习资料:深度探索与开发实践
18 3
|
1月前
|
缓存 资源调度 Rust
前端效率提升实践之路
在一个B端前端项目中,开发团队面临开发效率低、交付质量和可维护性差的问题。为了解决这些问题,他们以“提效”为主题,展开了项目治理。首先,他们优化了发布和编译过程,通过更换包管理工具、减少不必要的包、使用缓存策略等方法,显著缩短了发布和编译时间。其次,团队致力于沉淀可复用物料,创建了高度配置化的组件,通过VSCode插件助手自动化配置,提高了代码复用性和开发效率。此外,他们还改进了研发流程,制定了前端、后端和产品的规范,以减少沟通成本和提高接口质量。通过这些措施,团队成功提升了开发效率,并降低了代码维护成本。
55 3
前端效率提升实践之路
|
10天前
|
缓存 前端开发 JavaScript
前端性能优化实践与工程化
前端性能优化实践与工程化
|
14天前
|
缓存 移动开发 前端开发
在PWA的开发中,HTML与CSS作为前端技术的基础,发挥着至关重要的作用
【6月更文挑战第14天】PWA(渐进式网页应用)借助HTML和CSS,提供接近原生应用的体验。HTML构建页面结构和内容,响应式设计适应各种设备,语义化标签提升可访问性,Manifest文件配置应用元数据,离线页面保证无网时体验。CSS则用于定制主题样式,创建动画效果,实现响应式布局,并管理字体和图标。两者协同工作,确保PWA在不同环境下的优秀性能和用户体验。随着前端技术进步,HTML与CSS在PWA中的应用将更加深入。
25 2
|
16天前
|
前端开发 JavaScript Java
【前端技术】 ES6 介绍及常用语法说明
【前端技术】 ES6 介绍及常用语法说明
18 4
|
19天前
|
边缘计算 前端开发 Android开发
未来趋势下的前端开发:跨平台技术的崛起
随着技术的不断演进,前端开发领域也在迅速变化。本文探讨了未来趋势下前端开发的发展方向,着重分析了跨平台技术在前端开发中的崛起,并探讨了其对开发者和行业的影响。
|
19小时前
|
编解码 自然语言处理 算法
技术心得:前端学HTTP之字符集
技术心得:前端学HTTP之字符集