Skip to content

Commit 01c8026

Browse files
committed
Async rendering docs.
1 parent 437171a commit 01c8026

File tree

3 files changed

+30
-1
lines changed

3 files changed

+30
-1
lines changed

SUMMARY.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@
2525
* [Visual encoding / Color](advanced/encoding.md)
2626
* [Visual encoding / Size](advanced/visual_encoding__size.md)
2727
* [Scatterplot Matrices](advanced/splom.md)
28+
* [Rendering performance](advanced/performance.md)
2829
* [Plugins](plugins/README.md)
2930
* [Custom Ticks](plugins/customticks.md)
3031
* [Tooltip](plugins/tooltip.md)

advanced/performance.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
## Rendering performance
2+
3+
Drawing big data can be slow.
4+
5+
To prevent browser freeze, several chart settings were introduced in Taucharts v0.10.0:
6+
``` javascript
7+
settings: {
8+
asyncRendering: false,
9+
renderingTimeout: 10000,
10+
syncRenderingInterval: 50,
11+
handleRenderingErrors: true
12+
}
13+
```
14+
15+
* Setting `asyncRendering: true` will make a chart render asynchronously by small synchronous chunks, making a browser more responsive to user interactions.
16+
* `renderingTimeout` is an interval (ms) after which the rendering will be paused, and user will be prompt to continue or cancel. Setting this option to `0` will disable the pause.
17+
* `syncRenderingInterval` is a minimal interval of synchronous rendering chunks.
18+
* Setting `handleRenderingErrors: false` will make it easier to debug possible rendering errors.
19+
20+
Asynchronous rendering prevents browser from freeze, but will not prevent from running out of memory.

basic/settings.md

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,4 +29,12 @@ https://jsfiddle.net/taucharts/9hzfoqop/
2929
These settings control minimal padding between tick text and tick border on ordinal scale.
3030
It is 0.25 by default.
3131
See example where yDensityPadding is set to 30 and xDensityPadding is set to 1:
32-
https://jsfiddle.net/taucharts/p3jtgt4j/
32+
https://jsfiddle.net/taucharts/p3jtgt4j/
33+
34+
#### animationSpeed
35+
36+
Controls the duration of elements animation. By default it is `750` ms. Set `0` to disable animation.
37+
38+
#### asyncRendering
39+
40+
Setting `asyncRendering: true` will make a browser more responsive, when rendering charts with large amount of data and facets. See more info about asynchronous rendering [here](../advanced/performance.md).

0 commit comments

Comments
 (0)