48 points

Why the fuck is a page about fonts using 50% CPU?! Is it mining crypto or something?

permalink
report
reply
50 points

Average website experience in 2023

permalink
report
parent
reply
39 points

That’s just modern web dev

permalink
report
parent
reply
8 points

I really hope Chrome gets its shit together and stabilizes the chrome.processes API during my lifetime so I or someone can make an extension that autokills or at least warns you about these shitty pages.

permalink
report
parent
reply
10 points

No no you see it’s the website owners that are the issue because they didn’t build the website specifically for chromium browsers /s

permalink
report
parent
reply
34 points

They’re pretty fonts and they’re released under SIL Open Font License 1.1. I dig it.

permalink
report
reply
21 points
*

I like all of it, except for that awful “texture healing”. Imagine having words above & below like

i=mins
w=maxs

But the m’s just slightly don’t line up because the top one is wider than the bottom one. I’d feel like my editor was gaslighting me 🤢

permalink
report
reply
14 points
*

Here’s your code example in the editor. I don’t personally think the difference between the 'm’s is super noticable. But what did strike me a lot more is the difference in height between the two 'i’s in the first line. I think that difference is pretty bad.

permalink
report
parent
reply
9 points

It looks like it’s not an actual height difference, but the smaller width makes the second i look significantly smaller than the first, also implying a lower height.

permalink
report
parent
reply
5 points
*

True, they are the exact same height. Holy optical illusion, Batman!

I suppose this is part of what makes font design so difficult.

permalink
report
parent
reply
3 points

Welp, another reason I will absolutely not be using glyph-streching or whatever Microsoft called it.

permalink
report
parent
reply
6 points
*

thanks for rendering that! and yeah that height difference is really weird. That almost seems like a bug.

Also Idk if the ='s make the m smaller or bigger.

If the streching is so small as to be unnoticable (and I agree it’s pretty subtle) then I also don’t really understand the benefit.

permalink
report
parent
reply
6 points

If the streching is so small as to be unnoticable (and I agree it’s pretty subtle) then I also don’t really understand the benefit.

Typically, the idea behind this sort of design is that it should be unnoticeable. The motivation is that, with other monospace fonts, the differences in character width, along with the inconsistent spacing and line thicknesses are both noticable and distracting. Some of this badness is avoidable, and this is what this font attempts.

and yeah that height difference is really weird. That almost seems like a bug.

I’ve been informed, (and had to double check because I didn’t believe it,) that the two "i"s are actually the exact same height. The first looking larger than the second is an optical illusion. Font design is hard.

permalink
report
parent
reply
3 points

They would still line up, wouldn’t they? Or am I misunderstanding how the texture healing would work… Would they not take the same total amount of space?

permalink
report
parent
reply
16 points

permalink
report
parent
reply
10 points
*

Each line is the same total length but the “m” in “mi” would be wider than the m in “ma”

permalink
report
parent
reply
19 points

That texture healing looks super nice. Is that something fonts can just do or does it require special editor support?

permalink
report
reply
22 points

It’s basically a different type of ligature - it is standard to OTF fonts, but requires ligature support in your editor/terminal. Just need to enable ligatures and/or enable specific ligature sets. See https://github.com/githubnext/monaspace#editors or maybe https://wezfurlong.org/wezterm/config/font-shaping.html for the general procedure in a supporting terminal.

permalink
report
parent
reply
1 point

Is there a way to disable it but keep ligatures?

permalink
report
parent
reply
2 points

From https://github.com/githubnext/monaspace#editors :

If you want coding ligatures but do not want texture healing, you can omit the calt setting:

permalink
report
parent
reply
19 points
*

Texture healing works by finding each pair of adjacent characters where one wants more space, and one has too much. Narrow characters are swapped for ones that cede some of their whitespace, and wider characters are swapped for ones that extend to the very edge of their box. This swapping is powered by an OpenType feature called “contextual alternates,” which is widely supported by both operating systems and browser engines.

Contextual alternates are normally used for certain scripts, like Arabic, where the shape of each glyph depends on the surrounding glyphs. And they are also used for cursive handwriting fonts where the stroke of the “pen” might have different connection points across letters. Texture healing is a novel application of this technology to code.

basically fonts were already capable of using alternate versions of characters based on their nearby characters, so they used that for these fonts to allow for seemingly-dynamic sizing/spacing

permalink
report
parent
reply
8 points

It’s an OpenType standard feature but the font rendering system has to support it and the app has to enable it. The page has a link to instructions for enabling it in VS Code but I have no idea about support status on different OS and desktop environments. I could see it working on webview on Android fwiw, I’m guessing it’s either well supported in general or at least by browsers.

permalink
report
parent
reply
6 points

Here is the comprehensive editor compatibility list for Fira Code. Should be the same.

permalink
report
parent
reply
2 points

It is well supported in all browsers and operating systems. At least VS Code and IntelliJ support it, and even some terminals.

permalink
report
parent
reply
17 points
*

And sadly one more font I will never be able to use due to missing support of non-latin characters.

Sadly some features are nice.

permalink
report
reply
8 points

You’d think after that page of “texture healing”, alignment, etc. etc., Microsoft would actually make a fully, complete font first and foremost…

permalink
report
parent
reply
1 point

And release zip contains a _MACOSX folder which is a clear indication of sloppiness and/or rushed release. … and ligatures don’t work out the box in JetBrains product IDEs.

And if only they slapped beta on this there will be not problem what so ever…

permalink
report
parent
reply
1 point

Rushed, that’s just how they roll lol

permalink
report
parent
reply
1 point

The ligatures don’t even work in visual studio. It made me look for a different font with ligatures, landed on fira code for now. But hyphenated ligatures just seen outright broken on VS and have been for a good amount of years. Think it’s time to change IDEs soon. Might try and get VS Code to act more like it’s counterpart at some point.

permalink
report
parent
reply

Programming

!programming@programming.dev

Create post

Welcome to the main community in programming.dev! Feel free to post anything relating to programming here!

Cross posting is strongly encouraged in the instance. If you feel your post or another person’s post makes sense in another community cross post into it.

Hope you enjoy the instance!

Rules

Rules

  • Follow the programming.dev instance rules
  • Keep content related to programming in some way
  • If you’re posting long videos try to add in some form of tldr for those who don’t want to watch videos

Wormhole

Follow the wormhole through a path of communities !webdev@programming.dev



Community stats

  • 3.5K

    Monthly active users

  • 1.7K

    Posts

  • 28K

    Comments