コードクローンからNode-REDの利点を知る

IoTビジュアル言語あるいはローコード環境として知られるNode-REDは、使いやすく生産性も高いです。しかし、ビジュアルだからとか再利用しやすいと言ってもなかなか伝わりません。さらにライブラリが豊富でNode.jsの性能やライブラリがそのまま使える、などと話をしだすと余計に本質的なところを説明できていないようにも思えます。色々考えた結果、Node-REDはコードクローンをうまく扱える環境だと説明すべきだと気づいたので、まとめました。

#TL;DR
* コードクローンはコピー&ペーストから作られる類似コードで、そこにバグや仕様変更があると修正が大変
* Node-REDはVisual言語なので正規表現よりも簡単かつ直感的にコードクローンを探せる
* 視覚的に探すので、修正が多くてもコードクローンを見つけやすい
* Node-REDにはコピー&ペーストやコード共通化のしくみが複数ある
* Node-REDのメリットを一緒に享受しよう

# コードクローンとは
## コードクローンはこうして作られる
[コードクローン](https://sel.ist.osaka-u.ac.jp/research/clone/index.html.ja)とはコピー&ペーストされたプログラムコードを元に作成されたプログラム部分で、以下のような操作が行われて作成されたと考えられます。

* コードのコピー
* 変数名、定数名、関数名、引数名などの変更
* コメントの変更
* 空白や改行など体裁の変更
* 小規模な処理の追加、削除、変更

つまり、大まかな処理の構造が同じコード片と言えるでしょう。

## コードクローンのメリットとデメリット

コードクローンには短期的なメリットと長期的なメリットがあります。短期的なメリットは、新規に開発する工数や共通化に必要な工数をかけることなく実装が進むことです。開発が逼迫している中でよく行われるテクニックです。
長期的なメリットは、コピーされたコードを独立して修正できるので、改造が容易になる可能性があることです。似て非なる処理を共通化していると、関係のない処理のために不具合が生じていないか確認する必要がありますので、必ずしも共通化が効率的ではありません。
逆にデメリットとしては共通部分に不具合や仕様変更があった場合、すべてのクローンを探して修正しないといけないことです。

# クローンの検索
## 見てわかるクローン
クローンを探すにはフリーまたは有償のソフトを使うと便利ですが、grepなど汎用の検索ツールの正規表現で検索するのはかなり大変です。単純なコピー＆ペーストや特定のキーワードで探すなら簡単なのですが、構文で許されるスペースやコメントを意識したり、変数名などの変更も意識しないといけないからです。
Node-REDの場合、キーワードで検索できるだけでなく、プログラムの構造を目で見て探すことができます。
Node-REDは処理の単位であるノードを線でつなぐことでプログラミングします。ノードは種類によって色が異なりますので、色と構造から簡単にコードクローンを見つけることができます。その反面、ノードの配置が大きく変わるとコードクローンが見つけにくくなりますので、一つのプログラム内では配置のパターンを揃えておくと良いと思います。

## 検索の曖昧さはあなた次第

コードクローンのツールではコードクローンとするコード片や一致しない（修正したと思われる）コード片の行数の範囲が指定できるものがあります。
Node-REDでは視覚的に検索しますので、設定値に悩むことなく探すことができます。探している間に（人間が）レイアウトの違うパターンを学習しますので、コードに慣れれば慣れるほどうまく検索できるでしょう。

## メソッドマタギを避けられる

コードクローンを正規表現で探す場合に、変更部分として自由な文字列を許すと複数のメソッドをまたいで一致する部分を見つけてしまいます（この問題を専用ツールは解決するために構文を解析します）。
Node-REDで変更は必ずファンクションノード、標準ノード、カスタムノード、サブフローあるいはそれらからなるフローですので、構文的に意味のある単位です。表現を変えるとエディタで操作できるものが構文をまたぐことができませんので、見たままの構造で探すことができます。

## 変更の多いクローンも見つけられる

コードクローンの検索ツールでは修正行数を指定できると書きましたが、Node-REDでは人間がどのように検索するかにかかっていますので、例えば処理の開始と終了だけ同じものを探したり、処理中に現れるループの構造が同じ部分を探すことも可能です。
一般的な（Visualでない）プログラム言語では、変更部分が一定の行数以内でないとクローンと判定できないので、追加処理が増えてくるとその部分を別メソッドに切り出しておかないといけません。
Node-REDではある程度、記述パターンや構造を意識して書かれていれば視覚的にコードクローンを認識できます。例えるなら、ある動物の頭としっぽをそのままに、別の動物の胴体を持ってきたり、ラクダのコブを他の動物につけてもコピーされた部分が認識できるようなイメージです。Visualなものは記号と異なり、部分的な同一性を認識しやすいと思います。

# クローンの編集方法いろいろ
## コピー＆ペースト
まずはクローンの作り方です。フローを同一アプリであれば複数ノードを選んでCTRL-C、CTRL-Vするだけです。普通の言語と同じですね。フローを異なるアプリで共有する場合は、全体、タブ、選択範囲のいずれかを選んでJSONでクリップボードやローカルファイルに書出せます。ファンクションノード（javascriptで機能を書けるノード）の中のコードであれば、上述の方法でファンクションノードごとに取り出すこともできますし、コードを選択してクリップボード経由で取り出して他のファンクションノードにペーストできます。
コピーしたあとは必要に応じて修正し、そのノードの絹が示されるようにノードの名前を修正してください。ノードの名前やコメント、グループ化で可読性が向上します。クローンを探した際にも全く同じなのか、修正されたのか簡単にわかるでしょう。

## 共通化

コードクローンにはデメリットもありますので必要に応じて共通化しましょう。
フローを共通化する簡単な方法はサブフローです。複数の部分的なフローを一つのノードとして扱うことができます。入力は無しか1つだけですが、出力は複数持てますので、判定を含む様々な処理を共通化できます。サブフローそのものにはパラメータを設定することができませんので、msgオブジェクト、フロー変数、グローバル変数、環境変数などで渡します。
もしパラメータをノードのUIで設定したいのであれば、カスタムノードも考えられます。コードはjavascript、UIはHTMLになりますが、標準ノードと同じようにドラッグ＆ドロップでフローを書くことができます。
共通化は意識しておきたいが、修正が入る可能性がある場合は、コメントやグループで共通の処理であることを示しておきましょう。

# おわりに
様々な特徴を持つNode-REDは利点がありすぎて説明することが意外と難しいです。ここではコードクローンの視点でその利点を説明しました。まだまだ書ききれていないような気もしますので、ぜひ一度使ってください。きっとその良さがわかるでしょう。
こんなに素晴らしいNode-REDですが、普及はまだまだです。「よし！他社に先駆けてそのメリットを享受しよう！！」という方がおられましたら、ぜひ協力させてください。