SpreadJSでは、ユーザーがセルのダーティステータスを設定することにより、ワークシートで変更されたセル値の詳細を取得できます。本オプションはセルの変更詳細を提供しますが、ユーザーが大量のデータでソートなどの操作を実行する場合、パフォーマンスのオーバーヘッドもなります。
このような場合、パフォーマンスを最適化するにはsuspendDirtyメソッドとresumeDirtyメソッドの使用をお勧めします。
suspendDirtyメソッドで、ソートが完了するまでSpreadJSがセルのダーティステータスをマークするのを停止し、resumeDirtyメソッドで必要に応じて復元します。これらの2つのメソッドを使用することでSpreadJSのパフォーマンスを向上できます。
次のコードは、SpreadJSで操作する際、suspendDirtyメソッドとresumeDirtyメソッドでパフォーマンスを向上する方法を示します。
JavaScript |
コードのコピー
|
---|---|
var startTime, endTime; window.onload = function () { var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss")); var sheet = spread.getActiveSheet(); var data = generateData(50000); var colInfos = generateBindingColumnInfos(7); loadingData(sheet, colInfos, data); spread.bind(GC.Spread.Sheets.Events.RangeSorting, function (sneder, args) { // suspendDirty()メソッドを呼び出して、ソートされたセルのダーティステータスの設定を停止します sheet.suspendDirty(); }); spread.bind(GC.Spread.Sheets.Events.RangeSorted, function (sender, args) { // セルのダーティステータスを復元するためにresumeDirty()メソッドを呼び出します sheet.resumeDirty(); }); }; function loadingData(sheet, colInfos, data) { sheet.suspendPaint(); sheet.autoGenerateColumns = false; sheet.bindColumns(colInfos); sheet.setDataSource(data); sheet.rowFilter(new GC.Spread.Sheets.Filter.HideRowFilter(new GC.Spread.Sheets.Range(0, 0, sheet.getRowCount(), sheet.getColumnCount()))); sheet.resumePaint(); } function generateData(itemCount) { var data = []; var countries = ["China", "American", "UK", "Japan", "France"]; var products = ["Computer", "Car", "Others"]; var colors = ["Red", "Green", "Blue", "White", "Black", "Yellow", "Pink", "Orange"]; var dt = new Date(); for (var i = 0; i < itemCount; i++) { var item = { id: i, date: new Date(dt.getFullYear(), i % 12, 1), country: countries[Math.floor(Math.random() * countries.length)], product: products[Math.floor(Math.random() * products.length)], color: colors[Math.floor(Math.random() * colors.length)], amount: 1000 + Math.random() * 10000, big: Math.random() > .5 }; data.push(item); } return data; } function generateBindingColumnInfos(colCount) { var bindColumnInfos = [ { name: "id", displayName: "ID", size: 60 }, { name: "product", displayName: "Product", size: 90 }, { name: "country", displayName: "Country", size: 90 }, { name: "amount", displayName: "Amount", size: 90, formatter: "#,##0" }, { name: "date", displayName: "Date", size: 90, formatter: 'yyyy-mm-dd' }, { name: "color", displayName: "Color", size: 85 }, { name: "big", displayName: "Big", size: 90, cellType: new GC.Spread.Sheets.CellTypes.CheckBox() } ]; return bindColumnInfos; } |