Upgrade to Pro — share decks privately, control downloads, hide ads and more …

コードメトリクス計測による課題可視化と品質確保 / Visualize issues and...

texdeath
August 30, 2024
250

コードメトリクス計測による課題可視化と品質確保 / Visualize issues and ensure quality by measuring code metrics

texdeath

August 30, 2024
Tweet

Transcript

  1. 導入を検討したもの • octocov ◦ GitHub Actionsに特化している ▪ シンプルだったがカバレッジレポート生成やバッジの表示など、特 定の機能用途にしか使えなさそう ▪

    ローカル環境で試すのが大変そう • SonarCube / SonarCloud ◦ ダッシュボードがあって分析には活用できそう ◦ カスタマイズの敷居が高い ▪ 体系的な知識がないと使いこなすのは難しそうだと判断した ▪ 初期設定に少し手間がかかった
  2. ESLintで解析 • 導入が手軽だった ◦ プロジェクトにもともとESLintを導入していたので、拡張が容易 • 拡張性が高かった ◦ 解析→出力のスクリプトを自前で作るので、よりプロジェクトの環境に 合わせた設定ができた

    ◦ コンフィグの設定次第で柔軟に解析の調整ができるので、落とし所を探 るのにちょうどよかった • ESLint の complexity を使って循環的複雑度を重点的に計測
  3. AST構文解析で判定 • 計測用の eslintrc ファイルを 作成 • eslint の静的構文解析を使い json

    レポートを出力し、そこ から修正すべき箇所を抜き出 すようにした • リポジトリに JavaScript / TypeScript 以外の言語をあ まり入れたくなかったので Node で作成
  4. MathWorks > 循環的複雑度より引用 https://jp.mathworks.com/discovery/cyclomatic-complexity.html 今の悩み • 循環複雑度の閾値をどうするか ◦ 現在の設定では10以上 ◦

    11~29 であってもテストコードなどで担保できるのであれば、開発 スピードを落とすくらいならある程度は許容すべき?
  5. 今後考えていること • 頻繁にレポートに出力されるものをドキュメント化する ◦ 一定数ワーニングが出たコンポーネントや関数、ルールに関して は専用のドキュメントを作り、規約化する • CI に組み込む・パッケージ化 ◦

    もろもろコストも考えるとあまりやりすぎたくない • 取り組みを始めたばかりなので成果が出たわけではないが、フロント の環境だけで完結して指標が見えたのは光明
  6. EOF