エレガントな世界最速の炎のチャートとデータを視覚化

ブレラチャートコントロールは、データを視覚化する機能豊富なコンポーネントです.機能の広い範囲は、データバインド、30 +グラフの種類、アニメーション、ツールチップ、ズームとパン、クロス、選択、および強調表示が含まれています.
このブログでは、我々のパフォーマンスを改善しようとしている2021 Volume 3 リリースこれらのパフォーマンスの向上Syncfusion Blazorチャートは、世界最速です.

ブレザーチャートで高速な動的更新
以前は、Blazorチャートのすべての要素は、単一のコンポーネントの一部と見なされ、RenderTreBuilderメソッド内の単一のビルダーで作成されました.どんなチャート要素にでもどんな一回の変更でも、全体のコンポーネントを再レンダリングします.
しかし、現在では、一連の、軸、伝説、およびデータラベルのようなすべてのチャート要素は個々のコンポーネントと見なされ、それぞれのクラスでRenderTreBuilderメソッドをオーバーライドすることによってレンダリングされます.これにより、グラフ内の任意の要素を更新することができますので、Blazorチャートコンポーネントの高速更新を体験します.

<SfChart>
<ChartSeriesCollection>
         <ChartSeries>                   
         <ChartMarker Visible="true" Shape="@shape"></ChartMarker>
         </ChartSeries>                   
         <ChartSeries>                   
         <ChartMarker Visible="true" Shape="@shape"></ChartMarker>
         </ChartSeries>                   
 </ChartSeriesCollection>
 </SfChart>

@code{

ChartShape shape = ChartShape.Circle;

void ChangeMarker(ChangeEventArgs args)
    {
        shape = (ChartShape)Enum.Parse(typeof(ChartShape), (string)args.Value);
    }

}

次のGIF画像を参照してください.ここで、マーカ形状の変更はチャート内の他の要素には影響しません.
ブレザーチャートで高速な動的更新

ブレザーチャートにおける負荷性能の改善
モジュラーアーキテクチャでは、我々は大幅にブレラチャートの読み込み時間とメモリ消費量を大幅に削減している.我々は、スムーズなユーザーエクスペリエンスを使用してそれらを処理するいくつかの最適化を含む多くのデータポイントを処理するためのグラフを構築しました.
2021巻2のリリースを2021巻3のリリースに比較する、ブレイザーラインチャートの次のメトリックを参照してください.

サーバ側性能指標
レコード番号
ボリューム2と比較してボリューム3の改善
10 k
2 x
50 k
3 x
100 k
3 x
1000 k
4倍

Webassemblyパフォーマンスメトリクス
改善され、最適化されたコードを使用すると、この2021巻3のリリースでは、WASMアプリケーションのBlazorチャートの読み込み時間に大きな違いが表示されます.
データポイント
ボリューム2と比較してボリューム3の改善
10 k
2 x
50 k
4倍
100 k
4倍
1000 k
5倍
注:詳細については、ライブデモをチェックアウトExample of Performance in the Blazor Charts Component .

滑らかなズームと炎のチャートでパン
良いチャートは、大量のデータを扱うとき、滑らかなズームとパンニング経験を提供しなければなりません.今、あなたはZazingで大幅な改善を見ることができますし、フレームあたりのフレーム数は、Blazorチャートパンを達成した.
我々はシリーズと軸だけを変更しているように、ズームとパンは以前のバージョンに比べて滑らかです.
滑らかなズームと炎のチャートでパン

超高速株チャート
以前は、グラフ内の任意の変更は、インジケータやトレンドラインを追加するように、再度再表示全体のグラフをレンダリングします.しかし今、在庫チャートへの変更は、全体のコンポーネントを再レンダリングしません.これは、必要な変更を更新します.これは、在庫チャートの更新インスタントになります*
超高速Blazor株チャート

パフォーマンスのヒント
我々はソースレベルでブレイズチャートのパフォーマンスを向上させたにもかかわらず、それは非常に改善を利用するためにアプリケーションのこれらのヒントに従うことをお勧めします:

マーカーとデータラベルを使用しないでください.代わりに、ツールヒントやトラックボールを使用してデータ情報を表示します.

カテゴリ軸を避けてください.大量のデータに対して数値と日付の軸を使用します.

最速のパフォーマンスのためのラインシリーズを使用します.

結論
読書ありがとう!このブログ記事では、syncfusionの様々な改良を見てきましたBlazor Charts のために2021 Volume 3 リリースあなたは私たちのリリースの詳細を読むことができますRelease Notes and What’s New ページ.場合は、下記のコメントセクションでお知らせください.
既存の顧客のために、重要なStudioの最新版は、ダウンロードから入手可能ですLicense and Downloads ページ.まだSyncFusionの顧客でない場合は、私たちの30日を試すことができますfree trial 当社の利用可能な機能をチェックアウトします.
また、我々を介してお問い合わせすることができますsupport forum , Direct-Trac , or feedback portal . 我々は常にあなたを支援して満足している!

関連ブログ