🏠 back to Observable

long string output cells on macOS and Chrome

When I click the “Show XXXXX truncated lines” in either of the output cells in this notebook in Chrome (on macOS), after a certain point the output becomes white, and the other string cell becomes white as well. (I can still select text in the other cell but it doesn’t get highlighted. I can even click on the expand link there too and the other cell gets bigger):

Can anyone else reproduce this? Expanding the output works fine for me in Chrome on Windows and in Firefox and Safari.

Sadly, it appears that macOS Chrome (at least) does not take well to rendering an iframe that is 440,491px tall. We’ll probably need to implement some fancier logic around how we display very large strings.

Can’t replicate it on MacOS High Sierra, Chrome 72.0.3626.109. I see short flashes of white when scrolling, but the new part still pops in less than a second later.

What is your graphics card and display resolution?

My MacBook is on Mojave and Chrome is version 72.0.3626.119. The graphics card is the AMD Radeon Pro 560X and the display resolution is 2880 x 1800 Retina.

By the way, I first noticed this issue in a separate notebook with ~10 cells with ~700 line long strings. When I refresh that notebook and expand a cell, I also see short flashes of white while scrolling, but after working for “a while” (presumably after expanding and reloading the long string outputs multiple times) eventually all other cells remain white when I expand one of the string outputs.

I encountered a different issue while trying to replicate this: When the first cell is expanded and I focus and save the cell, the viewport seemingly blanks out because the its height doesn’t update to the now truncated cell height.

Interestingly this only happens on the first attempt. If I scroll to the top the viewport height updates, and also updates properly on all additional attempts.

@mike Would it help if I recorded a performance profile for you guys?

Edit: That’s weird. I still have a performance profile saved where the effect can be seen, but now I can’t reproduce it anymore.

Edit 2: OK, I can still reproduce it , but not reliably. If the cell is saved while the cursor is outside the viewport, the viewport height won’t update until one hovers over the updated cell output. So, likely a very low-priority issue.

1 Like

I ran into this issue again today so I did some more digging and I think I’ve found the culprit.

For reference, here’s another test notebook:

I can reliably trigger flickering (in Chrome on macOS) by making the numbers in this notebook sufficiently large (for me, whenever the iframe is made to be above ~25000px and there are more than ~500 link elements, the entire page flashes whenever the cursor blinks).

After some more searching, I found “Issue 852348: Chrome 67 + macos built in display + iframe = screen flickering” on the Chromium bug tracker.

When I tried disabling site isolation (temporarily) per the comments there, the issues in this notebook and the one in my original post go away so I’m now convinced that this is the underlying problem.

1 Like

An update: a (partial) fix for this issue is now in Chrome Canary! It seems the relevant CL will be merged into Chrome 78 as well, so look forward to that in stable Chrome towards the end of October, hopefully.

As I commented on the Chromium issue, there’s still a small amount of flickering / artifacts but at least previously affected pages are now mostly usable.

1 Like