search

online-go / online-go.com

Source code for the Online-Go.com web interface
https://online-go.com/
GNU Affero General Public License v3.0
1.18k stars 330 forks source link

Blank board with no grid or stones when clicking back into tab #2655

Open adamreisnz opened 1 month ago

adamreisnz commented 1 month ago

Describe the bug I have a tab with an active OGS game open in my browser. When I go and work in other tabs, and then return to the OGS tab, the grid and stones have disappeared and all I see is a blank wooden board.

This problem started a few days ago.

To Reproduce Steps to reproduce the behavior:

  1. Open a tab with an active OGS game (correspondence)
  2. Go do something else in another tab
  3. Wait about 1-2 minutes, or click around a bit between other tabs (not 100% sure if this is triggered over time or by other browsing activity)
  4. Go back to the OGS tab
  5. Note that stones and grid have disappeared
  6. Clicking on "back one move" or refreshing the page resolves the problem until the next time it occurs.

Expected behavior For the grid and stones to remain visible, as was previously the case.

Screenshots

image

Desktop (please complete the following information):

adamreisnz commented 1 month ago

The same thing is happening on the home page with the games overview:

image
ChrisMoutsos commented 3 weeks ago

I am experiencing this bug as well. I am not sure what causes it exactly, either.

anoek commented 1 week ago

Are you also on Mac, and also using Chrome @ChrisMoutsos ?

Chrome version 124, are you both still seeing this?

adamreisnz commented 1 week ago

Hi @anoek thanks for checking in. I have just checked it with Chrome 124, and have not run into the issue yet. Will post again if it does return, thanks!

Do you reckon it was a Chrome/webkit canvas rendering bug?

adamreisnz commented 1 week ago

Ah, looks like I spoke to soon, it's still happening unfortunately, on all 3 tabs that I had opened

image image
anoek commented 1 week ago

Bummer.

Whelp, I think the immediate workaround is to switch to a browser that doesn't have that bug, Firefox has always performed quite well.

Longer term the workaround site side is to switch rendering to use SVG's instead of Canvases. That seems to be an increasing priority, so I'll be working on that soon I think - however that's a fair undertaking so in the interim I'd suggest using Firefox.

adamreisnz commented 1 week ago

Ok, all good. Nah, I'll stick with Chrome. Will just have to refresh the page every now and then. Interestingly enough mobile Chrome doesn't seem to be affected?

Do you have any insights into what is actually causing the bug?

And what else has been driving the switch from Canvas to SVG? Curious about that direction. I didn't think you could do everything you can with Canvas with SVG, but I might be wrong.

anoek commented 1 week ago

On mobile it's a canvas allocation issue (out of memory). It only happens on iOS, and it'll happen after a couple of allocations or several hundred, sometimes it'll be a very tiny allocation (like we do for the stones), or sometimes the whole board. It feels to me like the browser isn't reclaiming some form of memory browser-wide, causing seemingly random failures on our site in particular, but I don't know for sure.

anoek commented 1 week ago

And yeah, SVG can't do everything canvas can do, but I think it can do everything we need it to do. This, amongst other anti-canvas issues that browsers have (canvases can/are used for fingerprinting in browsers, and so we've had to deal with working around issues that were introduced by browers attempting to combat fingerprinting). SVG's should work better for all of that, and make things usable when strict privacy modes are on (which results in our board looking like garbled static on those browsers sometimes). Should, in theory, fix issues like this too.

adamreisnz commented 1 week ago

Interesting, thanks. I'll have a look into that for my own project (Let's play go) as well. Currently using canvas, but it does have its quirks. Especially when dealing with rendering drop shadows for stones etc it can be a bit of a pain to clear/redraw them properly. If that can be just an SVG with a CSS applied drop shadow that would be so much cleaner.

anoek commented 1 week ago

Yeah, shadows were a big pain. We'll see how it goes, I went with canvas originally because SVG support was inconsistent and glitchy way back when, but it's pretty solid now so I think it'll probably be an overall win these days.

ChrisMoutsos commented 1 week ago

Are you also on Mac, and also using Chrome @ChrisMoutsos ?

Chrome version 124, are you both still seeing this?

Yes, I am on a Mac (Ventura 13.4) and using Chrome (Version 124.0.6367.119 (Official Build) (arm64)). I am still seeing it as well.