<?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: buggythegret</title>
    <description>The latest articles on DEV Community by buggythegret (@shreyam1008).</description>
    <link>https://dev.to/shreyam1008</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%2F820025%2F96dc61bf-3446-4264-a5fa-5fd01dd4f654.jpeg</url>
      <title>DEV Community: buggythegret</title>
      <link>https://dev.to/shreyam1008</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/shreyam1008"/>
    <language>en</language>
    <item>
      <title>BUI: The UI Solution We Already Had</title>
      <dc:creator>buggythegret</dc:creator>
      <pubDate>Sun, 06 Sep 2026 02:32:12 +0000</pubDate>
      <link>https://dev.to/shreyam1008/bui-your-app-the-browsers-ui-1p0b</link>
      <guid>https://dev.to/shreyam1008/bui-your-app-the-browsers-ui-1p0b</guid>
      <description>&lt;p&gt;A download manager might run for hours. I only need its interface for a minute: add the file, check where it will go, and leave it running.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Written from my notes and experience building ProtoPeek, with AI assistance for drafting and editing. Adapted from &lt;a href="https://shreyam1008.com.np/log/local-web-surfaces/" rel="noopener noreferrer"&gt;my illustrated article&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  BUI: a name for something we already do
&lt;/h2&gt;

&lt;p&gt;I’m calling it &lt;strong&gt;Browser User Interface — BUI&lt;/strong&gt;. You can read it as &lt;em&gt;Borrowed UI&lt;/em&gt;, too: your app brings the functionality and borrows the browser.&lt;/p&gt;

&lt;p&gt;A local program serves a web interface and exposes an API. The browser handles layout and interaction; the program handles the work. This is a proposed label for a familiar architecture, not a new standard or an invention claim. It is still a GUI.&lt;/p&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%2F1bf6xju7qt9fndzfgasl.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%2F1bf6xju7qt9fndzfgasl.png" alt="A local program with browser and terminal entrances" width="800" height="420"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A CLI can be another entrance to the same core. You still have to implement the commands and decide whether they share a running session.&lt;/p&gt;

&lt;h2&gt;
  
  
  A browser face. A local backbone.
&lt;/h2&gt;

&lt;p&gt;Say you’re building a label-printing tool. A webpage can open the browser’s print dialog, but it cannot simply call an arbitrary printer driver or vendor SDK. A local backend can use native interfaces such as the Windows &lt;a href="https://learn.microsoft.com/en-us/windows/win32/printdocs/print-spooler-api" rel="noopener noreferrer"&gt;Print Spooler API&lt;/a&gt;, then expose a specific “print this label” operation to the page.&lt;/p&gt;

&lt;p&gt;That is the beauty of the local bridge: web controls without restricting the whole app to browser APIs. The page stays sandboxed; the native program owns the capability. You still handle installation, OS permissions, drivers, and platform differences. Keep the bridge narrow and authenticated, not a general-purpose shell.&lt;/p&gt;

&lt;h2&gt;
  
  
  The web tooling is already here
&lt;/h2&gt;

&lt;p&gt;As a UI developer, I already have layout, components, typography, devtools, and a familiar path from design to working controls. AI helps me write code; it does not make cross-platform native UI and packaging decisions disappear.&lt;/p&gt;

&lt;p&gt;Sometimes a consistent custom interface matters more than native widgets. &lt;a href="https://www.electronjs.org/" rel="noopener noreferrer"&gt;Electron&lt;/a&gt;, used by Discord and Slack, is a reasonable answer: bring the engine along for a predictable rendering target. BUI asks whether this particular tool can use the browser already on the machine. We are often there anyway.&lt;/p&gt;

&lt;h2&gt;
  
  
  The strongest examples are not mine
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://docs.openwebui.com/" rel="noopener noreferrer"&gt;Open WebUI&lt;/a&gt;&lt;/strong&gt; is a substantial self-hosted interface for AI conversations, tools, and knowledge. It can connect to local models or cloud providers. Local UI hosting does not guarantee local computation.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://opencode.ai/docs/web/" rel="noopener noreferrer"&gt;OpenCode Web&lt;/a&gt;&lt;/strong&gt; starts a local server and opens the browser. Its terminal UI can attach to that server and share sessions. This is more than a settings panel.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://docs.syncthing.net/users/guilisten.html" rel="noopener noreferrer"&gt;Syncthing&lt;/a&gt;&lt;/strong&gt; has a browser management interface, bound to localhost by default. Its controls can be occasional even while synchronization runs all day.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://github.com/fullstorydev/grpcui" rel="noopener noreferrer"&gt;grpcui&lt;/a&gt;&lt;/strong&gt; launches a local gRPC inspector operated in the browser. ProtoPeek originated from this project.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;These projects illustrate the architecture; they do not use or endorse my proposed BUI label.&lt;/p&gt;

&lt;h2&gt;
  
  
  What building ProtoPeek taught me
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://github.com/shreyam1008/ProtoPeek" rel="noopener noreferrer"&gt;ProtoPeek&lt;/a&gt; is my implementation: a local Go workbench with an embedded web interface. The page presents a gRPC request while the Go backend makes the native protocol connection.&lt;/p&gt;

&lt;p&gt;As a UI person, I like having room for searchable lists, request forms, and readable results without making desktop packaging the whole project.&lt;/p&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%2F5hvdrhe6jb51w3xh4ew2.jpg" 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%2F5hvdrhe6jb51w3xh4ew2.jpg" alt="ProtoPeek Downloader with transfer progress and verification" width="800" height="569"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Real v0.5.0 release-source capture with fixture transfers, not the latest development shell. The external aria2c engine owns the downloads; the page controls them.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;The pp download command handles one URL in a separate engine session; it does not attach to the browser queue. “CLI and GUI” is not a promise of feature parity.&lt;/p&gt;

&lt;h2&gt;
  
  
  Let the backend carry the work
&lt;/h2&gt;

&lt;p&gt;Choose files, arrange a few steps, start an encoding job, close the tab. Come back later for progress, logs, and results. That is the experience I want from a small workflow tool. The backend owns the job; the page is a window into it. Reconnection, cancellation, and durable job state still need deliberate implementation.&lt;/p&gt;

&lt;p&gt;This works for sync, batch conversion, and automation too. Keep heavy work out of the page’s main thread. &lt;a href="https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Async_JS/Introducing_workers" rel="noopener noreferrer"&gt;Web Workers&lt;/a&gt; can do that inside the browser; a local backend is useful when a job needs native libraries, OS access, or a lifetime independent of the tab. It still uses the same machine’s CPU and memory.&lt;/p&gt;

&lt;p&gt;That layer can be C# for deep Windows integration, Go for straightforward iteration, Rust when its control and safety trade-offs fit, or C++ when the engine is already there. No minimum age for C++—just an existing relationship with your debugger.&lt;/p&gt;

&lt;p&gt;I’m using this approach for a client project too, and the UI side has been a breeze. Familiar controls, a separate execution layer, and a useful boundary between them.&lt;/p&gt;

&lt;h2&gt;
  
  
  What you gain — and what you still own
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Possible advantages:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;No bundled browser engine to distribute.&lt;/li&gt;
&lt;li&gt;Familiar web UI tooling and accessibility primitives.&lt;/li&gt;
&lt;li&gt;A core that can work without its interface open.&lt;/li&gt;
&lt;li&gt;Room for scriptable commands and visual controls.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Responsibilities that remain:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Installation, updates, launch, reconnect, and shutdown.&lt;/li&gt;
&lt;li&gt;A secure local API: loopback binding, Host/Origin validation, appropriate authentication, and CSRF protection. CORS alone is not authorization.&lt;/li&gt;
&lt;li&gt;Browser compatibility, memory, and working data.&lt;/li&gt;
&lt;li&gt;Less control over windows, shortcuts, and OS integration.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;ProtoPeek is still evolving. A stripped Windows amd64 build of commit b6037bf on September 6, 2026 was &lt;strong&gt;34.1 MB&lt;/strong&gt;, including &lt;strong&gt;1.24 MB of web assets&lt;/strong&gt;. Three idle samples over six seconds, with no connected browser or requested jobs, showed &lt;strong&gt;22.2 MB working set&lt;/strong&gt; and &lt;strong&gt;53.3 MB private committed memory&lt;/strong&gt;. Those are different Windows measurements, not numbers to add together. Decimal MB; excludes the browser and external engines. Build flags and scope are in the &lt;a href="https://shreyam1008.com.np/log/local-web-surfaces/#what-you-save" rel="noopener noreferrer"&gt;measurement note&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;A CLI command has no continuing process memory after it exits. A backend left running still does. There is no fixed “one tab” cost: measure the backend &lt;strong&gt;and&lt;/strong&gt; incremental browser memory. This short idle snapshot is not a startup, peak-memory, or cross-framework benchmark.&lt;/p&gt;

&lt;p&gt;A PWA can add an app icon and standalone window where supported. Installing one does not install or start an arbitrary native backend; you still need a launcher and reconnect behavior.&lt;/p&gt;

&lt;h2&gt;
  
  
  Sometimes another approach fits better
&lt;/h2&gt;

&lt;p&gt;I love native apps. When platform behavior is central, I want to use the platform—not bundle a browser engine with a tiny utility by reflex. What wears me down is getting that experience right across operating systems. Flutter is a strong custom-UI option, but I still want the platform’s own behavior in some places. That is a preference, not a verdict on what those frameworks can build.&lt;/p&gt;

&lt;p&gt;A system WebView is a useful middle ground: web tooling inside an application window. &lt;a href="https://v2.tauri.app/reference/webview-versions/" rel="noopener noreferrer"&gt;Tauri&lt;/a&gt;, for example, uses WebView2 on Windows, WKWebView on macOS, and WebKitGTK on Linux. You gain a dedicated window and closer integration while still testing across engines.&lt;/p&gt;

&lt;p&gt;Native controls can be better when platform behavior is central. A bundled engine can be worth its size when consistency matters. This is not a ranking from bad to good.&lt;/p&gt;

&lt;p&gt;For a download queue, backup manager, batch converter, or device configuration tool, the controls may need attention for only a few minutes. The process can keep working overnight.&lt;/p&gt;

&lt;p&gt;For an editor, design tool, or audio workstation used all day, input behavior, accessibility, shortcuts, and sustained responsiveness deserve much more weight. I tend to prefer native implementations there, but VS Code and OpenCode are good reasons not to turn that preference into a rule.&lt;/p&gt;

&lt;p&gt;A little notepad could fit too, if file handling, offline use, and shortcuts work well. I would not choose this by default for my full photo editor: precise input, color management, and large documents deserve their own evaluation. Web technology can build serious creative tools; that does not settle the delivery choice.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The UI tooling was already here. Let the local app do the work.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The &lt;a href="https://shreyam1008.com.np/log/local-web-surfaces/" rel="noopener noreferrer"&gt;full article&lt;/a&gt; has an interactive diagram, an Open WebUI example, and the sources. My earlier &lt;a href="https://shreyam1008.com.np/log/desktop-app-stack-gap-2026/" rel="noopener noreferrer"&gt;desktop stack essay&lt;/a&gt; covers the wider trade-offs.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>architecture</category>
      <category>opensource</category>
    </item>
  </channel>
</rss>
