DEV Community: Sylar

How I built file tools that never upload your files (Canvas API + Web Workers)

Sylar — Thu, 25 Jun 2026 01:05:45 +0000

Most "free online file tools" upload your file to a server, do the work there, and send it back. For a lot of tasks that is unnecessary and, honestly, a privacy smell. When I built Filuni (a free toolbox of 121 file tools), I made a rule: if the browser can do the job, the file should never leave the device. Here is how that actually works and where it breaks down.

What runs fully in the browser

For images, text and JSON, everything happens client-side. A few concrete examples:

Image compression / resize / crop — load the file into an <img> or createImageBitmap(), draw it onto a <canvas> at the target size, then export with canvas.toBlob(blob => ..., 'image/jpeg', quality). No upload, no round trip.

const bitmap = await createImageBitmap(file);
const canvas = new OffscreenCanvas(targetW, targetH);
const ctx = canvas.getContext('2d');
ctx.drawImage(bitmap, 0, 0, targetW, targetH);
const blob = await canvas.convertToBlob({ type: 'image/jpeg', quality: 0.8 });

Heavy text / JSON work — formatting, diffing, regex testing on large inputs can block the main thread. Move it into a Web Worker so the UI stays responsive:

const worker = new Worker('format.worker.js');
worker.postMessage(bigJsonString);
worker.onmessage = e => render(e.data);

Using OffscreenCanvas inside a worker means even the image work never touches the main thread.

Where the browser is not enough

Being honest about the limits matters:

Video / audio transcoding — possible with ffmpeg.wasm, but for large files it is slow and memory-hungry. I run these server-side with FFmpeg instead.
Office to PDF — needs a real rendering engine, so that goes through LibreOffice on the server.
OCR on scanned PDFs — heavy; better server-side.

For anything that does hit the server, the rule becomes: process, return, and delete the file automatically right after. No long-term storage.

Why bother

Three things I did not expect:

It is cheaper. Client-side tools cost almost nothing to run, so they can stay free without ads-everywhere.
It is faster for the common case — no upload/download latency on a 3 MB image.
Users notice. Saying plainly "this file never leaves your browser" changed how people talked about the tool in feedback.

Takeaway

You do not need a backend for most file utilities. <canvas>, OffscreenCanvas, Web Workers and the File API cover a surprising amount. Push to the server only what genuinely needs it, and delete it immediately when you do.

Disclosure: I build and run Filuni, so this is the approach behind a real product, not just theory. Happy to answer questions about any specific tool in the comments.

How I decide which AI tools are worth listing: a curator's checklist

Sylar — Fri, 12 Jun 2026 06:19:29 +0000

I run a small AI tools directory as a side project. Since late 2025 I've reviewed somewhere north of a thousand AI products, and listed only about a hundred of them. This post is the checklist I wish I'd had on day one — it might be useful whether you're picking tools for your team or building any kind of curated list.

Why "list everything" fails

Most AI directories auto-scrape: every landing page with "AI" in the title gets a row in the database. That maximizes page count for SEO, but it pushes the actual filtering work onto the visitor — which is the problem a directory is supposed to solve in the first place.

So the only real value a curated list can add is saying no. Here's what my "no" looks like.

The checklist

1. Task first, demo second

The first question is never "is this impressive?" but "what task does someone finish with this?" A surprising number of AI products demo beautifully and map to no recurring task. If I can't write one sentence in the form "use this when you need to ___", it doesn't go in.

2. The free tier has to be real

I check: can you complete the core task at least a few times without paying? "Free trial that dies in 7 days" and "free tier that watermarks everything into uselessness" both count as bait. I list paid tools too — but the pricing has to be stated honestly on the listing, not discovered at checkout.

3. Two honest cons, minimum

This is my favorite filter, and the most work. For every tool I force myself to write at least two genuine downsides (slow output, weak non-English support, aggressive upsells, no export, whatever is actually true). If I can't — it means I haven't used it enough to list it. The cons section is also the part readers trust most, which says something about directories in general.

4. Is anyone home?

Changelog or release notes from the last ~3 months, a responsive support channel, a team page that isn't stock photos. AI tools die fast and quietly; a directory full of dead links is worse than no directory.

5. Open-source alternative check

For each category I try to also know the self-hostable option. Sometimes the right recommendation for a privacy-sensitive task is "don't use a SaaS at all" — a directory that can't say that is just an ad wall. (This is why I ended up maintaining a separate open-source section with 80+ projects.)

What gets rejected most

In practice, the three most common rejection reasons have been:

Wrapper with no margin of value — a thin UI over a foundation model API, priced higher than the API itself.
Landing page only — waitlist products. Nothing against them, but a directory entry for something you can't use helps nobody.
Identity churn — product renamed/repositioned twice in six months. Usually predicts a shutdown.

What I'd tell anyone building a curated anything

Decide your rejection reasons before your acceptance reasons.
Write the cons first. If the cons are hard to write, you don't know the product yet.
Date everything. Curation rots; visible "last reviewed" dates keep you honest.

Disclosure: I'm the maintainer of SoFarBot, the AI tools directory described above — free to browse, no signup, in English and Chinese. The checklist works without it, but if you want to see it applied, that's where it lives. Happy to answer questions about the curation process in the comments.

I built 121 free online file tools as a side project - here is what I learned

Sylar — Thu, 11 Jun 2026 10:37:52 +0000

After months of nights and weekends, I launched Filuni - a free online toolkit with 121 tools for PDF, image, video, audio, and document processing. No signup, no upload limits, no watermarks.

Why I built it

Every time I needed to merge a PDF or compress an image, I would land on a tool that either:

limited me to 2 free uses per day,
required an account for a 10-second task,
slapped a watermark on my file, or
wanted $12/month for basic operations.

So I built my own, and made it free.

What is inside

121 tools across 12 categories:

PDF: merge, split, compress, convert to Word/Excel/image, watermark, rotate, page numbers
Office: Word/Excel/PPT/HTML/Markdown/CSV to PDF
Image: compress, resize, crop, format convert, QR codes, EXIF viewer, watermark, collage
Video: compress, convert, extract audio, video to GIF
Audio: convert, compress, trim
Encryption: AES/RSA, hash generators, Base64, digital signatures
Developer: JWT decoder, regex tester, cron visualizer, cURL to code, JSON formatter/diff
Text / Color / Converters / Calculators: word counter, diff, palettes, WCAG contrast, units, timestamps, BMI, loans...

What I learned

Users hate signup walls for simple tasks. Removing all auth requirements was the single best UX decision.
Client-side processing wins trust. Most image/text/JSON tools run 100% in the browser (Canvas API, Web Workers) - files never leave your device. People notice and mention it.
SEO is king for tool sites. Every tool has its own landing page with FAQ and HowTo schema. Organic search is by far the biggest traffic source.
Multi-language support compounds. Filuni now ships in 11 languages (English, Spanish, Portuguese, German, French, Russian, Vietnamese, Korean, Japanese, Chinese Simplified & Traditional). Each locale opened a new market for the same codebase.

Tech stack

Nuxt 3 + TailwindCSS + PWA. FFmpeg handles video/audio on the server, LibreOffice (via jodconverter) does Office to PDF. Server-processed files are auto-deleted after processing.

Revenue model

Anchor ads only. No paywalls, no popups, no freemium tricks.

Try it: www.filuni.com - I would love feedback on the UX, and suggestions for what tools to add next!

I Built 121+ Free Browser-Based Dev Tools — Here Are My 10 Favorites

Sylar — Sat, 06 Jun 2026 08:49:32 +0000

Every developer has a set of small utilities they reach for daily — decoding a JWT, formatting JSON, generating UUIDs, testing regex patterns. Most of these tasks don't need a full IDE or installed software.

So I built Filuni — a free, browser-based toolkit with 121+ tools across 12 categories. Here are my 10 favorites for developers:

1. JWT Decoder

Paste a JWT token, instantly see the decoded header and payload. No more copy-pasting to jwt.io.

Try it: filuni.com/filetool/dev/dev-jwt

2. JSON Formatter & Validator

Paste messy JSON, get it beautifully formatted with syntax highlighting. Instantly validates and shows error locations with line numbers.

Try it: filuni.com/filetool/json/json-format

3. UUID Generator

Generate UUID v4 in bulk — 1 to 100 UUIDs at once with one click.

Try it: filuni.com/filetool/dev/dev-uuid

4. Regex Tester

Write regex patterns and test them against sample text with real-time match highlighting.

Try it: filuni.com/filetool/text/text-regex

5. Cron Expression Parser

Enter a cron expression and see a human-readable description plus the next 10 run times.

Try it: filuni.com/filetool/dev/dev-cron

6. JSON Diff

Structurally compare two JSON objects and see added/removed/changed keys highlighted.

Try it: filuni.com/filetool/dev/dev-json-diff

7. cURL to Code Converter

Paste a cURL command and get equivalent code in fetch, axios, or Python requests.

Try it: filuni.com/filetool/dev/dev-curl

8. Code Beautifier

Beautify or minify HTML, CSS, JavaScript, and SQL with one click.

Try it: filuni.com/filetool/dev/dev-beautifier

9. CIDR / Subnet Calculator

Enter a CIDR notation and get network address, broadcast, netmask, and usable host range.

Try it: filuni.com/filetool/dev/dev-cidr

10. Base Converter

Convert numbers between binary, octal, decimal, hex, and any base 2-36.

Try it: filuni.com/filetool/dev/dev-base-convert

Beyond Dev Tools

Filuni also has 100+ tools for:

PDF — merge, split, compress, convert to Word/Excel/Image
Image — compress, resize, crop, QR codes, watermark, EXIF viewer
Video — compress, convert, extract audio, make GIFs
Text — word counter, diff, case converter, Markdown preview
Encryption — AES/RSA encrypt, hash generate, Base64
Color — picker, gradient builder, WCAG contrast checker
Calculators — BMI, loan, compound interest, statistics

Why Browser-Based?

No install — works on any machine, even a Chromebook
Always up-to-date — no version management
Privacy — most tools run 100% client-side
Cross-platform — same tool on Windows, Mac, Linux, mobile

All 121+ tools are free at filuni.com, no signup required.

What dev tools do you use daily? Drop a comment!