A Broken Heart

Mostly read like a normal article if you skip over the parts about using agents, which I did.

There could not possibly be a single thing in the world more boring than listening to someone describe using an AI agent. Might as well describe in arduous detail how you use a gas pump or a grocery store checkout.

Maybe off topic, but I couldn't help thinking that "we need to show a heart icon" -> "let's use a heart emoji because it's easy" -> "let's use a specific emoji font for consistency across platforms" -> "let's import it from Google Fonts every time" seems like a problematic developer mindset.

A better heuristic is always keep in mind not only developer efficiency, but also program efficiency. I'm not saying optimize everything, but keep program efficiency in mind at least a little bit. In this case, that would've led the developer to download a tiny SVG or PNG and serve it from the app itself. Which would've avoided the problem in the post, and maybe other problems as well.

> And despite being the least-bad approach for web frontends today, the React ecosystem...

As if anyone has seriously tried anything other than the "reactive UI hacked together with callbacks or proxies, with weird XML-like syntax in the JS code" paradigm for the last 10 years.

At this point I just have to conclude that anyone who believes this stuff is good is either too indoctrinated into this workflow or just lacks ability to do even the tiniest amount of cost/benefit analysis.

> Noto Color Emoji is a Google font that is helpful in that it gives you consistent emoji rendering across platforms.

I’m not sure how that is helpful if users are used to the emoji look of their respective platform.

> Naturally, I blamed React.

Did the author start a client-side debugging process without running any kind of diagnostics in the dev tools?

To me this sounds like "I saw some slowness in my application, so naturally I started adjusting indexes in my database." Without doing any upfront research, you're basically just throwing darts and hoping one sticks. This type of approach to debugging has never served me well.

> At that point, I reached for an age-old tool that has gotten more useful in the modern age: binary search. That is, you explain the symptom to your coding agent. Then you have it repeatedly remove stuff from your code that might be causing the problem

Can someone give me some high level pointers on how to setup this scaffolding?

Enjoyed this piece! I use binary search to investigate data pipeline issues. Didn’t think to use it to debug features with agents which was a very cool approach.

I think you could have discovered this bug more easily by looking at the commit(s) that were made when the problem started.

This is a legitimately fun piece about a bug (or extraordinary levels of inefficiency) in CoreSVG, manifested in massive computational loads to display a single SVG fallback for a colour-specified emoji.

But, isn't the heart emoji red anyways, across basically every font that has emojis? I mean, even with variations. I'm not sure what COLRv1 brings to that table for that scenario. Although maybe the special font is overkill if you really wanted to do something crazy with an emoji or text, and it seems to focus on gradients and the like.

Maybe this is why they humorously blame Claude for getting them to use that font and its affordances in the first place.

The conclusion of "yes, Claude helped fix this, but it also caused it by recommending an emoji font" seems a bit disingenuous to me. Using an emoji font is a good suggestion, it's not like Claude (or anyone) could have known there's an SVG but that will cause this slowness.

[flagged]

... and a broken world.

How infuriating it is to see complexity so spuriously piled up upon an already holy mess.