<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Chris</title>
    <description>The latest articles on DEV Community by Chris (@chris_6acde6217b28da1e10c).</description>
    <link>https://dev.to/chris_6acde6217b28da1e10c</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4216360%2F0c65bdee-6531-46a7-bdce-c8ee08d8a9dc.jpg</url>
      <title>DEV Community: Chris</title>
      <link>https://dev.to/chris_6acde6217b28da1e10c</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/chris_6acde6217b28da1e10c"/>
    <language>en</language>
    <item>
      <title>I built a zero-dependency web compiler in Rust for LLM coding agents: ~34 ms builds</title>
      <dc:creator>Chris</dc:creator>
      <pubDate>Fri, 30 Oct 2026 18:11:13 +0000</pubDate>
      <link>https://dev.to/chris_6acde6217b28da1e10c/i-built-a-rust-web-compiler-for-llm-coding-agents-34-ms-builds-and-diagnostics-an-agent-can-act-on-19eg</link>
      <guid>https://dev.to/chris_6acde6217b28da1e10c/i-built-a-rust-web-compiler-for-llm-coding-agents-34-ms-builds-and-diagnostics-an-agent-can-act-on-19eg</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F1a0qez9lg8sp3c0d3z9r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F1a0qez9lg8sp3c0d3z9r.png" alt="BRAINLLM — The web compiler for LLMs" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;If an LLM builds your frontend, give it a language built for LLMs.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Your agent came to build a button. Your stack handed it a committee: a framework, a bundler, a transpiler, a minifier and a dozen config files. Every one of them is a decision the model has to reconstruct, and context it spends on tooling instead of on your product.&lt;/p&gt;

&lt;p&gt;I built &lt;strong&gt;BRAINLLM&lt;/strong&gt; to shorten that path: a compact component language (&lt;code&gt;.brain&lt;/code&gt;), one canonical spec and a native compiler written in Rust that tells the agent exactly how to fix its mistakes.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;🦀 One native binary: parser, checker, codegen, bundler and minifier. No Vite, webpack, esbuild or Babel in the build pipeline.&lt;/li&gt;
&lt;li&gt;⚡ Warm production builds in &lt;strong&gt;~34 ms&lt;/strong&gt; on our open benchmark.&lt;/li&gt;
&lt;li&gt;🤖 Agent-ready diagnostics with exact fix edits, plus CLI and MCP tools.&lt;/li&gt;
&lt;li&gt;🍦 &lt;strong&gt;Zero runtime dependencies.&lt;/strong&gt; The output is vanilla JavaScript and CSS. A new app's &lt;code&gt;package.json&lt;/code&gt; has no &lt;code&gt;dependencies&lt;/code&gt; at all, just the compiler as its only devDependency.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Try it in one command&lt;/strong&gt; (Node 22+, no Rust install, no npm account):&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm create @christianirack/brainll@latest my-app
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  The code your agent handles
&lt;/h2&gt;

&lt;p&gt;Components, state and styling live together in &lt;code&gt;.brain&lt;/code&gt; files:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight html"&gt;&lt;code&gt;&lt;span class="nt"&gt;&amp;lt;meta&lt;/span&gt; &lt;span class="na"&gt;props=&lt;/span&gt;&lt;span class="s"&gt;"start:num=0 label:str='Clicks'"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;

&lt;span class="nt"&gt;&amp;lt;script&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;n&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sig&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;start&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;dbl&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;drv&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;n&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/script&amp;gt;&lt;/span&gt;

&lt;span class="nt"&gt;&amp;lt;button&lt;/span&gt; &lt;span class="na"&gt;on:click=&lt;/span&gt;&lt;span class="s"&gt;{n++}&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;{label}: {n} × 2 = {dbl}&lt;span class="nt"&gt;&amp;lt;/button&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The compiler handles signal reads and writes, derived values update when their inputs change, and styles are scoped to the component. The output is direct-DOM JavaScript: signals update only the affected nodes.&lt;/p&gt;

&lt;h2&gt;
  
  
  The agent loop
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fan2w251w7btocm3x2a07.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fan2w251w7btocm3x2a07.png" alt="An agent reads the BRAINLLM contract, writes a component and uses compiler feedback to validate the app" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Understand.&lt;/strong&gt; &lt;code&gt;brain spec&lt;/code&gt; serves the implemented language contract. &lt;code&gt;brain map --json&lt;/code&gt; maps the project.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Build &amp;amp; correct.&lt;/strong&gt; The agent writes components with &lt;code&gt;brain add&lt;/code&gt;. &lt;code&gt;brain check --json&lt;/code&gt; returns diagnostics with the file, location, rule and a proposed fix. Mechanical fixes carry exact replacement edits, and &lt;code&gt;brain fix&lt;/code&gt; applies them.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Verify &amp;amp; ship.&lt;/strong&gt; &lt;code&gt;brain doctor&lt;/code&gt; runs checks, tests and diagnostics; &lt;code&gt;brain build&lt;/code&gt; compiles production output. Chrome screenshots, accessibility outlines and visual baselines give the agent eyes on the UI it built.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Everything is also exposed over stdio with &lt;code&gt;brain mcp&lt;/code&gt;, and &lt;code&gt;brain guide &amp;lt;topic&amp;gt;&lt;/code&gt; serves task playbooks (views, data, forms, server, SEO, accessibility, tests, i18n, performance).&lt;/p&gt;

&lt;h2&gt;
  
  
  Batteries included, zero libraries
&lt;/h2&gt;

&lt;p&gt;A form shouldn't need an ecosystem. Everything below ships in the same toolchain, and the browser runtime has no third-party dependencies:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Built in&lt;/th&gt;
&lt;th&gt;What you get&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Components and reactive state&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;.brain&lt;/code&gt; files with markup, BrainScript and scoped styles; &lt;code&gt;sig&lt;/code&gt;, &lt;code&gt;drv&lt;/code&gt; and &lt;code&gt;fx&lt;/code&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Routes and layouts&lt;/td&gt;
&lt;td&gt;Views, layouts, loaders and guards&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Forms and data&lt;/td&gt;
&lt;td&gt;Form validation, HTTP resources and server contracts&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Bundler and minifier&lt;/td&gt;
&lt;td&gt;Written in Rust, inside the same binary. No Vite, webpack, esbuild or Babel&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Diagnostics and repairs&lt;/td&gt;
&lt;td&gt;JSON diagnostics plus &lt;code&gt;brain fix&lt;/code&gt; for mechanical edits&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Browser checks&lt;/td&gt;
&lt;td&gt;Chrome screenshots, accessibility outlines and visual baselines&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Size budgets&lt;/td&gt;
&lt;td&gt;Per-route JS, CSS and HTML budgets that fail oversized builds&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Agent tooling&lt;/td&gt;
&lt;td&gt;Project map, task playbooks (&lt;code&gt;brain guide&lt;/code&gt;), CLI and MCP&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h2&gt;
  
  
  Show me the numbers
&lt;/h2&gt;

&lt;p&gt;Seven stacks, the same dashboard workflow, 140 measured builds. All seven passed the same nine Chrome interaction checks.&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Warm production build&lt;/th&gt;
&lt;th&gt;Median, 20 runs&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;BRAINLLM&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;34.32 ms&lt;/strong&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;React + Vite&lt;/td&gt;
&lt;td&gt;155.49 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Vue + Vite&lt;/td&gt;
&lt;td&gt;211.76 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Svelte + Vite&lt;/td&gt;
&lt;td&gt;243.53 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Astro + React island&lt;/td&gt;
&lt;td&gt;504.78 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Angular CLI&lt;/td&gt;
&lt;td&gt;1,262.50 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;React + webpack&lt;/td&gt;
&lt;td&gt;1,334.54 ms&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;Apple M5, 24 GiB RAM, two warmups per stack. These are fixture results, not a universal speed claim: output strategies differ. &lt;strong&gt;Don't trust the headline, run the benchmark.&lt;/strong&gt; The method, versions, raw timings and the script to reproduce it are in the repo.&lt;/p&gt;

&lt;h2&gt;
  
  
  Let your LLM make it better
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F8uf4pf44djwjkzjbgtst.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F8uf4pf44djwjkzjbgtst.png" alt="An LLM turns an observed problem into an isolated fix, runs validation and submits a contribution for human review" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Every run is a chance to spot a compiler bug, an expensive step or a confusing diagnostic. The agent can turn that finding into a tested proposal and push it to a review branch. Maintainers decide what merges. You stay in control.&lt;/p&gt;

&lt;h2&gt;
  
  
  Try it
&lt;/h2&gt;

&lt;p&gt;Requires Node 22+. No Rust installation needed.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm create @christianirack/brainll@latest my-app
&lt;span class="nb"&gt;cd &lt;/span&gt;my-app
npm run dev        &lt;span class="c"&gt;# brain run&lt;/span&gt;
npx brain spec     &lt;span class="c"&gt;# the language contract your agent reads&lt;/span&gt;
npm run build      &lt;span class="c"&gt;# production build&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or paste the starter brief from the README into your coding agent and describe the app you want.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;🌐 Website: &lt;a href="https://chrisifm.github.io/BRAINLLM/" rel="noopener noreferrer"&gt;https://chrisifm.github.io/BRAINLLM/&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;💻 GitHub: &lt;a href="https://github.com/chrisifm/BRAINLLM" rel="noopener noreferrer"&gt;https://github.com/chrisifm/BRAINLLM&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;📦 npm: &lt;a href="https://www.npmjs.com/package/@christianirack/brainllm" rel="noopener noreferrer"&gt;https://www.npmjs.com/package/@christianirack/brainllm&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I'd love feedback on the language design and on the diagnostics format. What would your agent need from a frontend toolchain?&lt;/p&gt;

</description>
      <category>rust</category>
      <category>webdev</category>
      <category>ai</category>
      <category>javascript</category>
    </item>
  </channel>
</rss>
