デブサミ2011のセッションデモ解説 その２

デブサミ2011（Developers Summit 2011）のセッション「【18-D-2】Windowsフォームで大丈夫か？一番良いのを頼む。」のデモ解説その２です。デモ一式はこちらからダウンロードしてください。

• WPFのレイアウト機能を使った業務アプリ画面
• パフォーマンス コントロールの描画
• パフォーマンス データグリッド
• 日本の業務に適したエディット系コントロール

　この投稿では「パフォーマンス データグリッド」デモを解説します。これは以下のMicrosoft Connectに投稿された内容を検証するデモです。

Microsoft Connect is Retired - Collaborate | Microsoft Docs

　Windows Fromsフォルダには「WindowsFormsPerfomance.exe」、WPFフォルダには「WpfPerfomance.exe」が入っていますので、両方実行してください。以後、前者を（Ａ）、後者を（Ｂ）と記載します。





　（Ａ）の［行］に1000、［列］に50と入力し、［標準DataGridView］ボタンを押してください。ウィンドウサイズを好きな大きさに広げてスクロールバーによる上下のスクロールがスムーズに動作するかどうかを確認します。同じことを（Ｂ）でも実施します（ボタンは［DataGrid］）。おそらくスクロールバーがマウスに追従してこないほどスクロール動作が遅いことを確認できるのではないかと思います。





　今度は（Ｂ）で［行］に1000000（百万）、［列］に1と入力し、［DataGrid］ボタンを押してください。単純に考えれば1000行×50列＝50000（5万セル）に対して1000000行×1列＝1000000（百万セル）となるため、スクロールパフォーマンスはさらに悪化すると思うかもしれませんが、非常にスムーズに動作することを確認できるかと思います。


　これがWPF4の標準DataGridでは行方向にしかUIの仮想化が行われていないというセッション資料の内容の証拠です。


※※※※※※2011/07/15追記※※※※※

WPF DatGridのスクロール性能の改善

　上記のMSDNフォーラムの投稿で知りましたが、WPF4の標準DataGridの場合デフォルトでは列方向のUI仮想化が行われていませんが、EnableColumnVirtualizationプロパティをTrueに設定することで双方向のUI仮想化が有効になるようです。

DataGrid.EnableColumnVirtualization プロパティ (System.Windows.Controls)

　しかし、フォーラムの投稿にも書かれている通り、列方向のUI仮想化を有効にする前よりはスクロールパフォーマンスが格段に速いものの、なぜか列数が多くなるにつれてパフォーマンスは悪化するようです。
※※※※※※※※※※※※※※※※※※






　（Ｂ）で［DataGrid］ボタンの右隣にある\マークを押すと、［FlexGrid］ボタンが表示されます。一番初めに実施したのと同様に［行］に1000、［列］に50と入力し、［FlexGrid］ボタンを押してください。FlexGridでは行と列の双方向にUIの仮想化が行われるため、スクロールパフォーマンスは連結しているデータの行数や列数に依存しません。この場合、実際に画面に表示されているセル数がスクロールパフォーマンスに影響します。





　FlexGrid for WPF 1.0Jは2011年夏ごろの発売を予定しています。ほぼ同じ機能とインターフェイスを持ったFlexGrid for Silverlight 1.0Jは下記のページで確認できますので、ご興味のある方はこちらをご確認いただければと思います。

アプリケーション開発支援ツール／コンポーネント／ライブラリ | Developer Tools - グレープシティ株式会社

　もし、もう少しこの現象を詳しく確認してみたいという場合には、WPF Performance SuiteというツールのVisual Profiler機能を使用して確認できます。



※表示されていなくても50列目のセルAX1が生成されている。


　WPF Performance Suiteのインストールについては、下記の投稿をご参照ください。

WPF Performance Suiteのパッチ - Yuya Yamaki’s blog

　最後にこのデモでWPFがWindowsフォームよりも優れている点を確認します。（Ａ）と（Ｂ）のFlexGridで［行］を1000、［列］を50として横スクロールを試してみてください。その１で解説した即時モードの方式からくるチラつきのような現象が（Ａ）でのみ発生するかと思います。また、［行］を1000000（百万）、［列］を1とした場合も、上下に高速にスクロールをし続けることで（Ａ）では完全に表示が止まってしまっているような現象を確認できるかと思います。


　私は、WPFの描画技術のすばらしさは1000個のコントロールを描画に○秒しかかからないといった絶対的なパフォーマンスよりも、むしろこういった流れを止めない“Fluid UI”を実現するためのパフォーマンス特性を持っていることだと思っています。それが、前回のその１と今回のその２で解説したデモを通して一番述べたかったことです。





　今回のその２はこれでおしまいです。その３では「WPFのレイアウト機能を使った業務アプリ画面」のデモを解説します。