diff options
Diffstat (limited to 'blog/terminal_renderer_mkii/index.html')
| -rw-r--r-- | blog/terminal_renderer_mkii/index.html | 21 |
1 files changed, 13 insertions, 8 deletions
diff --git a/blog/terminal_renderer_mkii/index.html b/blog/terminal_renderer_mkii/index.html index 78171f1..3c94df4 100644 --- a/blog/terminal_renderer_mkii/index.html +++ b/blog/terminal_renderer_mkii/index.html @@ -3,7 +3,10 @@ <html> <head> - <title></title> + <title>Terminal Renderer Mk. II - Rendering to Text with Compute</title> + <meta name="og:title" content="Terminal Renderer Mk. II - Rendering to Text with Compute"/> + <meta name="og:description" content="This week I brought my terminal renderer to the next level by performing text rendering on the GPU."/> + <meta name="og:image" content="http://localhost:3000/blog/terminal_renderer_mkii/cover.png"/> <link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/blog/blog.css"> </head> @@ -17,14 +20,15 @@ <section> <div class="text-section"> <!-- Header Section --> - <h1>Terminal Renderer - Rendering to Text with Compute</h1> + <h1>Terminal Renderer Mk. II - Rendering to Text with Compute</h1> <p>October 2, 2025</p> <p>This week I brought my terminal renderer to the next level by performing text rendering on the GPU. </p> </div> <figure class="cover-image"> <img src="cover.png" alt=""> - <figcaption>The Stanford Dragon, outlined and rendered as Braille characters in a terminal emulator. + <figcaption>The Stanford Dragon, outlined and rendered as Braille characters in a terminal emulator. <a href="https://tv.soaos.dev/w/fBnDAUPsTPHaoPeNNxBGch" target="_blank"> +Full video</a> </figcaption> </figure> </section> @@ -117,7 +121,7 @@ <h2>The old way™</h2> <p> My first attempt at <i>realtime</i> terminal graphics with ordered dithering - (<a href="https://www.youtube.com/watch?v=tXP6sL9D0gY" target="_blank">I put a video up at the time</a>) + (<a href="https://tv.soaos.dev/w/dzHBnPJXtDBwtSvirgwTvY" target="_blank">I put a video up at the time</a>) ran entirely on the CPU. I pre-calculated the threshold map at the beginning of execution and ran each frame through a sequential function to dither it and convert it to Braille characters. @@ -133,7 +137,7 @@ add outlines to objects, I was able to significantly improve the visual fidelity of the experience. A good example of where the renderer was at until like a week ago can be seen in <a - href="https://www.youtube.com/watch?v=BNgteRpLAP0" target="_blank">this video</a>. + href="https://tv.soaos.dev/w/9Pf2tP3PYY5pJ3Cimhqs9x" target="_blank">this video</a>. </p> <p> Until now I hadn't really considered moving the text conversion to the GPU. I mean, <i>G</i>PU is for @@ -167,12 +171,13 @@ I used UTF-32 encoding on the storage buffer because I knew I could easily convert a "wide string" into UTF-8 before printing it, and 32 bits provides a consistent space to fill for each workgroup in the shader versus a variable-length - encoding like UTF-8. + encoding like UTF-8. <a href="https://tv.soaos.dev/w/fBnDAUPsTPHaoPeNNxBGch" target="_blank">Here's a video of the new renderer working</a>. Although now that I think about it, I could probably switch to using UTF-16 since all the Braille characters could be represented in 2 bytes, and that would be half the size of the UTF-32 text, which is half empty bytes anyways. </p> - <p>Okay so I went and did that, seems to work great. Wow. This little side quest has been a part of my + <p> + Okay so I went and tried that but remembered that shaders only accept 32-bit primitive types, so it doesn't matter anyways. This little side quest has been a part of my broader efforts to revive a project I spent a lot of time on. I'm taking the opportunity to really dig in and rework some of the stuff I'm not totally happy with. So there might be quite a few of this kind of post in the near future. Stay tuned. @@ -181,4 +186,4 @@ </article> </body> -</html>
\ No newline at end of file +</html> |