前端代碼質量保障之代碼review


         經驗豐富的程序員和一般程序員之間的最大區別,不僅體現在解決問題的能力上,
還體現在日常代碼的風格上。掌握一門技術可能需要幾月,甚至幾周就夠了。 
好的習慣風格養成卻需數年。


        團隊成員之間需要合作,代碼需要日后可維護,個體的能力和習慣存在差異。 
故保證代碼質量及風格,就需要制定一定的規則,按項目周期(最好是在上預發之前)組織進行集體代碼review。



一 目的

        1    保證代碼質量 
        自己的代碼要給別人看,在開發過程中就會刻意的注意一些規范,寫法及邏輯嚴謹性。

        2    扼殺潛在的風險
        程序員會去自測,即使有某種情況分支遺漏, 在講解的過程中其他同學也能發現。

        3    互相學習提高
        高手是如何寫出邏輯嚴謹,簡潔易懂的代碼的。方便對照自己的不足,逐步的糾正。



 

 

二 如何推動

1 分組結對

   1  一般團隊大前端,后端 肯定有多名同學。
   可以按‘同項目,模塊或老司機帶新’ 的模式進行分組。並指定各個小組組長(最好輪值)。

   2  小組長,負責開發過程中規范提醒 及 發起相互review。



2 集體review

  1  每次review最核心的代碼,控制好時間。

   2 各自講解自己的模塊,復雜業務最好配有流程圖。



3 開發工期

要把 ‘代碼review’及 代碼優化也評估進去。



4 打分制(下面會繼續 講解打分細則)

   1  評判代碼好壞,還是需要一個衡量標准,可以采用打分制度。除同個項目組成員外其余項目組同學,均要給該講解人打分。

   2  打分需要注明:一  需要修復和改進的地方; 二  值得學習借鑒的地方。
   並統一由會議記錄人,郵件抄送相關人員,開發者去落實修改,組長負責跟進驗收。



 

 

三 自查(測)清單

前面說了,要自測。那么我們大概可以從如下方面切入:

1 常規項

1 代碼能夠工作么?它有沒有實現預期的功能(需求),邏輯是否正確等。
2 所有的代碼是否簡單易懂? 是否盡可能的模塊化了?組件化了?是否存在多余的或是重復的代碼?
是否有可以被庫函數替代的代碼(盡量用集團自有的)? 不重復造輪子。
3 代碼符合你所遵循的編程規范么(詳見 我另外html,js,css編碼規范的文章)?這通常包括大括號的位置,變量命名和函數名,行的長度,縮進,格式和注釋。
4 去掉大段被注釋掉的代碼(若有用可以先提交到git上,以后可回滾)
5 循環是否設置了長度和正確的終止條件? 按鈕是否有控制單次點擊,不重復提交?
6 是否有考慮調用api接口緩存問題?是否有可以刪除的日志或調試代碼?
……



2 安全

1 所有的輸入是否都進行了檢查(檢測正確的類型,長度,格式和范圍),考慮了xss攻擊和js腳本注入。

2 引用導入的第二、三方依賴包,是否存在不可用 和 版本升級導致功能不可用的風險。
是否是GPL協議的源碼( 不能用,否則會要求使用者的代碼也開源)

3 本機保存的數據,是否有泄漏的隱患。(銘感數據不做本地存儲,即使保存也需要加密)。

4 所有的請求鏈接是否都是用https,包括圖片地址。

5 發布之前清理log日志 和 敏感注釋。尤其是前端同學。



3 文檔

1 是否有注釋,並且描述了代碼的意圖?數據結構和計量單位是否進行了解釋?
2 對非常規行為和邊界情況處理是否有描述?
3 第三方庫的使用和函數是否有文檔?
4 是否有未完成的代碼?如果是的話,是不是應該移除,或者用合適的標記進行標記比如‘TODO’?



4 性能速度

1 頁面加載顯示是否超過3s(用戶超過3s 就會不耐煩,除非你有很友好的提示。。。)
2 js代碼 是否有明顯影響性能的邏輯 和 計算。
3 同個組件 或者 頁面布局層級嵌套盡量不要太深,保持簡潔性。



 

 

 

四 評分標准及規則 (5大維度,總分100)

1 需求功能覆蓋率 --------權重3(30%)

9-10分:代碼嚴謹、邏輯分支覆蓋全面 無遺漏
6-8分:無關鍵邏輯分支遺漏,普通遺漏不超過2次
0-5分:關鍵邏輯分支遺漏1次及以上 或其他分支遺漏2次以上



2 代碼結構耦合度--------權重3(30%)

9-10分:結構清晰,模塊獨立(數據融合),模塊間關聯簡單,模塊內完成特定子功能
6-8分:模塊間中度藕合(控制藕合)
0-5分:模塊間強藕合,模塊內功能復雜



3 健壯性---------2(20%)

9-10分:性能穩定,異常考慮周全,沒有安全注入風險----1 頁面打開速度不超過3s 2 破壞性測試情況下依然穩定加載
6-8分:異常處理不到位(undefined等),存在性能問題,但不影響關鍵流程,不宕機
0-5分:關鍵流程存在問題,有宕機風險



4 簡潔度------1(10%)

9-10分:沒有冗余代碼,沒有重復造輪子,單個函數功能單一,建議不超過20行,無多余導入的包或類
6-8分:存在冗余,重復代碼
0-5分:普遍存在冗余,重復代碼



5 可讀性------1(10%)

9-10分:嚴格執行集團編碼規約,易於理解,命名規范,注釋清晰 
6-8分:存在閱讀障礙與閱讀困難的情況
0-5分:關鍵邏輯與復雜代碼缺乏注釋,理解極度困難




ps: 分數最終計算方式可以這么着
1 總分按100分算,單項最終得分=評分*權重 (例如‘覆蓋率項得總分27=9*3) ,然后把5項的總分加起來。



2 3.75的標准就是各項加起來90分+ ;3.5的標准就是加起來80分+






 

補充:
1    方法的請求  和  數據處理  盡量分離, 抽離 (一個方法只做一件事情)。

2    相關對象,做下 容錯 或 默認值 處理。

3    主要review  1  異常情況分析處理       2  主流程業務有無遺漏。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM