{
  "id": 8748962,
  "title": "Why We Moved 100% of Our Web Tools Client-Side (And Saved 95% Server Costs)",
  "url": "https://urgent.news/2026/09/20/why-we-moved-100-of-our-web-tools-client-side-and-saved-95-server",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-09-20T18:38:10.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/zovixia/why-we-moved-100-of-our-web-tools-client-side-and-saved-95-server-costs-5ap"
  },
  "original_language": "en",
  "account": "For utility web applications like PDF invoice makers, JSON formatters, image compressors, or QR code generators, the conventional architecture involves a frontend form that sends user input to a Node or Python backend via an API call. The backend processes the file using heavyweight CLI tools, returns the result, and stores temporary files in S3. This approach, however, results in three significant issues: costly cloud server bills, latency bottlenecks, and user privacy concerns.\n\nEarlier this year, while developing Zovixia—a collection of over 40 free web utilities—our team opted for a 100% client-side architecture. Here's how we achieved this, the 95% reduction in server costs, and how modern browser APIs render backend servers unnecessary for utility web apps.\n\nThe traditional server-side method entails substantial expenditures. For instance, a PDF invoice generator handling 50,000 monthly requests would require a headless Chrome process consuming 512MB to 1GB RAM per invoice conversion. Accompanying costs include server infrastructure, storage fees, and bandwidth. By shifting to client-side Web Workers and browser APIs, our infrastructure reduces to a static CDN serving pre-rendered Next.js HTML and JavaScript bundles, with monthly hosting costs ranging from $0 to $5.\n\nKey browser APIs that enabled us to replace traditional server processes include client-side PDF generation using jspdf and Canvas, image compression via OffscreenCanvas and WebAssembly, vector SVG and WiFi QR code generation, and high-performance text utility engines executing in microseconds within the JavaScript runtime memory.\n\nComparatively, the client-side architecture offers much faster response times, costing nearly nothing at scale, whereas the server-side architecture incurs high costs and higher latency. Moreover, client-side execution ensures user data privacy, as files remain within the user's RAM, and the application remains fully functional offline.\n\nWhile the client-side approach isn't suitable for all applications, such as those requiring heavy database state, proprietary AI models, or payment gateways, for single-purpose web utilities, calculators, converters, and document generators, the browser is more than capable of handling the workload. The conclusion is that by leveraging the user's device and modern web standards, you can deliver sub-50ms performance, guarantee 100% user privacy, and run a web app that scales to millions of hits without incurring cloud server bills. Explore 40+ client-side web utilities at Zovixia.",
  "summary": "When building utility web apps—like PDF invoice makers, JSON formatters, image compressors, or QR code generators—the standard architecture taught in most tutorials is simple: Build a frontend form (React/Vue). Send user input via an API call ( POST /api/convert ) to a Node/Python backend. Process the file on AWS EC2 or Lambda using heavy CLI tools (Puppeteer, ImageMagick, Pandoc). Return the…",
  "key_points": [
    "Shifted 100% of web tools to client-side architecture",
    "Reduced server costs by 95% by using CDN",
    "Utilized modern browser APIs for PDF, image, and QR code generation"
  ],
  "editors_take": null,
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}