Atrocious quality of text, especially in Morphic World. (Linux)

[stacksmith]

[EDIT: It appears that the images I've uploaded look different from how they appear on a local viewer - different gamma?. Until this is addressed, view all images here with suspicion]. Looking at the self-contained image... Xubuntu 19.10 64 bits. Click on images to see pixel-accurate examples of what I see.

I am assuming something is wrong, because there is little here that could be called glamorous. Perhaps you are looking at it on a Mac with a really high-res screen (not something all of us do or want to do).

• No subpixel antialiasing! Thumb-nailed documents are very hard to make out - subpixel antialiasing would help a lot. It is pretty much not usable.

• Morphic World... Nearly vomited. It has subpixel antialiasing, but it looks like the entire canvas was scaled after rendering. This is just not acceptable as I can't look at it for more than a few seconds without cursing and muttering.

Click to see pixel-accurate image, otherwise it is scaled a little and looks better than the screen I have to look at!

(Note that all recent Pharo images antialias text very nicely...What happened here?)

As an aside: I (and a few people I know) avoid applications and libraries that don't use subpixel antialiasing. It shows a lack of, shall we say, professionalism. Also, a lack of respect for users who have to stare at the screen for hours...

[syrel]

Hi @stacksmith Thank you for the feedback and the issue! it looks like there is something strange going on with GToolkit in your particular environment. Here is how it should look like (or very close) on Mac, Window and Ubuntu:

click

click

Could you provide more information about your system? (OS, Version, gfxinfo, monitor resolution, dpi, etc)

Thanks!

[stacksmith]

Glad to hear that it looks better than here. i7-8700 CPU @ 3.2GHz, 16GB RAM Linux 19.10 (ubuntu) 3.0 Mesa 19.2.8 (out-of-the-box) 3440x1440 LG monitor 60Hz I am not sure what you mean by gfxinfo

[akgrant43]

glxinfo is a command that dumps info about the graphics subsystem:

$ which glxinfo
/usr/bin/glxinfo

Do you have any scaling on your hi-dpi monitor?

Just as a comparison, I'm on Ubuntu 18.04 with a 2560x1440 monitor (no scaling) and haven't seen the morphic host issues.

Does the rendering improve / change if you resize the native windows? Typically just dragging the window a little larger can improve the text rendering.

[stacksmith]

No scaling on the monitor. Stock Pharo renders correctly. I've spent a good part of my life doing imaging and video compression, and everything else renders correctly on my system. This is not just morphic. GT comes up right away wrong. The icons look awful, and the text is so-so (bad kerning and definitely not subpixeled). The triangle Playground icon looks like it was poorly scaled (horizontally stretched a few percent - zoom in on the 'g' in the 'gt' tab and note that an entire pixel column is duplicated - and compare to your image). .
Resizing does not help. And I already sent images of Morphic world. Again, if I were to venture a guess, I would say there is a poor scaling algo applied somewhere in the rendering pipeline. Possibly combined with bad gamma correction.

glxinfo... You wrote 'gfxinfo' originally, hence the confusion. ... deleted now-useless data

[girba]

Thanks for the input!

Just to clarify: the icons are still bitmaps. We do intend to have them expressed as vector graphics (SVG) in the near future, but for now it is still not as nice as we want it. Still, your rendering looks particularly unfortunate.

The text rendering is intended to be better. So, indeed, there seems to be a mismatch in this case, and we will look at it.

Please also note that GT is an alpha because we are working on it. It would be unfair to conclude that we do not care about rendering or our users :).

[stacksmith]

Understood! I don't mean to offend - you are doing great with a massive undertaking. I do hope that the issue is resolved so I can give it a spin and perhaps contribute (I will try to install on a different system when I get a chance). I also hope that visuals are a priority, especially decent antialiasing and modern subpixel glyph rendering (at least until all displays are hi-res enough not to matter, which is not happening too fast).

[girba]

Rendering is indeed a priority. We want hi-res (retina display). On Mac and Windows, it works nicely. On Linux, the font rendering is not quite the same, indeed.

The concrete low-level rendering happens through Skia, the graphics library behind Firefox. So, we should be able to render with the same quality as Firefox. On top of that, the graphical stack is vector graphics already. This is a different architecture than the one from Pharo.

Still, what troubles us more is the quality of the bitmaps that we see in your screenshots. We cannot quite figure out what the issue is. If you have a chance, it would help a lot if you could try installing a Ubuntu 18.04.

[stacksmith]

I've been using FreeType on Linux for years with really good results. Firefox has looked very good for ages on Linux. True, everything looks good on a Mac, and probably Windows (although it escapes me why anyone would use a proprietary OS).

As Ubuntu 18.04 is oldish, I am not too motivated to spend my very limited time on that. Perhaps it would be wiser for you to install an up-to-date Linux, and realistically, set up some VMs with a few versions for regression testing... But I don't meant to tell you how to run your shop.

I am a bit confused: if you are using Skia, subpixel antialiasing should just happen (unless you turn it off). But even your own images above don't show that. And it looks like the text is not kerned, at least in some places.

[girba]

We use Ubuntu 18.04 as a reference because it is the current LTS version. 19.10 is an interim release. Nevertheless, we are installing 19.10 to take a look.

[stacksmith]

Thanks, much appreciated. I had 18.04 but not latest LTS, and the updater forced me to upgrade to 19.10 due to security issues, whatever that means. Unless my assistant bumped me to 18.10 at some point...

[girba]

What scale factor do you use? I assume that you use 100%. Could you try with 200%?

[stacksmith]

Please explain what you mean by scale factor.

[stacksmith]

OK, I found the problem: changing DPI to 96 made everything kind-of nice. It was 100 and something. So that's that. However, Pharo worked fine in both cases, and the DPI adjustment should be applied before antialiasing! Also, it should be proportional, but was definitely horizontal-stretching. Something is still wrong on your side. The kerning is still problematic, but most people are oblivious to typography...

[girba]

Thanks for testing. Indeed, something is still wrong and we are looking at it.

About kerning: we did not get to it yet. We will though.

[syrel]

The first step is to investigate the properties of the used font (Source Sans Pro). For that we create an instance of Skia Font and check its info. Indeed, subpixel antialiasing is not enabled:

[syrel]

After enabling subpixel antialias the text appears too bold. This is due to enabled drawing cache which has transparent background:

After disabling drawing cache it looks better:

Pixel by pixel comparison with Firefox from Ubuntu 19.10:

[girba]

@stacksmith Can you confirm that you see an improvement?

[stacksmith]

Would love to check, but got stuck along the way trying to repeat your example. with GToolkit-64-20200222165509-9281c07.image

• Started with an error of some sort. Now it does not. Hmm.
• Playground is unusable and unstable,
• Initially barely usable (several seconds between keys registering). I almost gave up but it seems like some background task finished and it became more responsive. Or maybe something else happened.
• extremely sluggish sporadically With some syntax coloring issues, it becomes really slow and cursor keys and backspace stop working. I had to use the mouse to replace a space with a random character for the syntax colorer to let me type. I can't quite catch it, but several times,repeatedly typing fragments of SkiaCanvas in an unexpected place (a clause with errors or missing periods) locked me out of keys several times.
• Suggestions show, but tab or clicking does not complete. Could not figure out how to complete. The paned view is almost usable, but:
  • I really want to have more than two pages - maybe 10 or so (Our screens are wide and horizontalish). It would be nice if very small browsers automatically sized themselves narrower to allow more visible pages instead of default two.
• From the code pane, all attempts to inspect go to the same inspector. Looks like a bug as I can't imagine not being able to compare two objects.
• I finally figured out I can resize them but that's hardly better than dealing with 20 browsers in Pharo.
• Partially showing windows after a resize do not scroll into view on click, requiring manual scrolling with those little squares.
• I could not figure out how to rearrange horizontally arranged pages or delete them
• Trying SkiaCanvas browseI thought the system locked up. But I found that it tried to open Firefox and create a bookmark. Luckily my system did not allow such rudeness from a random executable. Please remove or at least ask the user if they want the rest of their system messed with.
• After that it locked up dead. Had to ps, grep, kill.
• Generally, I could not figure out how to look at the superclasses or browse in any meaningful way. Options provided are grossly inadequate for anything approximating coding (an opinion, of course - at least I could not force myself to do so without being paid a lot. Eh, even then probably not). Saw 'coder' later, could not figure out how to open it like a browser.
• Again, sluggish to the point of having to wait typing. Guh.

How do you activate subpixel antialiasing? Looking at SkiaFont shows that there is a check for it that calls out via FFI. I could not find anything that sets it.

[stacksmith]

I get that this is earlyish work, and don't mean to be an ass. Please consider my comments purely constructive. Being on the spectrum I miss subtleties of communication at least sometimes.

BTW, your screenshot is an improvement, but looking at your magnifications, I think something is misconfigured or the font is just not great - the color fringing is excessive and implies incorrect gamma or lack of filtering down.

There are many misemplementations of this issue, not just in Linux.

I am unable to add pictures for some reason... Ok, now I can. Hm.. If you zoom in, you will see that they are a lot blacker than yours. Wait, zooming in on my local PNG is very different from the one here! Is Github fucking with images? Mine is a lot blacker! It all needs to be burned down and built right. There is no hope for us.

Glamorous Toolkit - rendered natively for zooming in.

Anyway, native firefox text here looks hella better than your example, which appears a bit fuzzy and shows enough fringing to be a problem for all-day work. But now I don't trust the images here.

[girba]

Thanks for checking. You raised multiple points in various orders.

First, for general discussions and opinions of what is good and what is not, please use https://spectrum.chat/gtoolkit. It would be ideal to keep these issues focused on the specific issue we are trying to fix.

The messages from @syrel documented how we went about identifying and addressing the problem. We did not close this issue because we were waiting for your feedback. We closed another issue because it was a duplicate, namely #724.

To test whether there is an improvement, please use the latest release: v0.7.749 (GToolkit-64-20200227221049-145b818).

The comparison of the pixelated pictures is meaningful: We took a screenshot of a small text, zoomed in, and then took another screenshot of that so that we can compare the pixels better.

There is still an issue with the drawing cache and due to this, the text from the text editor might appear bolder. So, let's first try to evaluate whether the labels from the main screen appear better for you.

Some clarifications of the remarks that are not specific to the issue:

• The sluggishness is not supposed to happen, and it would be useful to track it down if you can reproduce it.
• Completion should work with both Enter and Tab. If it does not, it's a bug. I opened an issue for being able to manipulate completion with the mouse #833.
• Executing SkiaCanvas browse should not open Firefox and does not bookmark anything. However, it will try to open a System Browser in the Morphic World. If the Morphic World is not open, you will see no effect. This is code that comes with Pharo. There likely is a confusion somewhere.
• The pager interface is a tool for connected navigation based on a Miller columns design. It's not about bookmarking things and they are not rearrangeable. We do understand the need for comparison, but we did not yet design for that one.
• Please also keep in mind that for the time being we are targeting a laptop screen. While we do want to properly utilize larger screens, we think that is a separate problem and we will tackle it at a later time. That is why the design decisions, like showing only two panes, might not be ideal for larger screens at the moment.

[stacksmith]

I think the rendering is about identical. It looks a lot better than before. Now I've been staring at the screen from inches away and everything looks horrible.

Sorry about the digression - actually trying to do a 1-minute task proved really painful, and I don't think it's for me. It may work for someone who needs to see two things at a time and thinks a browser is too complicated - I need at least 8 to do anything useful.

[girba]

@stacksmith could you detail what do you mean by "everything looks horrible"?

About having multiple things open, please keep in mind that you can spawn a tab in a separate native window if you want. The miller columns are about capturing a single investigation flow. I'd be interested to look at your workflow if you have time. Would you like to open a conversation at https://spectrum.chat/gtoolkit?

[stacksmith]

Just that the state of glyph rendering and typography is not wonderful and staring at artifacts and bad kerning gets tiring when too much attention is paid to it. As for workflow, I totally appreciate that your presentations capture a linear flow, like a 'wizard' of old. Which isn't even good for what Microsoft used it, like 'let's troubleshoot your printer'. My issue is that most tasks I have to deal with are distinctly tree- or graph-like; even a total mess of browsers is better than hunting for the page you need after it scrolled of somewhere. Perhaps I just don't get it yet, and like emacs, it will all make sense. I am still waiting for emacs to make sense, actually. I will try to get to spectrum.chat sometime. Thank you.

[girba]

Thanks!

About typography, we still have a more specific open issue that blurs the text: #834. We will address it shortly. In the meantime, I will close this one. If you have further more specific details, please open new ones. It helps us a lot!

About the workflow, I do believe there is a mismatch in expectations. I would very much be interested to work through your perspective and see if there is a way to explain what we are doing in a way that makes sense for you. Perhaps as an input, there is a presentation on gtoolkit.com that might clarify some of it.

[stacksmith]

@girba, Thank you for addressing my original issue.

I am sorry for being a grouch and taking this off-topic. At least I uncovered a few bugs, albeit with a certain lack of grace.

I will admit ignorance of the scope of your project and the details of your approach, and appreciate your kindness in spite of my impatience. Before I bother you anymore, I will try to make some time to better understand GT. If I have anything to contribute I will contact you at spectrum.chat.

[girba]

Thank you for your patience, too!

After this message I would like to get in contact with you even more :).

Look. We are creating a new way of programming. We know it works because we use it and because we validated it in many situations (over about a decade). What we do not know is how to communicate and teach it. So, any interaction in that direction helps us tremendously.

[stacksmith]

Cool. I've written tons of code trying to create new interfaces. I would love to see more as obviously I am missing something as far as GT. I was very excited as it looked like it's in the right direction - but I got frustrated in practice. I really need to give it more of an effort - no learning curve can be much steeper than Emacs/Lisp... On the plus side - I love the unobtrusiveness and paper-like quality. But I still don't know how to manage with only two panes showing at a time.
Is there a video somewhere of an actual coding session - not just making a visualization from some data or plowing through a linear task?

[girba]

Ok.

Background first: we started our effort from reinventing how we can "read". We do that by means of creating custom tools. We always start from a hypothesis and then ask what tools we'd need for checking it. When the tool does not exist, we create one.

For example, we often replace many browsers with queries that we program. Here is an example from yesterday: #837.

In this very thread, we also had a case where we identified the problem by looking at an inspector through the lens of a simple custom view (Info): https://github.com/feenkcom/gtoolkit/issues/832#issuecomment-591535774.

Now, we do still need to write code, of course. The place for writing static code is in Coder. This is still a work in progress. I think we have a good start, but needs quite some work to deal with navigation and more refined presentation. This is the largest missing piece. Until we get these details in place, we rely on the fallback to the Morphic World.

However, we also think that we should write little code in a static browser. Instead, we often find ourselves writing code in the Inspector through the Meta view.

And another note: GT is built on a completely new graphical stack that offers the interesting property of one rendering tree and that enables new kinds of interfaces. Here is a writeup about it: https://medium.com/feenk/one-rendering-tree-918eae49bcff?source=friends_link&sk=c0551af8504ee919c4d8c54c390eef49

This is interesting because the tools we provide out of the box are just that: default tools. We think moldability is broader and we expect people to create other such tools: https://medium.com/feenk/moldability-starts-with-the-frame-ac9f3d837422?source=friends_link&sk=aec35b9b9aff8fd8c4b4ea5e08980448

[stacksmith]

I've come across some medium articles before, and your approach definitely interested me. I haven't had a chance to look at your examples, and hope they will answer some questions about how to keep the parts of the presentation that are important from scrolling off...