This repository has been archived by the owner on Jul 29, 2019. It is now read-only.
Prevent items from being repeatedly redrawn while off screen #3632
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Fixes almende#3543. None of the options passed in any of the API calls should change the options. This has been registered with issue almende#3548.
…ation (almende#3568) * Network: Prevent crash when dataChanged is triggered during initial setting of options Fixes almende#3562. Options `hidden` and `physics` can emit a `_dataChanged` event within `setOptions()`. If this happens when setting options during the initialization of the `Network` instance, this leads to an error thrown, because there is no DataSet instance connected yet to the instance. This bug was introduced in `v4.21.0`. Unit tests have been added for this case. * Edited comment
* Use mock canvas object replacing `canvas` Fixes almende#3515. A mock canvas object is added to the unit tests, which makes usage of module `canvas` voluntary. The issue with `canvas` is that it requires an external dependency to `cairo`. This complicates setting up a develop environment for `vis.js` - Removed `canvas` from `package.json` - Added section to README.md with instructions on how to install `canvas` instead. * Removed debugger statements * Updates for review * Fixes for review
) Bumped up the version number in the examples using `FontAwesome`, in order to avoid confusion about missing (new) icons as in almende#3408.
Fixes almende#3532 If the images option is set, preload it, even if the node shape is not `image` or `circularImage`. This needs to be done because the user can switch to an image shape later, as is happening in the issue. Option `image` is only mandatory for the image shapes. There is no unit test for this, because it would need a mock object for Image and I didn't succeed in creating/finding one.
* Network: preload images in options for all shape types Fixes almende#3532 If the images option is set, preload it, even if the node shape is not `image` or `circularImage`. This needs to be done because the user can switch to an image shape later, as is happening in the issue. Option `image` is only mandatory for the image shapes. There is no unit test for this, because it would need a mock object for Image and I didn't succeed in creating/finding one. * Network: Handle null data gracefully During testing I discovered that passing `null` for network data leads to a thrown error. This adds a guard to prevent it, plus unit tests for regression.
This shape was added recently and was not showcased anywhere. Hereby added.
Removing duplicate line
Fixes almende#3468. Rather than changing the code, this resolves the issue by adjusting the documentation for event `stabilized`.
* initial trial * Add onInitialDrawComplete * Add docs * Add to eventListeners examples * Keeping things DRY * Remove callback insertion * Remove call * Add initial loading screen * Fix real initial draw call * Remove activateOnInitialDraw method * Add loading screen option * Add docs * Remove onInitialDrawComplete double doc * Simplify example * Simplify stressPerformance example * Remove extra line
almende#3575) * Adds code coverage report the output of `npm test` and adds detailed html code coverage report using the command `npm run-script test-cov` * Switch over to using functions in lib/ rather than dist/, so that code coverage stats are complete. * Import vis at the top level to keep ItemSet passing * Remove requirement for dist/vis in TimelineItemSet
* Interim save cleanup typedefs * Completed transferral of *the* big typedef * Transferred all typedefs to typedefs.js
* Network: DRY code in Label for parsing markup This gets rid of a major eyesore for me. The accumulator object was identical for HTML and Markdown. In addition, the parsing has been refactored. Common elements have been DRY'd and the logic of the parsing has been made more comprehensible. * Added suggestion @mbroad wrt regexp precompile * Fixed linting
* Move majorLables to 1st week in the month, for 'week' scale * next() always adds 1 week to current date * show 1st week in the month as majorLabel * Add 'week' to auto-scale * Update week scale example * Revert "Move majorLables to 1st week in the month, for 'week' scale" This reverts commit 52df3c3. * Correct value of week's minimumStep
* Add template for document generation with 'jsdoc'. In essence, it defines the subdirectory `docs` as a `jsdoc` template. Benefits: - allows the usage of partials, in order to DRY common parts of the html files. - makes available the jsdoc-comments, for addition into the documentation. - enables extraction of data from the source code. For example, the list of edge endpoints `['arrow', 'bar', 'circle']` can now be extracted from the source and inserted into the documentation on generation. In this initial version, the only file that has been changed is `docs/data/dataset.html`. In here, partials have been added to illustrate how common page elements can be DRY'd. The template has been set up in such a way, that resource files will be copied and that html files can pass through unchanged if no special template tags (`<?js...?>`) are used. This allows for a gradual transition of the html files to templates. **Usage:** `gulp docs` - The result files are placed in subdirectory `gen/docs/`. **NOTE:** The release procedure will have to be adjusted by adding this gulp command. The docs-files will then have to be taken from `gen/docs`. * Edits to docs/README * Adjusted layout of README.md * Further edits to README.md * Removed pre tags again in README.md - don't work in code block * Linted the gulpfile * Added proof of concept for docs generation from source
…3576) * Network: force array order when sorting hierarchical levels Fixes #340r34. If coordinates are not available to sort within a hierarchical level, sort to array order instead. The previous fix on this issue was not good enough to circumvent this quirk in the chromium sorting. This should bury it. * Added TimSort for sorting in DirectionStrategy * Added TimSort to LayoutEngine * Fixed typo
…mende#3597) * Added partial, tested with some pages * Docs: Moved end block in all html documentation files to partiel This rcConsolidatersd common footer in all documentation files to a partial. I'm hoping this serves as an example for others to isolate more common blocks (the menu would be the perfect candidate). It's straightforward work.
…ende#3604) * Moved navbar elements in all html documentation files to partial This consolidates the common menu elements in all documentation files to a partial. * Moved test-exclamation mark
* background docs * edge background * Update edges.html * Update EdgeBase.js
Fixes almende#3249 again, because my previous PR got overwritten
|
Sorry, I messed up the PR somehow. I'll close it and make a new one. |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This fixes #3249 again, because my previous PR #3250 got overwritten. (Possibly by #3475) Additionally, this time I feel that this change is a bit more robust than my previous one.
The problem
When an item is outside of the currently visible range, it is hidden by Group.prototype._checkIfVisible(). This detaches the item from the DOM. The next time the group containing the item is drawn, Group.prototype._redrawItems calls RangeItem.prototype.redraw(), which in turn calls RangeItem.prototype._appendDomElement(). This function detects that the item is not attached to the DOM and re-attaches it, triggering a reflow event.
In my application I have several thousand items which are offscreen at a given time, and so this unnecessary redrawing degrades performance quite significantly.
My solution
Currently when a group is drawn, each item is shown (and redrawn) if it currently not displayed. With my change, each item is shown if it's currently not displayed AND it either should be visible, or it's never been visible before.
This correctly gets the size of elements when they are first added, doesn't update the size of the element while it's not visible but immediately updates the size once the element becomes visible again.
Performance impact
It's hard to produce a minimal example illustrating this issue because it only really becomes noticeable when you have thousands of items, each one with a non-trivial template. I hope it will be sufficient to provide some performance numbers from my own app:
Before this patch, when I panned/zoomed the timeline in my application I would dip to 7-10fps. Now, my app only dips to 16-17fps. (I'm still working on improving performance in my app)