<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[I'm Khang Publication]]></title><description><![CDATA[Field notes on AI tools, coding agents, workflows, costs, failures, and lessons from real experiments by Khang Nguyen.]]></description><link>https://blog.im-khang.com</link><image><url>https://cdn.hashnode.com/uploads/logos/6a8db7403454e375f5e209db/65d4bb26-ce97-4427-bf81-88f155d5b3a3.png</url><title>I&apos;m Khang Publication</title><link>https://blog.im-khang.com</link></image><generator>RSS for Node</generator><lastBuildDate>Tue, 08 Sep 2026 16:24:51 GMT</lastBuildDate><atom:link href="https://blog.im-khang.com/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[How Archify Turns Codebase Maps Into Reviewed Technical Artifacts]]></title><description><![CDATA[Used for: assessing a tool for explaining AI-assisted codebases while preparing this publication workflow. Tested: source review of Archify v2.16.0, 2026-09-01.
Verdict: use when a team needs a reprod]]></description><link>https://blog.im-khang.com/archify-codebase-maps-reviewed-technical-artifacts</link><guid isPermaLink="true">https://blog.im-khang.com/archify-codebase-maps-reviewed-technical-artifacts</guid><category><![CDATA[software architecture]]></category><category><![CDATA[Developer Tools]]></category><category><![CDATA[Artificial Intelligence]]></category><dc:creator><![CDATA[Khang Nguyen]]></dc:creator><pubDate>Tue, 01 Sep 2026 06:30:26 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1788251165444/dcb8f57b-bee3-4aaa-978f-4065deb2eae3.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<blockquote>
<p>Used for: assessing a tool for explaining AI-assisted codebases while preparing this publication workflow. Tested: source review of Archify <code>v2.16.0</code>, 2026-09-01.</p>
<p>Verdict: use when a team needs a reproducible technical map that an AI coding agent can refine and a human can inspect. Avoid it when the job is freehand sketching or a general-purpose diagram editor.</p>
</blockquote>
<h2>Quick verdict</h2>
<ul>
<li><strong>Best for:</strong> architecture reviews, onboarding maps, workflow explanations, and before/after diagram comparisons.</li>
<li><strong>Avoid if:</strong> the requirement is WYSIWYG drawing, automatic Mermaid parsing, or hosted collaborative diagram editing.</li>
<li><strong>Cost:</strong> Archify is MIT licensed. Running it still requires a compatible coding-agent environment and Node.js where its renderer runs.</li>
<li><strong>Main limitation:</strong> validation can check the supplied diagram structure and rendering rules; it cannot prove that an agent’s model of a real system is complete or operationally correct.</li>
</ul>
<p>AI-assisted coding makes it cheap to add routes, workers, integrations, and data stores. It does not make the resulting system easy to explain. The usual answer is a diagram, but screenshots drift, manual edits are difficult to review, and a polished drawing can still overstate what a codebase does.</p>
<p><a href="https://github.com/tt-a1i/archify">Archify</a> is built around a narrower job: turn a codebase analysis or system description into an inspectable technical artifact. An agent produces typed JSON intermediate representation (IR); Archify validates it and deterministically compiles it to self-contained HTML and SVG. The result can be opened locally, shared as one file, and exported in common formats.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1788251164321/7b36f7a0-54bb-485d-89bc-410fa6958c5e.png" alt="A code editor feeding a system map with browser, API, cache, and database nodes." /></p>
<h2>What I used it for</h2>
<p>This was a research-only evaluation, not a claim that Archify has been run against every system in this publication. The practical question was narrower: what should a developer use when a growing project needs a system map that is more durable than a whiteboard screenshot?</p>
<p>That question appears early in small products. A project may begin with a page and an API. Then it accumulates authentication, queues, caches, background work, analytics, and third-party services. The code can remain understandable file by file while the overall path becomes hard to describe. The same issue shows up in applied builds: a public project such as the <a href="/builds/">Olist Ecommerce Analytics Agent</a> is easier to evaluate when its roles, data boundary, and query constraints can be presented as a concrete system map rather than a long paragraph.</p>
<p>Archify supports five diagram types, each aimed at a different question:</p>
<ol>
<li><strong>Architecture</strong> diagrams for components, services, storage, boundaries, and a primary path.</li>
<li><strong>Workflow</strong> diagrams for ordered steps, approvals, branches, exceptions, and runbooks.</li>
<li><strong>Sequence</strong> diagrams for calls and returns over time, such as an authentication check or cache fallback.</li>
<li><strong>Data-flow</strong> diagrams for sources, transforms, stores, consumers, and sensitivity boundaries.</li>
<li><strong>Lifecycle</strong> diagrams for states, retries, waits, cancellation, and terminal outcomes.</li>
</ol>
<p>Choosing a type matters. An architecture map should not pretend to explain timing. A sequence should not attempt to carry every infrastructure detail. A lifecycle should make waits and terminal states legible instead of hiding them behind generic arrows.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1788251165095/830c33b8-ba3e-47d4-80ce-877f7087941b.png" alt="Five abstract technical diagram panels arranged as a grid, representing different ways to explain a system." /></p>
<h2>Setup or workflow</h2>
<p>The repository documents the skill installation command:</p>
<pre><code class="language-bash">npx skills add tt-a1i/archify -g
</code></pre>
<p>Archify documents workflows for Cursor, Claude Code, Codex CLI, and OpenCode. A useful first prompt is deliberately scoped: ask for the core components, one primary path, external dependencies, and trust boundaries. Resist the urge to ask for every class and service at once. A map with too many edges is not more truthful; it is only harder to read.</p>
<p>For an unfamiliar repository, a bounded request can look like this:</p>
<pre><code class="language-text">Analyze this repository, then use Archify to create a high-level runtime architecture diagram.
Show 8–12 core components, one primary path, external dependencies, and trust boundaries.
Put supporting detail in cards instead of adding more edges.
</code></pre>
<p>The agent then creates typed JSON IR. Archify’s documented process validates schema, layout, HTML/SVG rendering, routes, and label-to-route clearance before a showcase-quality artifact replaces a prior verified output. This is the useful boundary: an agent can propose the interpretation, while the renderer applies repeatable checks to the artifact it delivers.</p>
<p>After that, refinement should stay specific. Add one dependency. Move one component. Highlight one rollback path. A controlled change is easier to review than regenerating the entire diagram from a vague request.</p>
<h2>What worked in the documented design</h2>
<p>Archify’s strongest idea is not a visual preset. It is the separation between meaning and rendering. Typed IR provides a source that can be inspected and revised; deterministic compilation produces a consistent artifact from that source; validation keeps layout and route constraints inside the delivery loop.</p>
<p>The resulting HTML supports more than a static view. The documented viewer can search nodes, trace authored routes, inspect upstream or downstream reach, compare semantic roles, and play guided stories. Those interactions only reuse authored nodes and relationships. That constraint is important: a technical viewer should not invent topology while a reader is trying to understand a real system.</p>
<p>Architecture Delta is another useful example of restraint. Given validated Before, Delta, and After snapshots, it reports authored additions, removals, changes, moves, and reroutes. It does not claim performance impact, security improvement, merge safety, or runtime risk unless evidence outside the diagram supports those conclusions. For code review, that distinction is healthier than treating a changed diagram as proof that a change is safe.</p>
<p>The export surface is practical: Archify documents self-contained HTML plus PNG, SVG, WebM, and 1200×630 share cards. That suits an architecture review, a README, a release note, or a team handoff without requiring a separate hosted diagram product.</p>
<h2>What broke or costs more than expected</h2>
<p>A validated diagram is not a verified system. The renderer can reject malformed source, confusing routes, and visual collisions. It cannot know whether the agent missed a hidden queue, misunderstood a permissions boundary, or inferred behavior from an incomplete repository scan. Treat the diagram as a communication artifact that deserves code review, not as runtime monitoring or a substitute for tests.</p>
<p>There is also an intentional scope boundary. Archify is not a general drawing editor, a Mermaid theme, automatic Mermaid parsing, hosted sharing, or a WYSIWYG canvas. That is not a defect when the need is repeatable technical communication. It is a poor fit when a workshop needs people to sketch freely and negotiate the model live.</p>
<p>The same rule applies to source evidence. Archify can link evidence-backed nodes to revision-verified public source when that mode is requested. Ordinary diagrams may remain source-free. Readers should ask which kind of map they are viewing before treating it as a source-level audit.</p>
<h2>Alternatives and trade-offs</h2>
<p>Mermaid is the lower-friction option when plain-text diagrams inside documentation are enough. A design canvas is better when manual composition and collaborative sketching are the main jobs. A slide can be better when the audience needs a short, curated narrative rather than an explorable map.</p>
<p>Archify fits between those choices. It is for teams that already work through coding agents and want a diagram source, renderer, validator, and viewer in the same workflow. It brings more structure than a hand-drawn diagram and more visual interaction than a text-only diagram definition. That structure costs prompt discipline and a review step.</p>
<h2>Tips to reuse</h2>
<ol>
<li>Start with one question per map: system structure, one workflow, one request path, one data journey, or one lifecycle.</li>
<li>Keep the first architecture map to 8–12 core components. Put nuance in cards instead of crossing every possible edge.</li>
<li>Ask the agent to state unknowns. Missing information is better than invented topology.</li>
<li>Generate a Before snapshot before a structural change and an After snapshot afterward. Use Delta to explain the authored difference, not to claim operational impact.</li>
<li>Review the artifact alongside source and tests. A map helps people reason; it does not replace evidence.</li>
</ol>
<p>For broader context on using AI tools in real project work, see this publication’s <a href="/work/">project notes</a> and public <a href="/builds/">build records</a>.</p>
<h2>Sources and related reading</h2>
<ul>
<li><a href="https://github.com/tt-a1i/archify">Archify repository and README</a></li>
<li><a href="https://tt-a1i.github.io/archify/">Archify project page</a></li>
<li><a href="https://tt-a1i.github.io/archify/guide.html">Archify scenario guide</a></li>
<li><a href="https://tt-a1i.github.io/archify/gallery.html">Archify Proof Lab</a></li>
</ul>
]]></content:encoded></item></channel></rss>