The latest articles on DEV Community by santarana5 (@santarana5). https://dev.to/santarana5 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%2F4206359%2F44f5d2f0-86fc-41a2-8edf-d73d22000361.jpg https://dev.to/santarana5 en santarana5 Sun, 25 Oct 2026 10:23:08 +0000 https://dev.to/santarana5/building-utilityflowin-20-privacy-first-browser-utilities-in-a-single-zero-server-app-544 https://dev.to/santarana5/building-utilityflowin-20-privacy-first-browser-utilities-in-a-single-zero-server-app-544 <p>Every developer has been there: you just need to quickly format a JSON payload, check a code diff, validate an international IBAN, or merge two images into a PDF. You search Google, click the first result, and get hit with cookie banners, "Upload to our cloud server" spinners, or a "Sign up for Pro" paywall.</p> <p>I wanted a single, lightning-fast workspace that felt like a native desktop OS and executed everything <strong>100% client-side</strong>.</p> <p>👉 <strong>Try it live here: <a href="https://utilityflow.in" rel="noopener noreferrer">https://utilityflow.in</a></strong></p> <h3> 🛠️ What's Inside the 20-Tool Ecosystem? </h3> <ol> <li> <strong>PDF &amp; Document Command Suite:</strong> Merge images to PDF, convert text briefs to PDF, and inspect PDF metadata locally using <code>jsPDF</code> and <code>FileReader</code>.</li> <li> <strong>Global IBAN &amp; Bank Branch Inspector:</strong> Runs official ISO-13616 MOD-97 checksum validation and extracts bank names, branch addresses, and BIC/SWIFT codes.</li> <li> <strong>Color-Coded Split Code Diff:</strong> Side-by-side comparison with word-level deletion (red) and addition (green) highlighting.</li> <li> <strong>Unified HTML5/CSS3/JS Sandbox:</strong> A single-window playground with instant <code>iframe</code> sandboxing and 1-click <code>.html</code> file export.</li> <li> <strong>Dual-Chart Wealth &amp; Loan Engine:</strong> Synchronized sliders and Chart.js visualizations for compound wealth and EMI amortization.</li> <li> <strong>Cryptographic Token &amp; Password Studios:</strong> Powered by the browser's native <code>window.crypto.getRandomValues()</code> CSPRNG for true entropy.</li> <li> <strong>Image Compression Studio:</strong> Hardware-accelerated HTML5 Canvas compression that shrinks images by up to 80% in milliseconds.</li> </ol> <h3> ⚡ The Tech Stack </h3> <ul> <li> <strong>UI &amp; Styling:</strong> Tailwind CSS with a custom Bento-grid layout and instant Light/Dark mode.</li> <li> <strong>Core Engine:</strong> Vanilla JavaScript (ES6+) for zero framework overhead and instant load times.</li> <li> <strong>Libraries:</strong> Chart.js for financial telemetry and jsPDF for local document compilation.</li> </ul> <p>Check it out at <strong><a href="https://utilityflow.in" rel="noopener noreferrer">UtilityFlow.in</a></strong> and let me know in the comments what utility I should add next!</p> webdev javascript showdev opensource