マーブルダイアグラム（Marble Diagram）
RxJavaのJavaDocやReactiveXのドキュメントを読んでいると、よくカラフルな丸や四角などの図形や矢印が入った図が出てきます。これはマーブルダイアグラムと言い、リアクティブプログラミングにおいて時間とともにどのようにデータが受け渡され、どのように変化していくかを表現している図です。主にObservableがメソッドを実行すると、時間とともにデータがどのように変化していき新たなObservableを生成するのかを説明するのに使われます。特にRxJavaでは、データストリームとして流れるように来るデータがどのように変化するのかが重要なことです。そのため、時間経過に伴うデータの変化を可視化した図があることによって、文章に加えてビジュアルからの情報も入手できるので、何が行われているのかがさらにわかりやすくなります。
例えばObservableが持つfilterメソッドの場合を見てみましょう。filterメソッドは元のObservableが持つデータから指定した条件のデータのみを持つ新たなObservableを生成するメソッドです。filterメソッドが引数に受け取るものは、そのデータを受け入れるか除外するかを判定する関数型インタフェースです。その関数型インタフェースがデータを判定しtrueになったもののみが新たなObservableから通知されるようになります。
このマーブルダイアグラムでは、filterメソッドによって元のObservableから形が丸のデータのみを通知する新たなObservableが生成されることを表しています。まず、上部の左から右にひかれている横の矢印（A）は元のObservableの時間経過（タイムライン）を表し、左から順にデータが通知されることを表しています。そしてそのタイムライン上にある丸や四角などの図形（B）は元のObservableが通知するデータを表し、下に向かう破線の矢印（C）はデータがメソッドを通して処理されるデータの変換やフィルターの様子を表しています。そして中段にある四角に囲まれた枠はメソッド（D）を表し、その下の左から右に伸びる矢印が新たに生成されるObservableのタイムライン（E）になります。そのタイムライン上にあるデータ（F）が新しいObservableから通知されるデータを表しています。そして各タイムラインの右端にある短い縦線（G）は完了を通知することを表しています。
今回のマーブルダイアグラムの例では、様々な形のデータを持つObservableからfilterメソッドを通して、新たに生成されるObservableには形が丸のデータのみを持つようになることを表しています。そして、新しいObservableでは形が丸でないデータの場合は通知されず、そのまま時間が過ぎていき、再び元のObservableが形が丸のデータを通知するまでデータの通知が行われません。そして最後に元のObservableが完了を通知するタイミングで新しいObservableも完了の通知を行うことを表しています。つまり、新しいObservableは形が丸のデータをすぐに通知したり、全ての形が丸のデータを通知してすぐに完了を通知したりするわけではなく、元のObservableがデータや完了を通知するタイミングで初めて新しいObservableも通知を行うことを表しています。
このようにマーブルダイアグラムでは左から右に向かって流れていく時間を表現し、上から下へ向かってデータがメソッドを通って、どのように変換されるかを表現しています。
もし、Observableの処理が完了ではなくエラーを通知する場合は、その個所にバツ印を記述し何らかのエラーが通知されることを示します。例えばonErrorReturnメソッドでは、元となるObservableに何らかのエラーが発生した場合に、引数に渡されたデータを通知し完了するObservableを生成するメソッドです。このような場合、次の図のようにタイムライン上にバツ印を記述しエラーが通知されることを表します。
それでは次に複数のObservableからなる場合のマーブルダイアグラムを見てみましょう。Observableのzipメソッドは複数のObservableからデータを取得し、そのデータを使って生成した新しいデータを持つObservableを生成します。上の2つが元となるObservableのタイムラインで下が結果のObservableのタイムラインです。
元となるObservableが複数の場合、各Observableがデータを通知するタイミングがそれぞれ異なる場合があります。どのタイミングになるかはメソッドによりますがzipメソッドの場合は各Observableの順番を合わせます。今回のマーブルダイアグラムの場合、次のようなデータを生成しています。
- 1番目に通知される「丸」のデータと「灰色」のデータから「灰色の丸」のデータを生成
- 2番目に通知される「四角」のデータと「黒」のデータから「黒の四角」のデータを生成
- 3番目に通知される「菱型」のデータと「白」のデータから「白の菱型」のデータを生成
そのため、結果のObservableが持つデータは後で通知されるObservableのタイミングに合わせて生成されています。
このようにマーブルダイアグラムは時間経過とともにどのような結果が起こるのかの例を表した図がJavaDocを始めとしたドキュメントの多くに使われています。特に複数のタイムラインを扱うものは文章だけだとわかりにくいメソッドもあるのでマーブルダイアグラムを理解しておくと仕様の理解が進みます。また、RxJavaを使ったアプリケーションの設計や独自のObservableを作る際にマーブルダイアグラムを描いてみると、時間の遷移とともに何が起こるのかを図で表現でき、頭の中で考えていたことも可視化され精査できるので、複雑なことをする際はマーブルダイアグラムを描いてみることを勧めします。
まとめ
今回はリアクティブプログラミングとRxJavaの概要について紹介しました。ただ今回はリアクティブプログラミングの概念やRxJavaの概要についてフォーカスしたため、実際にRxJavaを使った実装は行っていません。そのため、今回の記事は物足りなく感じる人もいるかと思います。
しかし、リアクティブプログラミングについて何も知らずにRxJavaを使っても、単にソースコードが複雑になっただけと感じるかもしれません。そのため今回は、実際にサンプルを作成する前に必要となる知識として、リアクティブプログラミングとRxJavaの概要について紹介するのみにしました。
次回は今回の内容を踏まえ、実際にRxJavaを使ったサンプルを作っていきます。
