Performance Guide"

From Documentation
Line 9: Line 9:
 
If we don't disable auto refresh in such case, the zk spreadsheet will generate a lot of small AU response to a browser which slows down browser rendering speed.  
 
If we don't disable auto refresh in such case, the zk spreadsheet will generate a lot of small AU response to a browser which slows down browser rendering speed.  
 
* initialize a book upon a data source (e.g. a database) before zk spreadsheet renders itself.  
 
* initialize a book upon a data source (e.g. a database) before zk spreadsheet renders itself.  
Sometimes we need to load the data from a database to initialize a sheet before zk spreadsheet renders in a browser. Disable the auto refresh can eliminate Spreadsheet's unnecessary internal operations for rendering.
+
Sometimes we need to load the data from a database to initialize a sheet before zk spreadsheet renders in a browser. Disable the auto refresh can eliminate Spreadsheet's unnecessary internal calculations for rendering.
  
 +
In order to manually control UI update, we have to:
 +
# disable auto-refresh with <tt>setAutoRefresh(false)</tt>
 +
# notify changed area with <tt>notifyChange()</tt>
  
<source lang='java'>
+
<source lang='java' high='6, 12'>
 
private void loadData() {
 
private void loadData() {
 
Sheet sheet = ss.getSelectedSheet();
 
Sheet sheet = ss.getSelectedSheet();
Line 20: Line 23:
 
range.setAutoRefresh(false);
 
range.setAutoRefresh(false);
 
range.getCellData().setEditText(row+", "+column);
 
range.getCellData().setEditText(row+", "+column);
CellOperationUtil.applyFontHeightPoints(range, 14);
+
CellOperationUtil.applyFontColor(range, "#0099FF");
 
CellOperationUtil.applyAlignment(range, Alignment.CENTER);
 
CellOperationUtil.applyAlignment(range, Alignment.CENTER);
 
}
 
}
 
}
 
}
Ranges.range(ss.getSelectedSheet(), 0, 0, ROW_SIZE, COLUMN_SIZE).notifyChange();;
+
Ranges.range(ss.getSelectedSheet(), 0, 0, ROW_SIZE, COLUMN_SIZE).notifyChange();
 
                 ...
 
                 ...
 
}
 
}
 
</source>
 
</source>
 +
* line 6: disable the auto-refresh before changing cells (calling setter)
 +
* line 12: notify changed range of cells
 +
 +
 
== Notify Change ==
 
== Notify Change ==
  

Revision as of 03:27, 4 February 2016



Refresh UI Update Manually

When calling Range setter method, zk spreadsheet will automatically check cell dependencies, update the dependent cells and refresh the spreadsheet UI of the range. However, in following cases, developers might not want such "automation" and like to control the evaluation and update by themselves:

  • Change a lot of cells in a batch.

If we don't disable auto refresh in such case, the zk spreadsheet will generate a lot of small AU response to a browser which slows down browser rendering speed.

  • initialize a book upon a data source (e.g. a database) before zk spreadsheet renders itself.

Sometimes we need to load the data from a database to initialize a sheet before zk spreadsheet renders in a browser. Disable the auto refresh can eliminate Spreadsheet's unnecessary internal calculations for rendering.

In order to manually control UI update, we have to:

  1. disable auto-refresh with setAutoRefresh(false)
  2. notify changed area with notifyChange()
	private void loadData() {
		Sheet sheet = ss.getSelectedSheet();
		for (int column  = 0 ; column < COLUMN_SIZE ; column++){
			for (int row = 0 ; row < ROW_SIZE ; row++ ){
				Range range = Ranges.range(sheet, row, column);
				range.setAutoRefresh(false);
				range.getCellData().setEditText(row+", "+column);
				CellOperationUtil.applyFontColor(range, "#0099FF");
				CellOperationUtil.applyAlignment(range, Alignment.CENTER);
			}
		}
		Ranges.range(ss.getSelectedSheet(), 0, 0, ROW_SIZE, COLUMN_SIZE).notifyChange();
                ...
	}
  • line 6: disable the auto-refresh before changing cells (calling setter)
  • line 12: notify changed range of cells


Notify Change

Ignore Height Calculation

since 3.8.3

If your application doesn't allow users to do any operation that needs a row height calculation e.g. enable / disable wrap text, change a font size, then you can set the attribute ignoreAutoHeight to true. This will improve client-side rendering speed much.

<!-- default is false -->
<spreadsheet  ignoreAutoHeight="true"/>




All source code listed in this book is at Github.


Last Update : 2016/02/04

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.