JavaScriptのソフトウェアメトリクスを測定してみた

Adways Advent Calendar 2018 4日目の記事です。

http://blog.engineer.adways.net/entry/advent_calendar_2018


 

こんにちは、佐藤です。

最近、担当しているプロジェクトのコード量も増えてきて、一度プロジェクト全体の状況を把握したいなと思いJavaScriptコードのソフトウェアメトリクスを試してみました。
今回は、ソフトウェアメトリクスで使用したplatoについて紹介したいと思います。

ソフトウェアメトリクスとは

ソフトウェアメトリクスとはソフトウェアの品質を数値化し定量的に評価したものです。
典型的なソフトウェア測定法しては以下が挙げられます。

  • 成長オーダー(アルゴリズム解析、O記法など参照)
  • ソースコードの行数
  • 循環的複雑度
  • ファンクションポイント法
  • ソースコードの行当たりのバグ数
  • コード網羅率
  • 顧客要求仕様の行数
  • クラスおよびインタフェースの個数
  • Robert Cecil Martin のソフトウェアパッケージ測定法
  • 凝集度
  • 結合度

https://ja.wikipedia.org/wiki/%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E6%B8%AC%E5%AE%9A%E6%B3%95 より引用

platoとは

JavaScriptコードのソフトウェアメトリクスを測定し、HTMLレポートを出力してくれるツールです。

github.com

早速、platoを使用して、ソースコードの行数や循環的複雑度を測定していきたいと思います。

使い方

※ Node.jsはインストールしている前提

インストール

npm install -g plato

以上、簡単ですね。

レポート出力

以下のコマンドでHTMLレポートが出力されます。

plato -r -d report -t "Vue.js Source Analysis" src
  • -r: ディレクトリを再帰的に検索します
  • -d: 出力先のディレクトリ
  • -t: レポートのタイトル
  • srcは測定対象のディレクトリ

他にも除外ファイル指定やESLintの指定ができます。詳しくは,

plato -h

で使い方を確認してみてください.

出力してみた結果

今回、テストとしてVue.jsプロジェクト(https://github.com/vuejs/vue)で測定した結果、以下のような感じになりました。

f:id:AdwaysEngineerBlog:20181204204710p:plain
レポート画像1

"SLOC(ソースコードの行数)"や"Complexity(循環的複雑度)"、"Lintエラー数"の他にも"Maintainability(メンテナンス性)"や"Estimated errors in implementation(見積もりのエラー数)"が表示されます。各項目の説明は項目のツールチップで確認することができます。

ファイル毎の結果も表示することができます。

f:id:AdwaysEngineerBlog:20181204204753p:plain
レポート画像2

画像では伝わりにくいと思うので、platoで提供されているレポートのサンプルを見てみるといいと思います。

まとめ

ものすごく簡単に導入することができました。
レポートもわかりやすく、個人的にはいい感じで気に入ってます。
今後は定期的にメンバーでレポート見て振り返る時間を設け、リファクタリングの際の参考にできればいいかなと思います。
今回紹介したplatoなどのコードメトリクスツールを活用して、自社サービスのソースコードの品質を向上させていきたいと思います!

参考


 

次は三田谷さんの記事です。

http://blog.engineer.adways.net/entry/advent_calendar_2018/05