I refactored the rendering code so that it doesn’t break styled content.

---

I realized earlier today that there was absolutely zero reason for me to use a grid data structure in the rendering logic. The rendering pipeline went something like this:

1. input a bunch of lines
2. create a blank 2D grid of characters, one for each character in the terminal
3. iterate over every single cell in that grid and set it to the relevant character from the input lines
4. join all the columns in each row of the grid together into one line each
5. join all lines together into one big string
6. output the string for rendering

Using an extra intermediate dimension of data storage didn’t actually do anything except use way more memory and make it very difficult to use non-ASCII characters.

So I redesigned it and the new rendering pipeline works more like this:

1. input a bunch of lines
2. create a slice of blank lines, one for each row in the terminal
3. trim the relevant input line and insert it into the slice
4. join all the lines together into one big string
5. output the string for rendering

This way is much simpler, and also much more memory efficient i think.

---

Plus, the new pipleine lets me used styled text. Before, when I tried out Lipgloss’s Border feature on the help page, the border was composed entirely of â characters. Idk why. I think it because each grid cell only used the first byte and didn’t consider the invisible ANSI characters. But the new one slices it safely using Charm’s ansi package, so it’s safe to use styled lines.

I used the new pipeline to make the help page more colorful and aesthetic. I made each character of the “deci” ASCII art be a different color to distinguish them, because a friend pointed out that the c and the i are really close together so it kinda looks like it says “ded”.

Soon, I should be able to add markdown previewing. It shouldn’t even be that much work (famous last words).