如何度量前端项目研发效率与质量(上篇)

3.jpg

DevUI是一支兼具设计视角和工程视角的团队,服务于华为云 DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师。
官方网站: devui.design
Ng组件库: ng-devui(欢迎Star)

引言

在DevOps,有个很流行的说法是XX项衡量DevOps是否成功的指标。通过对研发流程各个阶段的关键数据进行度量,来判断一个项目是否完成DevOps转型。

这个思路非常正确,因为要想改进它,就要度量它。

而对于前端项目大部分也可以套用DevOps的部分衡量指标,我基于本身的项目实践,结合前端项目研发流程的特殊性和差异点,梳理出更适合判断前端项目是否高效高质的衡量指标。而衡量指标大部分都是可以通过工具实现自动化采集,从而可以很容易建立出适合团队本身的交付看板,用于日常项目管理改进。

本文适合前端项目leader,和尝试前端工程实践的工程师们。

前端研发流程

我将前端研发流程分为:设计、开发、个人验证、版本验证、线上验证5个阶段。下面我分别解释下这几个阶段的含义与区别。

设计:前端研发流程最特别的阶段,由于前端业务特点,前端工程师不可避免的将会与设计师和产品尽力进行协同。无论是产品设计的技术可行性评估还是产品体验的讨论,产品设计的阶段将决定业务的实现方式,这是所有需求的源头。与设计师和产品经理的协同效率越高,前端团队的交付效率也会越高。

开发:前端工程师的核心编码输出阶段,这个阶段的代码质量、开发效率、协同联调效率都将决定后续版本的质量和返工成本。在这个阶段有非常多的自动化工具或cli,来协助开发者提升效率和编码质量。但这也是最不好控制得阶段,因为他与个人开发环境和个人技术水平与习惯息息相关。

个人验证:前端工程师开发完成后,在正式提交前,都会有个人验证的阶段。也就是自我验证确保无问题后,再提交入库,启动版本验证阶段。虽然每个开发工程师都会自我验证,但因为开发者思维的存在,这往往是最容易忽视的一个环节。我们需要在这个环节加入很多的自动化验证能力,来帮助开发者在个人开发阶段完成质量的提升。因为,在整个研发流程中,越在前面环节发现问题,其修复成本越低。

版本验证:在前端团队中,各个开发人员完成自我验证后,提交至版本分支后,将启动版本验证阶段。在这个阶段,优秀的前端团队会通过自动化的流水线完成编译打包、静态检查、质量门禁、用例测试等一系列自动化的版本验证动作,完成版本的质量与安全的保障。这个阶段应该是整个研发流程中自动化率最高的环节。效率高、自动化程度高、执行速度快的流水线,将极大提升前端项目的质量和效率。

线上验证:前面四个阶段都是站在开发团队的视角,最后一个阶段是站在用户的视角。也就是说,当你完成了版本发布后,你的产品真实表现如何,用户是否按照期望的方式在使用,有无漏测,有无在开发阶段忽略的质量漏洞,能否先于用户发现问题,能否快速定位到问题。这些都需要在线上验证阶段进行监控与拦截,在该阶段,前端监控,还有各种告警、拨测等工具的应用,都是比较好的优秀实践。

那么到此,整个前端研发流程也就完整闭环。

衡量指标

说完了前端研发流程。那么,在这个流程的各个阶段,我们用哪些可度量的指标来判断每个阶段是否做到了最好,是否还有改进空间?度量指标体系的建立,不仅帮助你了解目前项目的基线情况,更大的价值是能够根据客观的度量数据,牵引团队往达标的方向改进,方向清晰,效果明显。

设计

在设计阶段,我们需要考虑的是如何提升前端人员的效率。这个阶段在很多团队如果设计师与产品经理比较专业,通过设计平台的协同,都能达到很高的效率。但是如果设计师与产品在设计阶段的混乱,可能会导致需求不清晰、设计反复、一句话需求,所以在这个阶段,更多的是衡量产品经理与设计师,通过指标反向约束,避免设计成本转移给前端开发人员。通过项目管理的工具,前端开发者很容易给对应需求打上标签和填写对应信息,从而度量相应指标。

前置时间(Lead time)

前置时间是供应链管理中的一个术语,也被应用于敏捷与devops中,在供应链管理中,是指从采购方开始下单到供应商交货所间隔的时间。而对应到敏捷和devops中,往往指用户提出需求到发布上线的时间。一般情况下,在交付人力稳定的情况下,交付效率都是恒定的,所以前置时间的缩短还要着重审视设计阶段的效率。也就是说,从用户提出需求,到最终设计稿定稿的时间是否存在优化空间。

需求修改频次

由于前端交付产品与交互体验息息相关,存在设计稿和原型频繁改变的情况。需求修改频次,可以记录前端产品需求被修改的次数,从而反应产品经理与设计师在产品设计的规范程度与协作效率。

需求规范度

提交的需求是否满足约定的规范。比如,复杂特性需要有详细的高保真标注图、杜绝一句话需求、杜绝描述不清楚的需求。在收到不满足规范要求的需求,开发人员有权打回需求,以避免后续的开发成本浪费。而规范度遵循度差的团队,应该审视相应角色的协作是否存在优化点。

开发

开发阶段是工程师核心编码输出阶段,在这个阶段,我们关注的主要是交付效率与质量。

迭代人均交付需求数

在单位迭代内,每个开发人员能完成的人均需求数。由于团队划分需求颗粒度习惯是延续的,可能存在个别迭代不同开发人员需求颗粒度不一致的情况,但放在一个较长的时间段内相关误差基本可控。所以平均迭代交付需求数越高,且呈上升趋势的团队,可以理解为团队交付效率高。

迭代人均问题数

而对应的,单位迭代内产生的现网问题数越多,也代表其交付版本质量较差。而如果该指标长期未成收敛趋势,那么也需要同步审视相应的质量保障体系是否存在优化空间。

个人验证

在个人验证阶段,主要是开发人员对自己编写的代码进行合入版本前的自我验证。主要包含功能测试与代码检视等一系列质量活动。当然,在一些优秀实践里,也会引入大量自动化工具和插件,辅助开发人员提前发现质量问题。

代码检查遵从度

良好的代码规范和基础的静态检查能够避免很多低级问题,在这方面基于eslint等一系列工具,可以很容易建立起代码检查的要求。而遵从度的指标,要求开发人员必须满足我们的代码检查要求,比如,严重问题清零,或者问题100%清零等指标。

自动化用例覆盖率

无论是单元测试用例还是E2E的测试用例,在个人验证阶段,开发人员应该编写对应的测试用例,并基于本次代码提交的影响范围,运行相关自动化用例,以确保新功能和历史功能的质量。尤其对于大型的前端业务系统,必须建立自动化用例体系保障长时间积累的大量特性得到质量保障。在此阶段,自动化用例覆盖率越高,越能保障版本的质量。

自动化用例成功率

而用例覆盖率对应的是,自行的成功率。频繁失败的测试用例,要么反应业务功能的不完善,要么反应测试用例的不严谨,从而影响版本质量的验收,应尽力避免。

总结

到个人验证结束,我们将进入版本验证的阶段。

版本验证阶段将是客观衡量指标最多,自动化程度最高,也是度量体系最核心的部分。整体衡量指标大部分都将在该阶段通过自动化的实践呈现,用于评估前端版本的质量与效率。而驱动项目改进,大部分可以基于版本验证阶段收集的度量指标,驱动整体项目改进。

相应内容,我将在第二篇详细展开。

未完待续,敬请期待。

加入我们

我们是DevUI团队,欢迎来这里和我们一起打造优雅高效的人机设计/研发体系。招聘邮箱:[email protected]

文/DevUI Monkey

往期文章推荐

《敏捷设计,高效协同,凸显设计端云协同价值》

《现代富文本编辑器Quill的模块化机制》

你可能感兴趣的:(前端,前端工程化,devops)