<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
    <title>printfdebugging - Text Editor</title>
    <subtitle>Sahil Gautam&#x27;s Blog</subtitle>
    <link rel="self" type="application/atom+xml" href="https://printfdebugging.in/TextEditor/atom.xml"/>
    <link rel="alternate" type="text/html" href="https://printfdebugging.in/TextEditor/"/>
    <generator uri="https://www.getzola.org/">Zola</generator>
    <updated>2026-08-01T00:00:00+00:00</updated>
    <id>https://printfdebugging.in/TextEditor/atom.xml</id>
    <entry xml:lang="en">
        <title>Unicode - A character is not a char!</title>
        <published>2026-08-01T00:00:00+00:00</published>
        <updated>2026-08-01T00:00:00+00:00</updated>
        
        <author>
          <name>
            
              Unknown
            
          </name>
        </author>
        
        <link rel="alternate" type="text/html" href="https://printfdebugging.in/TextEditor/0003-unicode/"/>
        <id>https://printfdebugging.in/TextEditor/0003-unicode/</id>
        
        <content type="html" xml:base="https://printfdebugging.in/TextEditor/0003-unicode/">&lt;h1 id=&quot;unicode&quot;&gt;Unicode&lt;&#x2F;h1&gt;
&lt;h2 id=&quot;a-character-is-not-a-char&quot;&gt;A character is not a char...&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;... unless you just write english.&lt;&#x2F;li&gt;
&lt;li&gt;ASCII covers all the &lt;strong&gt;latin english&lt;&#x2F;strong&gt; characters and that at most takes 1 byte (7 bits to be precise).&lt;&#x2F;li&gt;
&lt;li&gt;If we also include the 8th bit, then we can represent another 127 characters.&lt;&#x2F;li&gt;
&lt;li&gt;We &lt;em&gt;can&#x27;t represent all the characters from all the languages using one byte&lt;&#x2F;em&gt;.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h2 id=&quot;codepoint&quot;&gt;Codepoint&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;We can use an integer instead, it has 32 bits (4 bytes).&lt;&#x2F;li&gt;
&lt;li&gt;With that, we can assign a unique number to each character from all the languages and still have plenty left.&lt;&#x2F;li&gt;
&lt;li&gt;This integer is called a unicode &lt;code&gt;codepoint&lt;&#x2F;code&gt;, &lt;em&gt;a unique number used to identify a character&lt;&#x2F;em&gt;.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h2 id=&quot;unicode-transformation-format-8-utf-8&quot;&gt;Unicode Transformation Format 8 (UTF-8)&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;We can write these codepoints to a file and we are done! Hold on..&lt;&#x2F;li&gt;
&lt;li&gt;ASCII characters only need 1 byte, using 4 bytes for that would mean 3 wasted bytes&lt;&#x2F;li&gt;
&lt;li&gt;Because of these LLMs, ssd prices have trippled, storage isn&#x27;t cheap anymore!&lt;&#x2F;li&gt;
&lt;li&gt;So we can&#x27;t write the characters as 4 byte sequences to the file, what should we do then?&lt;&#x2F;li&gt;
&lt;li&gt;Codepoints are just &lt;em&gt;positive integers&lt;&#x2F;em&gt;.&lt;&#x2F;li&gt;
&lt;li&gt;All the codepoints from 0 to 127 can be represented by 1 byte, 8th bit is used to flag a 1 byte long codepoint.&lt;&#x2F;li&gt;
&lt;li&gt;Similarly all the codepoints can be encoded with varying number of bytes &amp;amp; we can use some  bits to say how many.&lt;&#x2F;li&gt;
&lt;li&gt;There are other UTF encoding schemes (UTF-16, UTF-32) which use 2 &amp;amp; 4 bytes at least to represent a codepoint resp.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;&#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; source: https:&#x2F;&#x2F;www.unicode.org&#x2F;versions&#x2F;Unicode17.0.0&#x2F;core-spec&#x2F;chapter-3&#x2F;#G27506 &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;        1&lt;&#x2F;span&gt;&lt;span&gt; byte                &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;2&lt;&#x2F;span&gt;&lt;span&gt; bytes                      &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;3&lt;&#x2F;span&gt;&lt;span&gt; bytes                             &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;4&lt;&#x2F;span&gt;&lt;span&gt; bytes&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;lt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;    U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span&gt; .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;07&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;F&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                          U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;0080&lt;&#x2F;span&gt;&lt;span&gt; .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt;07FF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;0800&lt;&#x2F;span&gt;&lt;span&gt; .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt;0FFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;1000&lt;&#x2F;span&gt;&lt;span&gt; .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;CFFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;D000 .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;D7FF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;E000 .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;FFFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;10000&lt;&#x2F;span&gt;&lt;span&gt;  .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt;3FFFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;40000&lt;&#x2F;span&gt;&lt;span&gt;  .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span&gt;FFFFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;                                                                                         U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;100000&lt;&#x2F;span&gt;&lt;span&gt; .. U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt;10FFFF&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;&lt;h2 id=&quot;utf-8-encoding-decoding&quot;&gt;UTF-8 Encoding&#x2F;Decoding&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;This &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;www.rfc-editor.org&#x2F;info&#x2F;rfc3629&quot;&gt;RFC document&lt;&#x2F;a&gt; shows how codepoints are encoded with UTF-8.&lt;&#x2F;li&gt;
&lt;li&gt;Notice how the first few bits on each encoded byte are marked.&lt;&#x2F;li&gt;
&lt;li&gt;If the first byte of the sequence starts with &lt;code&gt;0&lt;&#x2F;code&gt;, we can read the next 7 bits to find the codepoint&lt;&#x2F;li&gt;
&lt;li&gt;If it&#x27;s marked with &lt;code&gt;110&lt;&#x2F;code&gt;, &lt;code&gt;1110&lt;&#x2F;code&gt; or &lt;code&gt;11110&lt;&#x2F;code&gt;, we need to read the next 1,2,3 bytes resp to decode the codepoint.&lt;&#x2F;li&gt;
&lt;li&gt;Once we read all the bytes, we can put those &lt;code&gt;x&lt;&#x2F;code&gt; bits into an integer from left to right.&lt;&#x2F;li&gt;
&lt;li&gt;The resulting number (max 21 bits) would be our codepoint.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;&#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; source: https:&#x2F;&#x2F;www.rfc-editor.org&#x2F;info&#x2F;rfc3629&#x2F;#ref-UNICODE &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;Char. number range  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span&gt;        UTF&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;8&lt;&#x2F;span&gt;&lt;span&gt; octet sequence&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;   (&lt;&#x2F;span&gt;&lt;span&gt;hexadecimal&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    |&lt;&#x2F;span&gt;&lt;span&gt;              (&lt;&#x2F;span&gt;&lt;span&gt;binary&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; 0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; 0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;07&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;F&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; |&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 0xxxxxxx&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt; 0080&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 07FF&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; |&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 110xxxxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt; 0800&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span&gt; FFFF &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 1110xxxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;001&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; 0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;010&lt;&#x2F;span&gt;&lt;span&gt; FFFF &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 11110xxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#FFFFFF, #FFFFFF);&quot;&gt; 10xxxxxx&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;Encoding is quite simple, we repeat the decoding steps in reverse&lt;&#x2F;li&gt;
&lt;li&gt;Use the codepoint to find out how many bytes it will take to encode it, see the numberline above.&lt;&#x2F;li&gt;
&lt;li&gt;Then starting from left to right, start filling in those &lt;code&gt;x&lt;&#x2F;code&gt;s, see the table in the decoding section.&lt;&#x2F;li&gt;
&lt;li&gt;See the example below... you can read it in reverse for decoding.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;character  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;&amp;#39;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;世&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;&amp;#39;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;codepoint  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span&gt; U&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;+&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;E&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;16&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;encodedLen &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span&gt; bytes&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; &#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; U+0800 &amp;lt;= 0x4E16 &amp;lt;= U+FFFF &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;binary  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; &amp;#39;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;0b100111000010110&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;&amp;#39;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;binary  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; &amp;#39;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;     100        111000        010110&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;&amp;#39;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;pattern &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt; 1110&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span&gt;xxxx     &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span&gt;xxxxxx     &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span&gt;xxxxxx&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;encoded &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt; 1110&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;100&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;     10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;111000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;     10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;|&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;0&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;10110&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;--&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span&gt;UTF&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;   =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;  11100100&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;      10111000&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#D19A66, #D19A66);&quot;&gt;      10010110&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;&lt;h1 id=&quot;unicode-library&quot;&gt;Unicode Library&lt;&#x2F;h1&gt;
&lt;ul&gt;
&lt;li&gt;I wrote a simple library for UTF-8 encoding&#x2F;decoding, it lives on github, at &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;unicode&quot;&gt;printfdebugging&#x2F;unicode&lt;&#x2F;a&gt;.&lt;&#x2F;li&gt;
&lt;li&gt;It has a ton of tests for encoding-decoding roundtrip integrity testing &amp;amp; for checking invalid byte sequences.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
</content>
        
    </entry>
    <entry xml:lang="en">
        <title>Build System Migration - Meson + Autotools + CMake = PkgConfig!</title>
        <published>2026-07-01T00:00:00+00:00</published>
        <updated>2026-07-01T00:00:00+00:00</updated>
        
        <author>
          <name>
            
              Unknown
            
          </name>
        </author>
        
        <link rel="alternate" type="text/html" href="https://printfdebugging.in/TextEditor/0002-build-system-migration/"/>
        <id>https://printfdebugging.in/TextEditor/0002-build-system-migration/</id>
        
        <content type="html" xml:base="https://printfdebugging.in/TextEditor/0002-build-system-migration/">&lt;h1 id=&quot;the-problem&quot;&gt;The Problem&lt;&#x2F;h1&gt;
&lt;ul&gt;
&lt;li&gt;What happens when you use one build system and try to use libraries with another build system?
&lt;ul&gt;
&lt;li&gt;CMake can&#x27;t include Meson projects&lt;&#x2F;li&gt;
&lt;li&gt;Meson can&#x27;t include Autotools projects&lt;&#x2F;li&gt;
&lt;li&gt;Autotools + Make doesn&#x27;t generate a &lt;code&gt;compile_commands.json&lt;&#x2F;code&gt; file&lt;&#x2F;li&gt;
&lt;li&gt;Custom scripts in build system specific scripting languages get ugly quite quickly&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h1 id=&quot;potential-ways-to-fix-it&quot;&gt;Potential Ways to Fix it&lt;&#x2F;h1&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;The Better One of the Bunch - &lt;strong&gt;Meson&lt;&#x2F;strong&gt;!&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;It &lt;em&gt;can integrate&lt;&#x2F;em&gt; CMake projects&lt;&#x2F;li&gt;
&lt;li&gt;It &lt;em&gt;can build&lt;&#x2F;em&gt; Autotools projects as one would do manually with some custom scripting (haven&#x27;t tried it myself).&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;
&lt;p&gt;How build systems talk to each other&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;There&#x27;s no standard way to do it at build time&lt;&#x2F;li&gt;
&lt;li&gt;Each build system supports &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;www.freedesktop.org&#x2F;wiki&#x2F;Software&#x2F;pkg-config&#x2F;&quot;&gt;pkgconfig&lt;&#x2F;a&gt;, so the installed artifacts can be consumed through that interface.&lt;&#x2F;li&gt;
&lt;li&gt;It is build system agnostic, so as long as a &lt;code&gt;.pc&lt;&#x2F;code&gt; file is generated, we can consume that project.&lt;&#x2F;li&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;CollaboraOnline&#x2F;online.mirror&#x2F;tree&#x2F;main&#x2F;engine&quot;&gt;CollaboraOffice&lt;&#x2F;a&gt; uses this approach to consume external libraries (with some Make metaprogramming)&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h1 id=&quot;the-migration-process&quot;&gt;The Migration Process&lt;&#x2F;h1&gt;
&lt;h2 id=&quot;data-code-separation&quot;&gt;Data &amp;amp; Code Separation&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;Architectural overview
&lt;ul&gt;
&lt;li&gt;The configure &amp;amp; build commands are pretty standard for any build system&lt;&#x2F;li&gt;
&lt;li&gt;The only thing which changes is the configure options. We separated them from the build commands.&lt;&#x2F;li&gt;
&lt;li&gt;For each exteral project &lt;em&gt;foo&lt;&#x2F;em&gt;, there are 4 config files, &lt;code&gt;config&#x2F;external&#x2F;foo&#x2F;flags.{common,linux,apple,windows}&lt;&#x2F;code&gt;&lt;&#x2F;li&gt;
&lt;li&gt;These contain the configure flags for the specific build system.&lt;&#x2F;li&gt;
&lt;li&gt;We then have a &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;blob&#x2F;main&#x2F;scripts&#x2F;make&#x2F;exports.mk&quot;&gt;&lt;code&gt;scripts&#x2F;make&#x2F;exports.mk&lt;&#x2F;code&gt;&lt;&#x2F;a&gt; script which looks like this...&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;make&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;#&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; scripts&#x2F;make&#x2F;exports.mk&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;EXTERNALS&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; realpath .&#x2F;external&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;EXTERNALS_CONFIG&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; realpath .&#x2F;config&#x2F;external&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;INSTALL_DIRECTORY&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; realpath .&#x2F;install&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;BUILD_DIRECTORY&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; realpath .&#x2F;build&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;CLANGD_CONFIG&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; realpath .&#x2F;.clangd&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;PLATFORM&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;shell&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; uname -s&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;MESON_BUILD_TYPE&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; debug&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;CMAKE_BUILD_TYPE&lt;&#x2F;span&gt;&lt;span&gt; =&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; Debug&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;SHELL&lt;&#x2F;span&gt;&lt;span&gt; :=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; &#x2F;bin&#x2F;bash&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;12&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;ifeq&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;PLATFORM&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;Linux)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;13&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	PLATFORM_CONFIG_EXTENSION = linu&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;x&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;14&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;else ifeq&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;PLATFORM&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;Darwin)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;15&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	PLATFORM_CONFIG_EXTENSION = appl&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;e&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;16&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;else ifeq&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;PLATFORM&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;MINGW64*)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;17&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	PLATFORM_CONFIG_EXTENSION = window&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;s&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;18&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;else&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;19&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	PLATFORM_CONFIG_EXTENSION = unknow&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;n&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;20&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;endif&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;About exports.mk&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;Here we define some paths and some variables which would be used in the build scripts&lt;&#x2F;li&gt;
&lt;li&gt;Platform detection sets the flags file extension which we need to include other than &lt;code&gt;flags.common&lt;&#x2F;code&gt;&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;
&lt;p&gt;Make metaprogramming&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;The metaprograms define build wrappers in &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;blob&#x2F;main&#x2F;scripts&#x2F;make&#x2F;build_wrappers.mk&quot;&gt;&lt;code&gt;scripts&#x2F;make&#x2F;build_wrappers.mk&lt;&#x2F;code&gt;&lt;&#x2F;a&gt; and eval call them from &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;blob&#x2F;main&#x2F;Makefile&quot;&gt;&lt;code&gt;Makefile&lt;&#x2F;code&gt;&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;li&gt;There&#x27;s one for Meson, Autotools and CMake&lt;&#x2F;li&gt;
&lt;li&gt;For a project &lt;code&gt;foo&lt;&#x2F;code&gt;, we generate &lt;code&gt;foo&lt;&#x2F;code&gt;, &lt;code&gt;foo.configure&lt;&#x2F;code&gt;, &lt;code&gt;foo.build&lt;&#x2F;code&gt;, &lt;code&gt;foo.clangd&lt;&#x2F;code&gt;, &lt;code&gt;foo.install&lt;&#x2F;code&gt; and &lt;code&gt;foo.clean&lt;&#x2F;code&gt;&lt;&#x2F;li&gt;
&lt;li&gt;We get the common and platform specific configure flags from the flag files in &lt;code&gt;config&#x2F;external&#x2F;foo&lt;&#x2F;code&gt;&lt;&#x2F;li&gt;
&lt;li&gt;Target &lt;code&gt;foo&lt;&#x2F;code&gt; depends on all those &lt;code&gt;foo&lt;&#x2F;code&gt; prefixed targets&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;make&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;#&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; scripts&#x2F;make&#x2F;build_wrappers.mk&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;define&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; build_wrapper_cmake&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;_CONFIGURE_FLAGS=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(shell cat &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(EXTERNALS_CONFIG)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&#x2F;{flags.common,flags.&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(PLATFORM_CONFIG_EXTENSION)} | xargs)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;: &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.configure &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.build &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.install &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.clangd&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.configure:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	cmake \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		-DCMAKE_BUILD_TYPE=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(CMAKE_BUILD_TYPE) \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		-DCMAKE_INSTALL_PREFIX=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(INSTALL_DIRECTORY) \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		-DCMAKE_EXPORT_COMPILE_COMMANDS=ON \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;12&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;_CONFIGURE_FLAGS) \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;13&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		-B &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(BUILD_DIRECTORY)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;14&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		-S &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(EXTERNALS)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;15&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;16&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.build:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;17&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	cmake --build &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(BUILD_DIRECTORY)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;18&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;19&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.clangd:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;20&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(call clangd_config_string,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(BUILD_DIRECTORY)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;21&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;22&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.install:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;23&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	cmake --install &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(BUILD_DIRECTORY)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot; --prefix &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(INSTALL_DIRECTORY)&amp;quot;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;24&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;25&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.clean:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;26&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	rm -rf &amp;quot;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;$$&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;(BUILD_DIRECTORY)&#x2F;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;27&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;endef&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;28&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;...&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;make&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;#&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; Makefile&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_meson&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;fontconfig&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_cmake&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;cglm&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_cmake&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;freetype&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_meson&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;harfbuzz&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_cmake&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;glfw&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_cmake&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;glad&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;eval&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; build_wrapper_autotools&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;ffmpeg&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;&lt;h2 id=&quot;a-note-on-clangd-integration&quot;&gt;A Note on Clangd integration&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Clangd &amp;amp; CompDB&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;By default, it looks for &lt;code&gt;compile_commands.json&lt;&#x2F;code&gt; file in the project root and the &lt;code&gt;build&#x2F;&lt;&#x2F;code&gt; directory&lt;&#x2F;li&gt;
&lt;li&gt;External projects generate the compdb in their respective build directories&lt;&#x2F;li&gt;
&lt;li&gt;Compdb file generated with Meson + Ninja has relative paths, so it&#x27;s good only if read from the build directory&lt;&#x2F;li&gt;
&lt;li&gt;So we can&#x27;t merge multiple compdb files into one, that would unnecessarily complicate things&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;
&lt;p&gt;One way is to use an &lt;em&gt;external tool&lt;&#x2F;em&gt; like &lt;code&gt;bear&lt;&#x2F;code&gt; to wrap all the build commands &amp;amp; append their compdb files&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;This is actually not that impractical since we have to do that for Autotools projects anyways&lt;&#x2F;li&gt;
&lt;li&gt;Also bear is available on all major desktop platforms.&lt;&#x2F;li&gt;
&lt;li&gt;I did this &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;blob&#x2F;7b284ff04521e546df86bddb2b8065a1c5ee6f23&#x2F;scripts&#x2F;externals.sh&quot;&gt;successfully&lt;&#x2F;a&gt; some time ago in bash. I had to create a &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;blob&#x2F;7b284ff04521e546df86bddb2b8065a1c5ee6f23&#x2F;bear.yml&quot;&gt;config file&lt;&#x2F;a&gt; for bear.&lt;&#x2F;li&gt;
&lt;li&gt;If this works for you, it&#x27;s not a bad solution. But since I had to redo it, I was looking for something better&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;
&lt;p&gt;Clangd configuration&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;We can set &lt;code&gt;CompileFlags.CompilationDatabase&lt;&#x2F;code&gt; in &lt;code&gt;.clangd&lt;&#x2F;code&gt; to tell clang where to look for the compdb file&lt;&#x2F;li&gt;
&lt;li&gt;But this is only for a single compdb file, we have many of them in different build directories&lt;&#x2F;li&gt;
&lt;li&gt;We can use pattern matching and conditionally change the &lt;code&gt;CompilationDatabase&lt;&#x2F;code&gt; path
&lt;ul&gt;
&lt;li&gt;This was suggested by &lt;a href=&quot;https:&#x2F;&#x2F;printfdebugging.in&#x2F;TextEditor&#x2F;0002-build-system-migration&#x2F;@_oftc_Arsen:matrix.org&quot;&gt;Arsen&lt;&#x2F;a&gt; on the &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;matrix.to&#x2F;#&#x2F;#mesonbuild:matrix.org&quot;&gt;mesonbuild matrix channel&lt;&#x2F;a&gt;, thanks!&lt;&#x2F;li&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;clangd.llvm.org&#x2F;config#compilationdatabase&quot;&gt;Configuration - CompilationDatabase&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;clangd.llvm.org&#x2F;config#if&quot;&gt;Configuration - If&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;docs.managarm.org&#x2F;handbook&#x2F;contributing&#x2F;lsp.html#note-on-multi-build-sources&quot;&gt;LSP setup - Managarm Handbook&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;This solution is elegant and we can integrate this with some metaprogramming&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;make&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;#&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; scripts&#x2F;make&#x2F;build_wrappers.mk&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;define&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; clangd_config_string&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	@touch &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;CLANGD_CONFIG&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;	@if ! grep -q &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; $(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;CLANGD_CONFIG&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;; then \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		{ echo &amp;quot;---&amp;quot;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		  echo &amp;quot;If:&amp;quot;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		  echo &amp;quot;  PathMatch: .*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;.*&amp;quot;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		  echo &amp;quot;CompileFlags:&amp;quot;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		  echo &amp;quot;  CompilationDatabase: &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;&amp;quot;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;		} | tee -a &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;CLANGD_CONFIG&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;; \&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;endef&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;12&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;13&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;#&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; Makefile&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;14&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;clangd&lt;&#x2F;span&gt;&lt;span&gt;:&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;15&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;	$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; clangd_config_string&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;engine&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;BUILD_DIRECTORY&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;16&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;	$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;call&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; clangd_config_string&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;projects&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;$(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;BUILD_DIRECTORY&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt;)&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;Clangd config generation
&lt;ul&gt;
&lt;li&gt;We grep from &lt;code&gt;.clangd&lt;&#x2F;code&gt; to avoid duplication&lt;&#x2F;li&gt;
&lt;li&gt;For each external library &lt;em&gt;foo&lt;&#x2F;em&gt; we generate &lt;code&gt;foo.clangd&lt;&#x2F;code&gt; where we call this metaprogram&lt;&#x2F;li&gt;
&lt;li&gt;This works!&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h1 id=&quot;advantages&quot;&gt;Advantages&lt;&#x2F;h1&gt;
&lt;ul&gt;
&lt;li&gt;Officially supported build systems are always better
&lt;ul&gt;
&lt;li&gt;Harfbuzz had some &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;harfbuzz&#x2F;harfbuzz&#x2F;issues&#x2F;5683#issuecomment-3748839366&quot;&gt;issues&lt;&#x2F;a&gt; linking static libraries built with CMake. With Meson, it links just fine.&lt;&#x2F;li&gt;
&lt;li&gt;I don&#x27;t like to use LLMs, and manually writing&#x2F;maintaining build scripts is just not practical&lt;&#x2F;li&gt;
&lt;li&gt;Bash&#x2F;Make is easy to debug&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;hr &#x2F;&gt;
&lt;ul&gt;
&lt;li&gt;Github PRs
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;pull&#x2F;5&quot;&gt;build system migration by printfdebugging · Pull Request #5 · printfdebugging&#x2F;graphics&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;li&gt;&lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;github.com&#x2F;printfdebugging&#x2F;graphics&#x2F;pull&#x2F;6&quot;&gt;compilation database fixes by printfdebugging · Pull Request #6 · printfdebugging&#x2F;graphics&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
</content>
        
    </entry>
    <entry xml:lang="en">
        <title>Overview - Build System and the Project Arcitecture</title>
        <published>2026-06-25T00:00:00+00:00</published>
        <updated>2026-06-25T00:00:00+00:00</updated>
        
        <author>
          <name>
            
              Unknown
            
          </name>
        </author>
        
        <link rel="alternate" type="text/html" href="https://printfdebugging.in/TextEditor/0001-arcitecture/"/>
        <id>https://printfdebugging.in/TextEditor/0001-arcitecture/</id>
        
        <content type="html" xml:base="https://printfdebugging.in/TextEditor/0001-arcitecture/">&lt;h1 id=&quot;the-build-system&quot;&gt;The Build System&lt;&#x2F;h1&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;This project is written in &lt;strong&gt;C&lt;&#x2F;strong&gt;.&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;I choose C because it&#x27;s simple, and you want that when you are trying to do complex things.&lt;&#x2F;li&gt;
&lt;li&gt;The last thing you want is the language coming in your way.&lt;&#x2F;li&gt;
&lt;li&gt;Most of the graphics&#x2F;font libraries are also written in C, so integration becomes easy.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;li&gt;
&lt;p&gt;The build system is &lt;strong&gt;CMake&lt;&#x2F;strong&gt;&lt;&#x2F;p&gt;
&lt;ul&gt;
&lt;li&gt;It &quot;just works&quot; on all the platforms, including Windows&lt;&#x2F;li&gt;
&lt;li&gt;It has really good &lt;a rel=&quot;external&quot; href=&quot;https:&#x2F;&#x2F;marketplace.visualstudio.com&#x2F;items?itemName=ms-vscode.cmake-tools&quot;&gt;IDE support&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h1 id=&quot;project-arcitecture&quot;&gt;Project Arcitecture&lt;&#x2F;h1&gt;
&lt;h2 id=&quot;project-structure&quot;&gt;Project Structure&lt;&#x2F;h2&gt;
&lt;ul&gt;
&lt;li&gt;The Engine
&lt;ul&gt;
&lt;li&gt;The core functionality (like text rendering, windowing, shader code) is implemented in engine.&lt;&#x2F;li&gt;
&lt;li&gt;The external libraries live in the &lt;code&gt;external&lt;&#x2F;code&gt; directory.&lt;&#x2F;li&gt;
&lt;li&gt;The engine does not store any client state, all these modules are just code bundles with a type and a flat API.&lt;&#x2F;li&gt;
&lt;li&gt;The engine code is neither too generic nor too project specific, that&#x27;s tricky to pull.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;shellscript&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;graphics&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; CMakeLists.txt&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; engine&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; assets&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; CMakeLists.txt&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; engine.pc.in&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; include&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; └──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; source&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; external&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; freetype&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; harfbuzz&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;│  &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; └──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; ⋅⋅⋅&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;└──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; projects&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;    ├──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; editor&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;    └──&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#98C379, #98C379);&quot;&gt; game&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;The projects build on top of the engine and contribute back the improvements
&lt;ul&gt;
&lt;li&gt;The text rendering code in the engine implemented by the editor can later be used in a widget toolkit (let&#x27;s say).&lt;&#x2F;li&gt;
&lt;li&gt;The projects manage their own state.&lt;&#x2F;li&gt;
&lt;li&gt;Some engine subsystems (like windowing) handle user events in callbacks.&lt;&#x2F;li&gt;
&lt;li&gt;Those callbacks are bridged to the client code using a &lt;code&gt;struct bridge&lt;&#x2F;code&gt; instance.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;h2 id=&quot;the-bridge-interface&quot;&gt;The Bridge Interface&lt;&#x2F;h2&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;struct&lt;&#x2F;span&gt;&lt;span&gt; bridge &lt;&#x2F;span&gt;&lt;span&gt;{&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    void&lt;&#x2F;span&gt;&lt;span&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;mouse_move&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; *&lt;&#x2F;span&gt;&lt;span&gt;userdata&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; struct&lt;&#x2F;span&gt;&lt;span&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; f64 x&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; f64 y&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    void&lt;&#x2F;span&gt;&lt;span&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;mouse_scroll&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; *&lt;&#x2F;span&gt;&lt;span&gt;userdata&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; struct&lt;&#x2F;span&gt;&lt;span&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; f64 x&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; f64 y&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    void&lt;&#x2F;span&gt;&lt;span&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;window_resize&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; *&lt;&#x2F;span&gt;&lt;span&gt;userdata&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; struct&lt;&#x2F;span&gt;&lt;span&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; i32 w&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; i32 h&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span&gt;    ...&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;struct&lt;&#x2F;span&gt;&lt;span&gt; editor_state &lt;&#x2F;span&gt;&lt;span&gt;{&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    struct&lt;&#x2F;span&gt;&lt;span&gt; bridge bridge&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    struct&lt;&#x2F;span&gt;&lt;span&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;window&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    struct&lt;&#x2F;span&gt;&lt;span&gt; font &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;font&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;12&lt;&#x2F;span&gt;&lt;span&gt;    .....&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;13&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;The state type and the bridge interface
&lt;ul&gt;
&lt;li&gt;The engine defines &lt;code&gt;struct bridge&lt;&#x2F;code&gt;, so that&#x27;s the common known between the engine and the editor&lt;&#x2F;li&gt;
&lt;li&gt;The editor defines a &lt;code&gt;struct editor_state&lt;&#x2F;code&gt; type with a &lt;code&gt;struct bridge&lt;&#x2F;code&gt; as the first member.&lt;&#x2F;li&gt;
&lt;li&gt;Then we pass the bridge to the engine subsystems when initializing them. They store a pointer to it internally.&lt;&#x2F;li&gt;
&lt;li&gt;Note that this pointer to bridge is also the pointer to our editor state, since it&#x27;s the first member there.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;&#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; projects&#x2F;editor&#x2F;source&#x2F;editor.c &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span&gt;editor&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span&gt;bridge &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;struct&lt;&#x2F;span&gt;&lt;span&gt; bridge&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt; {&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span&gt;    .mouse_move &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; mouse_move&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span&gt;    .mouse_scroll &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; mouse_scroll&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span&gt;    .window_resize &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; window_resize&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;struct&lt;&#x2F;span&gt;&lt;span&gt; window window_options &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; {&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span&gt;    WINDOW_DEFAULTS&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span&gt;    .bridge &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; &amp;amp;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;editor&lt;&#x2F;span&gt;&lt;span&gt;-&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;bridge&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;12&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;13&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;if&lt;&#x2F;span&gt;&lt;span&gt; (&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#56B6C2, #56B6C2);&quot;&gt;!&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span&gt;rc &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt; window_init&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;editor&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;-&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; window_options&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt; {&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;14&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    goto&lt;&#x2F;span&gt;&lt;span&gt; cleanup&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;15&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;The bridge in action
&lt;ul&gt;
&lt;li&gt;The windowing subsystem then calls the appropriate callback and passes this bridge pointer to those callbacks.&lt;&#x2F;li&gt;
&lt;li&gt;In those callbacks on the editor side, we cast these bridge pointers to &lt;code&gt;struct editor_state *&lt;&#x2F;code&gt;.&lt;&#x2F;li&gt;
&lt;li&gt;And there we go! The engine doesn&#x27;t know of the &lt;code&gt;editor_state&lt;&#x2F;code&gt; and we got the events out nice and tidy.&lt;&#x2F;li&gt;
&lt;li&gt;We can reuse this in other projects without modifying the engine, or without making them &quot;editor like&quot;.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;pre class=&quot;giallo&quot; style=&quot;color-scheme: light dark; color: light-dark(#ABB2BF, #ABB2BF); background-color: light-dark(#282C34, #282C34);&quot;&gt;&lt;code data-lang=&quot;c&quot;&gt;&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 1&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;&#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; engine&#x2F;window.c &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 2&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;static&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt; __window_mouse_scroll_callback&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;GLFWwindow &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; f64 &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;x&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; f64 &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;y&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt; {&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 3&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    struct&lt;&#x2F;span&gt;&lt;span&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;_window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt; glfwGetWindowUserPointer&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span&gt;window&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 4&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;    _window&lt;&#x2F;span&gt;&lt;span&gt;-&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;bridge&lt;&#x2F;span&gt;&lt;span&gt;-&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt;mouse_scroll&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E5C07B, #E5C07B);&quot;&gt;_window&lt;&#x2F;span&gt;&lt;span&gt;-&amp;gt;&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt;bridge&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; _window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; x&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span&gt; y&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 5&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 6&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 7&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;&#x2F;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt; projects&#x2F;editor&#x2F;source&#x2F;editor.c &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#7F848E, #7F848E);font-style: italic;&quot;&gt;*&#x2F;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 8&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#61AFEF, #61AFEF);&quot;&gt; mouse_scroll&lt;&#x2F;span&gt;&lt;span&gt;(&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;void&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; *&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;userdata&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt; struct&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; window &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;window&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; f64 &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;x&lt;&#x2F;span&gt;&lt;span&gt;,&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);&quot;&gt; f64 &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#E06C75, #E06C75);font-style: italic;&quot;&gt;y&lt;&#x2F;span&gt;&lt;span&gt;)&lt;&#x2F;span&gt;&lt;span&gt; {&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt; 9&lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;    struct&lt;&#x2F;span&gt;&lt;span&gt; editor_state &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;*&lt;&#x2F;span&gt;&lt;span&gt;editor &lt;&#x2F;span&gt;&lt;span style=&quot;color: light-dark(#C678DD, #C678DD);&quot;&gt;=&lt;&#x2F;span&gt;&lt;span&gt; userdata&lt;&#x2F;span&gt;&lt;span&gt;;&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;10&lt;&#x2F;span&gt;&lt;span&gt;    ...&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;
&lt;span class=&quot;giallo-l&quot;&gt;&lt;span aria-hidden=&quot;true&quot; class=&quot;giallo-ln&quot; style=&quot;color: light-dark(#495162, #495162);&quot;&gt;11&lt;&#x2F;span&gt;&lt;span&gt;}&lt;&#x2F;span&gt;&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
&lt;ul&gt;
&lt;li&gt;That&#x27;s it for now
&lt;ul&gt;
&lt;li&gt;The projects are in their really early stages, so there isn&#x27;t much to talk about them yet.&lt;&#x2F;li&gt;
&lt;li&gt;The purpose of this post is to get started with the devlog process.&lt;&#x2F;li&gt;
&lt;li&gt;These are not intuitive things (atleast not for me).&lt;&#x2F;li&gt;
&lt;li&gt;So with these devlogs, hopefully I can mark the roads I travel, and the milestones I cross.&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
&lt;&#x2F;li&gt;
&lt;&#x2F;ul&gt;
</content>
        
    </entry>
</feed>
