microsoft / microsoft/SandDance

Flickering after loading new chart data

Open
#279 8 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
7.1k
Forks
573
Avg merge
8d 9h
Merged PRs (30d)
4

Description

Hello,

While integrating SandDance into another application, I've noticed that sometimes when changing the chart data, the application will flicker. I've managed to reproduce this behavior on https://sanddance.js.org/app/ so I don't believe it's specific to how we're using the library. This also occurs in both the latest Chrome and Firefox with their default settings, so I don't think it's browser specific either.

Here's what I'm seeing in Chrome:
sanddance-flickering

Here are the specs for my machine:

MacBook Pro (13-inch, 2017, Two Thunderbolt 3 ports)
macOS Mojave 10.14.6 (18G103)
Processor: 2.3 GHz Intel Core i5
Memory: 16 GB 2133 MHz LPDDR3
Graphics: Intel Iris Plus Graphics 640 1536 MB

And the Chrome Graphics Feature Status:

Canvas: Hardware accelerated
Compositing: Hardware accelerated
Metal: Disabled
Multiple Raster Threads: Enabled
Out-of-process Rasterization: Hardware accelerated
OpenGL: Enabled
Hardware Protected Video Decode: Unavailable
Rasterization: Hardware accelerated
Skia Renderer: Disabled
Video Decode: Hardware accelerated
WebGL: Hardware accelerated
WebGL2: Hardware accelerated

Does anyone have an idea of why this might be happening, or how to prevent it? Hopefully there's something we can do on the JavaScript side of things to ensure that our users have a seamless experience without needing any browser configuration. Let me know if there's any additional information that would be helpful.

Thanks!

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the flicker while changing chart data in the SandDance app at https://sanddance.js.org/app/ using current Chrome and Firefox. Investigate the chart update path in the TypeScript/JavaScript application; done means the same data changes no longer visibly flicker in both browsers without special browser settings.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
data-visualization
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.