Constant screen jitter on Google Chrome

[matt-sd-watson]

Describe the bug
Opening up the default loaded URL: https://avivator.gehlenborglab.org/?image_url=https://viv-demo.storage.googleapis.com/Vanderbilt-Spraggins-Kidney-MxIF.ome.tif

shows constant axis jitter in both the x and y plane.

To Reproduce
Simply open up https://avivator.gehlenborglab.org/?image_url=https://viv-demo.storage.googleapis.com/Vanderbilt-Spraggins-Kidney-MxIF.ome.tif

Expected behavior
Would expect no jittering.

Screenshots

Environment:

• Browser: Google Chrome
• Browser version: Version 133.0.6943.98 (Official Build) (64-bit)

[ilan-gold]

Interesting, I did not see this in 133.0.6943.55 and then upgraded to 133.0.6943.127 but still did not see it so I would venture a guess that this is a browser/OS-sepecific problem.

1. Could you try upgrading chrome?
2. Could you share your OS?

[matt-sd-watson]

i am on Linux (Ubuntu) and using the most up-to-date Chrome version.

[ilan-gold]

We have definitely had people complain about linux before, and I use Mac so have no way to test this personally unfortunately. Previously it was Firefox on a linux distro someone had mentioned. I am not sure how we could go about debugging this. If you're a developer, I'd be happy to review any PRs or if you have any advice about cross-platform debugging, I'm all ears.

[manzt]

Are there any errors in the console? It looks like the element on the lower left is being added and removed repeatedly from the DOM. So the flickering effect could be some kind of repeated layout shift.

The more surprising is the black main screen (canvas). This makes me suspicious of support for WebGL on your machine, either graphics drivers or having hardware acceleration disabled.

[matt-sd-watson]

These are the only console logs:

Comparatively, there are no problem opening this link which I assume also uses viv: https://hms-dbmi.github.io/vizarr/?source=https://minio-dev.openmicroscopy.org/idr/v0.3/idr0062-blin-nuclearsegmentation/6001240.zarr&viewState={%22zoom%22:1.906988142003,%22target%22:[149.30555129858593,94.90883780233781]}

[ilan-gold]

I think this may be related to #806 then if you're not seeing the issue in vizarr Something is clearly going on with Avivator. I am not sure how to proceed here. It might be worth trying different state management, like jotai as vizarr does.

[camlloyd]

I see the same behaviour on Firefox 135.0.1 (aarch64)/macOS Sequoia 15.3.1 (24D70). Both are up-to-date.

[ilan-gold]

@camlloyd I am not seeing on Sequoia 15.1 and have the same Firefox :/ Do you see this on other browsers?

[camlloyd]

@ilan-gold I have just checked and now cannot reproduce this on Firefox, Chrome or Safari :/

[ilan-gold]

Wow ok so the issue disappeared? Or did you mean only Chrome and Safari didn't have the issue?

[camlloyd]

I didn't test Chrome/Safari when I first saw the issue yesterday - I decided to test these today and couldn't reproduce the issue. I tried Firefox again today and couldn't reproduce the issue either.

I don't have clear steps to reproduce but after ~10 tries, I can see the issue again but in Firefox only.
It's intermittent, but once it trips up the first time, it happens every time until I do a restart.

It is not specific to the dataset above either.

As long as this issue doesn't happen, I can view the datasets just fine.

[xinaesthete]

I have seen this as well - I don't see it in prod version of avivator, and I can't think of any reason why but it potentially be related somehow to my PR #885

I definitely didn't see it at the time of the PR merging, but later when I went back to look at what I'd thought had been ok builds they were exhibiting this behaviour - again today, I found that this was happening in Chrome and for some reason stops with devtools open.

[xinaesthete]

I don't know why this is so intermittent - but it just reared its ugly head for me again and I added workaround so that I could work on that other big PR without it bothering me. Could be cherry-picked into a more focused fix.