When building helper tools for AI workflows—like estimating token counts, cleaning LLM output formatting, or splitting image grids—most online solutions share two frustrating drawbacks:
Privacy Concerns: Passing prompt context or generated assets through third-party servers. #
Server Overhead & Latency: Unnecessary API roundtrips and cloud hosting costs for operations that modern browsers can easily execute locally.
To solve this for my own daily workflow, I built RunAIToolkit—a suite of browser-first AI utilities designed with a zero-server-cost architecture.
Here is a breakdown of how it works under the hood and why client-side execution makes sense for AI micro-tools.
🛠️ What's Under the Hood?
- AI Token & API Cost Estimator
Instead of making backend requests to compute token counts, tokenization logic runs directly inside browser-side Web Workers.
How it helps: You can estimate costs for models like GPT-4o, Claude 3.5, and DeepSeek R1 locally without exposing proprietary prompts or system instructions. #
Try it here: AI Token & API Cost Estimator
- Prompt & Markdown Cleaner
Raw LLM outputs frequently contain hidden unicode artifacts, system tags, and inconsistent markdown formatting.
Implementation: Uses client-side regex transforms to strip unnecessary formatting instantly without high-latency server trips. #
Try it here: Prompt & Markdown Cleaner
- Midjourney & Flux Grid Splitter
Midjourney and Flux output 2x2 image grids that need to be sliced into single high-res images.
Implementation: Slices images instantly using local HTML5 Canvas (ctx.drawImage
). Because processing occurs strictly in memory, image uploads are instantaneous and quality remains untouched. #
Try it here: Midjourney / Flux Grid Splitter
⚡ Technical Stack & Architecture
**Framework:** Next.js (App Router) with Static Site Generation (`output: 'export'`
)
Styling & UI: Tailwind CSS + Shadcn/ui #
Deployment: GitHub + Cloudflare Pages (Anycast Edge Network) #
Operating Cost: $0/month (Zero backend servers or serverless execution costs)
💡 Key Takeaways for Web Developers
Shift Logic to the Client: Modern JavaScript engines and Web Workers can handle token calculations and canvas manipulation in milliseconds. #
Static Export + Edge Hosting = Speed: Serving pre-rendered HTML straight from CDN edge nodes delivers global TTFB (Time to First Byte) under 50ms. #
Privacy as a Feature: When input data never leaves the client's memory, you remove security concerns around user data logging entirely.
Check out the live platform at runaitoolkit.com! I'd love to hear your feedback on the architecture, performance, or suggestions for additional client-side AI tools you'd like to see added next.