{"slug": "running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js", "title": "Running an AI image upscaler & sharpener 100% in the browser (TensorFlow.js)", "summary": "A developer built two free browser-based tools for upscaling and sharpening images using TensorFlow.js, allowing the entire machine-learning process to run locally without uploading images to a server. The tools, an AI image upscaler and an AI photo sharpener, use ESRGAN model variants and a patch-based approach to manage memory, with options for speed and detail.", "body_md": "I wanted to sharpen and upscale images **without uploading them to some server**. It turns out you can run the whole ML model right in the browser — the image never leaves the device. Here's what I learned shipping it as two free tools.\n\nThe core is one call: `new Upscaler({ model })`\n\n, then `await upscaler.upscale(img, { patchSize: 64, padding: 4, progress })`\n\n. The `patchSize`\n\noption is the important one — more on that below.\n\n**Memory.** Running 4× on a large image tries to allocate a huge tensor and the tab dies. The fix is `patchSize`\n\n— process the image in tiles and stitch them back, so memory stays bounded regardless of input size.\n\n**Model choice matters more than I expected.** I benchmarked three ESRGAN variants on the same image: `slim`\n\nis fast (~2.5s on a small image) but slightly soft, `medium`\n\nhad visible tiling artifacts (rejected), and `thick`\n\nwas clearly the sharpest but ~3× slower. So I default to `slim`\n\nand offer `thick`\n\nas a \"max detail\" mode.\n\n**Lightweight upscalers smooth the image.** ESRGAN-slim enlarges cleanly but the result can look soft. A small unsharp-mask pass afterward restores the bite without an obvious \"sharpened\" halo.\n\n**Sharpen vs upscale are different jobs.** To make a sharpener that keeps the original size, I run the same model then draw the result back down to native dimensions — the AI detail survives the downscale, so you get a clearer image at the same size. That became the [AI photo sharpener](https://snapvi.app/sharpen-image); the enlarge-2×/4× version is the [AI image upscaler](https://snapvi.app/image-upscaler).\n\nThe trade-off is a one-time model download and slower runs on weak phones, which I gate with size caps and a fast/max toggle.\n\nHappy to answer anything about the TF.js side — what would you run in-browser next?", "url": "https://wpnews.pro/news/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js", "canonical_source": "https://dev.to/zephyrtran/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflowjs-47b8", "published_at": "2026-08-11 03:47:29+00:00", "updated_at": "2026-08-11 04:19:23.407205+00:00", "lang": "en", "topics": ["machine-learning", "computer-vision", "ai-tools", "developer-tools"], "entities": ["TensorFlow.js", "ESRGAN", "snapvi.app"], "alternates": {"html": "https://wpnews.pro/news/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js", "markdown": "https://wpnews.pro/news/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js.md", "text": "https://wpnews.pro/news/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js.txt", "jsonld": "https://wpnews.pro/news/running-an-ai-image-upscaler-sharpener-100-in-the-browser-tensorflow-js.jsonld"}}