ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Webブラウザ上で動かすプログラムは遅い、と感じてしまう方はぜひWebAssemblyにトライしてみましょう。表示にCanvasを使えば高速ですし、コンパイルされているのでコードを見られることもありません。ロジックの隠蔽と表示の高速化、二つのメリットがあります。

そんなWebAssemblyによるデモとしてPerspectiveを紹介します。ピボットテーブルや大量のデータのグラフ化を行うライブラリです。

Perspectiveの使い方

ピボットテーブルの例です。

ピボットテーブル
ピボットテーブル

縦横ともにドラッグ&ドロップでメンテナンスできます。

ピボットテーブルの編集
ピボットテーブルの編集

さらに複雑なグラフの描画も。データの表示、非表示といった変更もリアルタイムに反映されます。

グラフ
グラフ

表示する情報を変更すればグラフにも即座に反映されます。

グラフ変更
グラフ変更

情報を変更しました。

変更後
変更後

グラフの種類も変えられます。

散布図
散布図

大量のデータもスムーズに表示されます。

データの一覧
データの一覧

JavaScriptも高速化されていますが、それでもWebAssemblyにはとても敵うものではありません。WebAssemblyはDOM操作ができないのが欠点ですが、Canvasを使うようなチャートなどであれば問題ないでしょう。

PerspectiveはC++製のオープンソース・ソフトウェア(Apache Licnese 2.0)です。

Perspectiv e| perspective

jpmorganchase/perspective: Streaming pivot visualization via WebAssembly

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2