<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: xiaomei Lu</title>
    <description>The latest articles on DEV Community by xiaomei Lu (@xiaomei_lu_85e416d898252c).</description>
    <link>https://dev.to/xiaomei_lu_85e416d898252c</link>
    <image>
      <url>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%2F3963957%2Fbbe6bd2d-0a4d-4ccd-b653-fe4ac83cb879.png</url>
      <title>DEV Community: xiaomei Lu</title>
      <link>https://dev.to/xiaomei_lu_85e416d898252c</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/xiaomei_lu_85e416d898252c"/>
    <language>en</language>
    <item>
      <title>Is that 'free file converter' uploading your file? A 60-second DevTools audit</title>
      <dc:creator>xiaomei Lu</dc:creator>
      <pubDate>Mon, 22 Jun 2026 16:57:14 +0000</pubDate>
      <link>https://dev.to/xiaomei_lu_85e416d898252c/is-that-free-file-converter-uploading-your-file-a-60-second-devtools-audit-4950</link>
      <guid>https://dev.to/xiaomei_lu_85e416d898252c/is-that-free-file-converter-uploading-your-file-a-60-second-devtools-audit-4950</guid>
      <description>&lt;p&gt;You drag a sensitive PDF — a contract, a passport scan, a payslip — onto some "100% free, secure, private" online converter. It spits out the result in two seconds. The page swears it "deletes your files after processing."&lt;/p&gt;

&lt;p&gt;Here's the thing: you have no way to verify that claim. "We delete after processing" is a promise about a server you can't see, running code you can't read, with a retention policy you can't audit. It might be true. It might be true today and not next quarter.&lt;/p&gt;

&lt;p&gt;But you don't have to trust the promise. If your file never left your browser, there's nothing to delete and nothing to subpoena. And whether or not it left is a fact you can check yourself in about 60 seconds.&lt;/p&gt;

&lt;p&gt;Here's the skill.&lt;/p&gt;

&lt;h2&gt;
  
  
  The 60-second audit
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Open the tool's page in Chrome/Edge/Firefox.&lt;/li&gt;
&lt;li&gt;Open DevTools (&lt;code&gt;F12&lt;/code&gt; or &lt;code&gt;Cmd+Opt+I&lt;/code&gt;), go to the &lt;strong&gt;Network&lt;/strong&gt; tab.&lt;/li&gt;
&lt;li&gt;Click the 🚫 clear button to start clean. Leave "Preserve log" off for now.&lt;/li&gt;
&lt;li&gt;Run the conversion — pick your file, hit convert.&lt;/li&gt;
&lt;li&gt;Watch what rows appear.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;That's it. You're now looking at every request the page made. The question is simple: &lt;strong&gt;did one of them carry your file out?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A faster way to find the row: type your filename into the Network tab's filter box, or click &lt;strong&gt;Fetch/XHR&lt;/strong&gt; to hide assets, then sort by the &lt;strong&gt;Size&lt;/strong&gt; column. At convert-time, a row roughly the size of your file (a ~2 MB row for a 2 MB file) is the one to inspect.&lt;/p&gt;

&lt;h2&gt;
  
  
  What an upload looks like
&lt;/h2&gt;

&lt;p&gt;When a tool sends your file to a server, you'll see a request that is unmistakable once you know the shape of it. Click the row and look at the &lt;strong&gt;Headers&lt;/strong&gt; and &lt;strong&gt;Payload&lt;/strong&gt; tabs. You'll see something like:&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Request URL:    https://api.someconverter.com/v1/convert
Request Method: POST
Status Code:    200

Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryAb3x
Content-Length: 2487193
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;Two tells:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Method is &lt;code&gt;POST&lt;/code&gt; or &lt;code&gt;PUT&lt;/code&gt;&lt;/strong&gt;, not &lt;code&gt;GET&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;code&gt;Content-Type: multipart/form-data&lt;/code&gt;&lt;/strong&gt; with a &lt;code&gt;Content-Length&lt;/code&gt; roughly the size of your file (here, ~2.4 MB — that's your file in bytes).&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Open the &lt;strong&gt;Payload&lt;/strong&gt; tab (in Firefox, click the request and open the &lt;strong&gt;Request&lt;/strong&gt; tab) and you'll see the form-data parts:&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;------WebKitFormBoundaryAb3x
Content-Disposition: form-data; name="file"; filename="contract.pdf"
Content-Type: application/pdf

%PDF-1.7
%âãÏÓ
... (binary bytes of your actual file) ...
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;That &lt;code&gt;filename="contract.pdf"&lt;/code&gt; followed by &lt;code&gt;%PDF&lt;/code&gt; bytes is the smoking gun. Your file is, right now, sitting in a request body headed to someone else's machine. No amount of "we delete it" changes the fact that it left.&lt;/p&gt;

&lt;p&gt;(Sometimes it's &lt;code&gt;application/octet-stream&lt;/code&gt; or a base64 blob in a JSON body instead of multipart — same story. A big &lt;code&gt;POST&lt;/code&gt;/&lt;code&gt;PUT&lt;/code&gt; body sized like your file = upload.)&lt;/p&gt;

&lt;h2&gt;
  
  
  What a genuinely client-side tool looks like
&lt;/h2&gt;

&lt;p&gt;Now run the same audit on a tool that processes locally. The signature is almost funny in how boring it is:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You pick your file. &lt;strong&gt;No new network row appears&lt;/strong&gt; at the moment of conversion.&lt;/li&gt;
&lt;li&gt;The result downloads — but as a &lt;code&gt;blob:&lt;/code&gt; URL the page generated in memory, not a response from a server.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The only requests you'll ever see are the page's own assets (JS, CSS, fonts) on first load, and — for some tools — a &lt;strong&gt;one-time download of a model or WASM binary&lt;/strong&gt;. That part trips people up, so let's be precise.&lt;/p&gt;

&lt;h2&gt;
  
  
  The one nuance: a fetch is not always &lt;em&gt;your file&lt;/em&gt;
&lt;/h2&gt;

&lt;p&gt;Some browser-native tools download a chunk of machinery the first time you use them. OCR pulls a WASM build of Tesseract plus a trained language model; in-browser background removal pulls an ML model file. In the Network tab that looks like:&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Request URL:    .../tesseract-core.wasm
Request Method: GET
Status: 200    Size: 4.2 MB

Request URL:    .../eng.traineddata.gz
Request Method: GET
Status: 200    Size: 10.4 MB
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;This is &lt;strong&gt;not&lt;/strong&gt; your file leaving. Three reasons you can tell them apart:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Method is &lt;code&gt;GET&lt;/code&gt;&lt;/strong&gt; — it's &lt;em&gt;pulling code down&lt;/em&gt;, not &lt;em&gt;pushing a file up&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;It's the &lt;em&gt;same&lt;/em&gt; file/model regardless of what you convert, and it's &lt;strong&gt;cached&lt;/strong&gt; — convert a second file and it's served from disk cache (you'll see "(disk cache)" in the Size column), or there's no request at all.&lt;/li&gt;
&lt;li&gt;The bytes flow &lt;em&gt;to&lt;/em&gt; you. Your document is never in a request body.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So the honest rule: &lt;strong&gt;a &lt;code&gt;GET&lt;/code&gt; for a &lt;code&gt;.wasm&lt;/code&gt; or model file is fine. A &lt;code&gt;POST&lt;/code&gt;/&lt;code&gt;PUT&lt;/code&gt; carrying your filename and bytes is an upload.&lt;/strong&gt; And yes — a WASM tool &lt;em&gt;could&lt;/em&gt; still phone home (analytics, "anonymous" telemetry, error reporting with your filename in it). The audit catches that too: if there's any outbound &lt;code&gt;POST&lt;/code&gt; with your data in it, you'll see it.&lt;/p&gt;

&lt;h2&gt;
  
  
  The honest part (disclosure)
&lt;/h2&gt;

&lt;p&gt;I build &lt;a href="https://bestaifinds.com" rel="noopener noreferrer"&gt;bestaifinds.com&lt;/a&gt; — 240+ free, no-signup file tools — and this audit is exactly the principle I build on, so I'll hold myself to it.&lt;/p&gt;

&lt;p&gt;Open the Network tab on the image and PDF-structure tools and you'll see &lt;strong&gt;no upload&lt;/strong&gt;: &lt;a href="https://bestaifinds.com/image/compress" rel="noopener noreferrer"&gt;image compress&lt;/a&gt;, &lt;a href="https://bestaifinds.com/image/remove-bg" rel="noopener noreferrer"&gt;remove background&lt;/a&gt;, &lt;a href="https://bestaifinds.com/image/to-text" rel="noopener noreferrer"&gt;image→text OCR&lt;/a&gt;, &lt;a href="https://bestaifinds.com/image/png-to-webp" rel="noopener noreferrer"&gt;PNG→WebP&lt;/a&gt;, &lt;a href="https://bestaifinds.com/pdf/merge" rel="noopener noreferrer"&gt;PDF merge&lt;/a&gt;, &lt;a href="https://bestaifinds.com/pdf/split" rel="noopener noreferrer"&gt;PDF split&lt;/a&gt;. Convert once, watch the panel, then convert again and watch it stay quiet. The model/WASM download is the only thing that crosses the wire.&lt;/p&gt;

&lt;p&gt;And I'll be straight about the rest. A few tasks genuinely can't run in the browser yet:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Video (ffmpeg).&lt;/strong&gt; &lt;code&gt;ffmpeg.wasm&lt;/code&gt; exists, but transcoding a real clip in WASM is slow and memory-hungry enough that a real ffmpeg binary is just better.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Ghostscript-grade PDF compression&lt;/strong&gt; and &lt;strong&gt;PDF→text&lt;/strong&gt; — real downsampling and quality text extraction want native binaries.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;HEIC decode&lt;/strong&gt; — most browsers can't natively decode HEIC, so HEIC→JPG leans on libheif/ImageMagick.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So &lt;a href="https://bestaifinds.com/pdf/compress" rel="noopener noreferrer"&gt;PDF compression&lt;/a&gt;, &lt;a href="https://bestaifinds.com/pdf/to-text" rel="noopener noreferrer"&gt;PDF→text&lt;/a&gt;, &lt;a href="https://bestaifinds.com/image/heic-to-jpg" rel="noopener noreferrer"&gt;HEIC→JPG&lt;/a&gt;, and all the &lt;a href="https://bestaifinds.com/video/to-gif" rel="noopener noreferrer"&gt;video&lt;/a&gt; &lt;a href="https://bestaifinds.com/video/mp4-to-mp3" rel="noopener noreferrer"&gt;tools&lt;/a&gt; &lt;strong&gt;do go to a server&lt;/strong&gt; — and the file is deleted right after. That last claim you'll have to take on trust, which is the whole point of this post: when a heavy task claims to be 100% local, audit it, because sometimes "in your browser" quietly means "in &lt;em&gt;our&lt;/em&gt; browser, on &lt;em&gt;our&lt;/em&gt; server." Prefer the tools where you don't have to trust.&lt;/p&gt;

&lt;p&gt;So next time something promises "private and secure," open the Network tab and let the wire tell you.&lt;/p&gt;

&lt;p&gt;What conversion do you &lt;em&gt;wish&lt;/em&gt; ran fully in your browser but always seems to need an upload? Drop it in the comments — genuinely useful for deciding what to build (or audit) next.&lt;/p&gt;

</description>
      <category>privacy</category>
      <category>webdev</category>
      <category>security</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>PDF, image &amp; video chores: the CLI one-liner + a browser fallback for each</title>
      <dc:creator>xiaomei Lu</dc:creator>
      <pubDate>Mon, 15 Jun 2026 12:08:37 +0000</pubDate>
      <link>https://dev.to/xiaomei_lu_85e416d898252c/pdf-image-video-chores-the-cli-one-liner-a-browser-fallback-for-each-4bl</link>
      <guid>https://dev.to/xiaomei_lu_85e416d898252c/pdf-image-video-chores-the-cli-one-liner-a-browser-fallback-for-each-4bl</guid>
      <description>&lt;p&gt;You need to convert &lt;strong&gt;one&lt;/strong&gt; file. Just one.&lt;/p&gt;

&lt;p&gt;A teammate sends a &lt;code&gt;.heic&lt;/code&gt; screenshot and your image viewer shrugs. The contact form needs a PDF under 5 MB and yours is 11. You recorded a 40 MB screen capture and the bug tracker only accepts GIFs. You don't want to &lt;code&gt;brew install&lt;/code&gt; a tool you'll use once, and you &lt;em&gt;really&lt;/em&gt; don't want to drop a half-confidential document into the first sketchy "free converter" Google surfaces.&lt;/p&gt;

&lt;p&gt;So here's the cheat sheet I keep coming back to: for each common file chore, the &lt;strong&gt;CLI one-liner&lt;/strong&gt; if you live in a terminal, and a &lt;strong&gt;no-install browser tool&lt;/strong&gt; when you don't (or when you're on someone else's machine). I'll be honest about which is better for what — and at the end, which ones run on your own machine vs. on a server.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;Disclosure:&lt;/strong&gt; I build the browser tools I link to (&lt;a href="https://bestaifinds.com" rel="noopener noreferrer"&gt;bestaifinds.com&lt;/a&gt;). The CLI commands are the real recommendation; the web tools are the fallback for when you can't install anything.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  PDFs
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Get a PDF under an email/upload limit
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;gs &lt;span class="nt"&gt;-sDEVICE&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;pdfwrite &lt;span class="nt"&gt;-dCompatibilityLevel&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;1.4 &lt;span class="nt"&gt;-dPDFSETTINGS&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;/ebook &lt;span class="se"&gt;\&lt;/span&gt;
   &lt;span class="nt"&gt;-dNOPAUSE&lt;/span&gt; &lt;span class="nt"&gt;-dQUIET&lt;/span&gt; &lt;span class="nt"&gt;-dBATCH&lt;/span&gt; &lt;span class="nt"&gt;-sOutputFile&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;out.pdf &lt;span class="k"&gt;in&lt;/span&gt;.pdf
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Ghostscript's &lt;code&gt;/ebook&lt;/code&gt; preset is the sweet spot — &lt;code&gt;/screen&lt;/code&gt; for brutal compression, &lt;code&gt;/printer&lt;/code&gt; to keep quality (the &lt;a href="https://ghostscript.readthedocs.io/en/latest/VectorDevices.html" rel="noopener noreferrer"&gt;PDFSETTINGS docs&lt;/a&gt; list what each one does). No Ghostscript handy? → &lt;a href="https://bestaifinds.com/pdf/compress" rel="noopener noreferrer"&gt;compress it in the browser&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Pull the text out of a PDF (to grep / parse / diff)
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;pdftotext &lt;span class="k"&gt;in&lt;/span&gt;.pdf out.txt        &lt;span class="c"&gt;# ships with poppler-utils&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Indispensable for log-style PDFs and a quick &lt;code&gt;grep&lt;/code&gt;. &lt;code&gt;pdftotext&lt;/code&gt; (and &lt;code&gt;pdfunite&lt;/code&gt; below) come from &lt;a href="https://poppler.freedesktop.org/" rel="noopener noreferrer"&gt;poppler&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Merge / split
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;pdfunite a.pdf b.pdf c.pdf merged.pdf       &lt;span class="c"&gt;# poppler&lt;/span&gt;
qpdf &lt;span class="nt"&gt;--split-pages&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt;.pdf page.pdf          &lt;span class="c"&gt;# -&amp;gt; page-1.pdf, page-2.pdf, ...&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://github.com/qpdf/qpdf" rel="noopener noreferrer"&gt;qpdf&lt;/a&gt; inserts the page number before the extension automatically. No install? → &lt;a href="https://bestaifinds.com/pdf/merge" rel="noopener noreferrer"&gt;merge in the browser&lt;/a&gt;.&lt;/p&gt;




&lt;h2&gt;
  
  
  Images
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Shrink images / ship WebP
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;cwebp &lt;span class="nt"&gt;-q&lt;/span&gt; 80 photo.png &lt;span class="nt"&gt;-o&lt;/span&gt; photo.webp         &lt;span class="c"&gt;# libwebp, lossy by default&lt;/span&gt;
cwebp &lt;span class="nt"&gt;-lossless&lt;/span&gt; ui.png &lt;span class="nt"&gt;-o&lt;/span&gt; ui.webp           &lt;span class="c"&gt;# for screenshots / flat UI / line art&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Over a photographic &lt;strong&gt;PNG&lt;/strong&gt;, lossy WebP at q80 often saves 60–80%; over an already-compressed &lt;strong&gt;JPEG&lt;/strong&gt;, expect more like 20–35% (sometimes less — you're re-encoding existing artifacts). Use &lt;code&gt;-lossless&lt;/code&gt; (or &lt;code&gt;-near_lossless&lt;/code&gt;) for screenshots and logos, where lossy q80 shows visible ringing. It clears Lighthouse's "next-gen formats" / "efficiently encode images" opportunities and trims LCP. &lt;a href="https://developers.google.com/speed/webp/docs/cwebp" rel="noopener noreferrer"&gt;cwebp options →&lt;/a&gt; No install? → &lt;a href="https://bestaifinds.com/image/compress" rel="noopener noreferrer"&gt;compress images in the browser&lt;/a&gt;.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;A note on &lt;code&gt;magick input.jpg -quality 80 out.jpg&lt;/code&gt;: re-encoding an &lt;strong&gt;already-compressed&lt;/strong&gt; JPEG to a fixed quality only helps if the original was saved higher than q80 — otherwise it adds a generation of loss and can make the file &lt;em&gt;bigger&lt;/em&gt;. For an existing JPEG, reach for a lossless optimizer (&lt;code&gt;jpegtran&lt;/code&gt;, &lt;code&gt;jpegoptim&lt;/code&gt;) or convert to WebP instead.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Remove a background (avatars, OG images, READMEs)
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;rembg i input.png output.png    &lt;span class="c"&gt;# pip install "rembg[cpu]" first; downloads a model on first run&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://github.com/danielgatis/rembg" rel="noopener noreferrer"&gt;rembg&lt;/a&gt; is great, but it's a Python dep + a model download for a 10-second job. For one image: → &lt;a href="https://bestaifinds.com/image/remove-bg" rel="noopener noreferrer"&gt;remove a background in the browser&lt;/a&gt; (the model runs client-side — more on that below).&lt;/p&gt;

&lt;h3&gt;
  
  
  OCR — image/screenshot → text
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;tesseract screenshot.png out    &lt;span class="c"&gt;# writes out.txt&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://github.com/tesseract-ocr/tesseract" rel="noopener noreferrer"&gt;Tesseract&lt;/a&gt; is excellent if it's installed.&lt;/p&gt;

&lt;h3&gt;
  
  
  That iPhone &lt;code&gt;.heic&lt;/code&gt; nobody can open
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;magick photo.heic photo.jpg          &lt;span class="c"&gt;# ImageMagick built with libheif&lt;/span&gt;
heif-convert photo.heic photo.jpg    &lt;span class="c"&gt;# ships with libheif (Debian: libheif-examples; Homebrew: libheif)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://github.com/strukturag/libheif" rel="noopener noreferrer"&gt;libheif&lt;/a&gt; does the actual HEIC decoding under both.&lt;/p&gt;




&lt;h2&gt;
  
  
  Video
&lt;/h2&gt;

&lt;h3&gt;
  
  
  MP4 → GIF (for a PR demo or a bug repro)
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;ffmpeg &lt;span class="nt"&gt;-i&lt;/span&gt; clip.mp4 &lt;span class="nt"&gt;-vf&lt;/span&gt; &lt;span class="s2"&gt;"fps=12,scale=480:-1:flags=lanczos"&lt;/span&gt; clip.gif
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;For crisp colors, generate a palette first — ffmpeg's &lt;a href="https://trac.ffmpeg.org/wiki/Encode/HighQualityGifs" rel="noopener noreferrer"&gt;high-quality GIF guide&lt;/a&gt; walks through &lt;code&gt;palettegen&lt;/code&gt;/&lt;code&gt;paletteuse&lt;/code&gt;; worth it for screen recordings. No ffmpeg? → &lt;a href="https://bestaifinds.com/video/to-gif" rel="noopener noreferrer"&gt;MP4 to GIF in the browser&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Rip the audio: MP4 → MP3
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;ffmpeg &lt;span class="nt"&gt;-i&lt;/span&gt; talk.mp4 &lt;span class="nt"&gt;-q&lt;/span&gt;:a 0 &lt;span class="nt"&gt;-map&lt;/span&gt; a talk.mp3
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  The honest part: what runs where
&lt;/h2&gt;

&lt;p&gt;"Free online converter" usually means &lt;em&gt;your file gets uploaded to someone's box.&lt;/em&gt; That matters for anything remotely confidential. So here's the straight answer for the browser tools I linked above (I build them, so I checked the actual code path):&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Runs entirely in your browser — the file itself is never uploaded:&lt;/strong&gt;&lt;br&gt;
image compress / resize / format-convert, PNG→WebP, OCR (Tesseract compiled to the browser), background removal (an in-browser ML model), and PDF merge / split / to-JPG / from-JPG (via &lt;a href="https://github.com/Hopding/pdf-lib" rel="noopener noreferrer"&gt;&lt;code&gt;pdf-lib&lt;/code&gt;&lt;/a&gt; and &lt;code&gt;pdf.js&lt;/code&gt;, both running in your browser). Open DevTools → Network and you'll see the file is never POSTed — the only fetch is the background-removal model, downloaded once, then everything runs locally.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Runs server-side, then deletes after processing:&lt;/strong&gt;&lt;br&gt;
PDF compression (Ghostscript/qpdf), PDF→text, HEIC→JPG (ImageMagick), and all video work (ffmpeg) — these need real binaries no browser ships. For anything sensitive, prefer the CLI here.&lt;/p&gt;

&lt;p&gt;That distinction is the whole reason I dislike most converter sites: they don't tell you. So now you know which is which.&lt;/p&gt;




&lt;h2&gt;
  
  
  TL;DR
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Living in a terminal already? The CLI one-liners above cover almost all of these chores.&lt;/li&gt;
&lt;li&gt;On a borrowed machine, or it's a one-off? The browser tools skip the install.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Care about privacy?&lt;/strong&gt; Use the client-side tools or the CLI for anything you wouldn't email.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The browser tools are all free and signup-free at &lt;a href="https://bestaifinds.com" rel="noopener noreferrer"&gt;bestaifinds.com&lt;/a&gt;. I built the site partly &lt;em&gt;because&lt;/em&gt; I was tired of choosing between installing yet another dependency and trusting a random upload box. If there's a file chore you do constantly that I missed, drop it in the comments — genuinely useful for deciding what to build next.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>productivity</category>
      <category>cli</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Getting images actually web-ready: compress, resize, and pick the right format without opening an editor</title>
      <dc:creator>xiaomei Lu</dc:creator>
      <pubDate>Sun, 07 Jun 2026 16:23:18 +0000</pubDate>
      <link>https://dev.to/xiaomei_lu_85e416d898252c/getting-images-actually-web-ready-compress-resize-and-pick-the-right-format-without-opening-an-o24</link>
      <guid>https://dev.to/xiaomei_lu_85e416d898252c/getting-images-actually-web-ready-compress-resize-and-pick-the-right-format-without-opening-an-o24</guid>
      <description>&lt;p&gt;A surprising amount of "my site is slow" comes down to one thing: someone dropped a 4032x3024 photo straight off their phone into a content block that renders at 800px wide. The browser downloads all 5 MB and then throws most of it away during resize. Multiply that by a dozen images and you've got a page that takes 8 seconds on a hotel wifi.&lt;/p&gt;

&lt;p&gt;Getting an image "web-ready" is really three decisions made in order: &lt;strong&gt;resize first, then choose a format, then compress.&lt;/strong&gt; Do them in that order and you usually cut file size by 80-95% with no visible quality loss. Here's how to actually do it, with the numbers that matter.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Resize to the size it's displayed at (this is the big win)
&lt;/h2&gt;

&lt;p&gt;This is the step people skip, and it's the one that matters most. Pixels you can't see still cost bytes.&lt;/p&gt;

&lt;p&gt;Figure out the largest size the image is ever shown at, then add a buffer for high-DPI screens:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Full-width hero on a normal layout:&lt;/strong&gt; cap at ~1920px wide. Even 4K monitors rarely render a content image wider than that.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Blog post inline image / content column:&lt;/strong&gt; the column is usually 700-800px, so export at &lt;strong&gt;1600px&lt;/strong&gt; (2x for retina) and let CSS scale it down.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Thumbnail / avatar / card image:&lt;/strong&gt; displayed at 200px? Export at &lt;strong&gt;400px&lt;/strong&gt;. No more.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Icons and logos:&lt;/strong&gt; if it's flat/geometric, this should be an SVG, not a raster image at all.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The math is brutal in your favor here. A 4000x3000 image is 12 million pixels. Resized to 1600x1200 it's 1.9 million pixels — &lt;strong&gt;84% gone&lt;/strong&gt; before you've compressed anything. Resizing from 4000px to 1600px usually takes a 5 MB JPEG down to roughly 600-900 KB on its own.&lt;/p&gt;

&lt;p&gt;Quick rule: if the longest edge of your file is bigger than 2000px and it's not a print asset or a zoomable gallery image, it's too big.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Pick the right format
&lt;/h2&gt;

&lt;p&gt;Format choice is mostly about what's &lt;em&gt;in&lt;/em&gt; the image:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Photographs / complex gradients → JPEG or WebP.&lt;/strong&gt; Lots of color, no hard edges, no transparency. JPEG is universally supported; WebP is ~25-35% smaller at the same quality and supported by every browser shipped in the last 5+ years.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Screenshots, UI, text, line art, anything with sharp edges → PNG or WebP (lossless).&lt;/strong&gt; JPEG turns crisp edges into a smeary mess of artifacts. This is the #1 format mistake — saving a screenshot of code as a JPEG.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Needs transparency → PNG or WebP.&lt;/strong&gt; JPEG has no alpha channel.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;AVIF&lt;/strong&gt; is the smallest of all (often 20% under WebP) but it's slower to encode and a bit fussier; great for hero images where the savings are worth it, overkill for thumbnails.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Honest default for 2026: &lt;strong&gt;WebP for almost everything&lt;/strong&gt;, with a JPEG fallback only if you're targeting truly ancient clients. If you don't want to think about it, JPEG for photos and PNG for screenshots is still perfectly fine and will never surprise you.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 3: Compress with a target quality, not "maximum"
&lt;/h2&gt;

&lt;p&gt;For lossy formats (JPEG/WebP/AVIF), quality is a 0-100 dial, and the sweet spot is lower than people expect:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Quality 80-85&lt;/strong&gt; is the standard "looks identical, much smaller" zone for photos. Start here.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Quality 70-75&lt;/strong&gt; is fine for thumbnails and background images where nobody's pixel-peeping.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Above 90&lt;/strong&gt; you're mostly adding bytes you can't see. Below 60 you start to notice blocking in skies and skin tones.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;A typical 1600px photo at quality 82 lands around &lt;strong&gt;120-200 KB&lt;/strong&gt;. That's the target to aim for on a content image. If you're well above 300 KB after resizing, your quality setting is too high or the format is wrong for the content.&lt;/p&gt;

&lt;p&gt;For PNG screenshots, "quality" works differently — you reduce the color palette (e.g. down to 256 colors) and run lossless optimization. A flat UI screenshot can drop 60-70% with palette reduction and look identical.&lt;/p&gt;

&lt;h2&gt;
  
  
  Doing it without installing anything
&lt;/h2&gt;

&lt;p&gt;If you live in the terminal, the local CLI tools are excellent and worth knowing — they're scriptable, run offline, and keep files on your machine:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;ImageMagick:&lt;/strong&gt; &lt;code&gt;magick input.jpg -resize 1600x -quality 82 output.jpg&lt;/code&gt; does resize + compress in one shot. &lt;code&gt;mogrify&lt;/code&gt; batches a whole folder.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;cwebp:&lt;/strong&gt; &lt;code&gt;cwebp -q 80 input.png -o output.webp&lt;/code&gt; for WebP conversion.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;sharp&lt;/strong&gt; (Node) or &lt;strong&gt;Pillow&lt;/strong&gt; (Python) if you want this baked into a build step or an upload pipeline. This is the right answer for anything recurring.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;squoosh-cli&lt;/strong&gt; wraps the same encoders Squoosh uses, good for AVIF.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If it's a one-off, or you're on a machine where you can't install things, or you just don't want to remember ImageMagick's flag soup, a browser tool is faster. Web options worth knowing: &lt;strong&gt;Squoosh&lt;/strong&gt; (Google's, the gold standard for fiddling with one image and watching the quality slider in real time, fully client-side), &lt;strong&gt;TinyPNG&lt;/strong&gt; (dead simple, great auto-compression, but free tier caps file size and count), and &lt;strong&gt;Photopea&lt;/strong&gt; if you also need to actually edit.&lt;/p&gt;

&lt;p&gt;For the plain resize-then-compress run I described above, I usually point people at the image tools on &lt;a href="https://bestaifinds.com/image/compress" rel="noopener noreferrer"&gt;BestAIFinds&lt;/a&gt; — full disclosure, I help build that one, so weigh that accordingly. There's a compress tool, a separate resize tool, and format conversion, all free with no sign-up or watermark, and uploads auto-delete within about an hour. Squoosh is genuinely better if you want to manually tune one image with a live preview, so use that when you care about a single hero shot. For batching a folder, honestly just use ImageMagick.&lt;/p&gt;

&lt;h2&gt;
  
  
  The privacy caveat you should actually think about
&lt;/h2&gt;

&lt;p&gt;Any browser tool that uploads to a server means your image touches someone else's machine, even if it's deleted an hour later. For a marketing photo or a screenshot of public docs, who cares. For anything with PII, internal dashboards, unreleased product shots, medical or legal material — &lt;strong&gt;use a local CLI or a fully client-side tool&lt;/strong&gt; (Squoosh and ImageMagick never send your file anywhere). This isn't paranoia, it's just matching the tool to the sensitivity of the file. Read whether a tool processes in-browser or server-side before you paste in something confidential.&lt;/p&gt;

&lt;h2&gt;
  
  
  Putting it together
&lt;/h2&gt;

&lt;p&gt;The whole workflow for a typical content image:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Resize&lt;/strong&gt; longest edge to ~1600px (or 2x your display size). Biggest single saving.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pick format:&lt;/strong&gt; WebP or JPEG for photos, PNG/WebP for screenshots and UI.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Compress&lt;/strong&gt; to quality ~82 for photos, ~75 for thumbnails. Aim for under ~200 KB.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Sanity-check&lt;/strong&gt; the output actually looks fine at the size it'll be shown, not zoomed to 400%.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Do those four things and a page that was shipping 6 MB of images ships maybe 600 KB, with no visible difference. Your Lighthouse score, your mobile users, and your bandwidth bill all thank you.&lt;/p&gt;

&lt;p&gt;What's your default quality setting and format these days — has WebP fully replaced JPEG in your workflow, or are you still shipping JPEG fallbacks? Curious what edge cases are keeping people on the old formats. Drop a comment.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>performance</category>
      <category>images</category>
      <category>webperf</category>
    </item>
    <item>
      <title>Free browser tools for the boring file tasks every dev runs into</title>
      <dc:creator>xiaomei Lu</dc:creator>
      <pubDate>Tue, 02 Jun 2026 07:02:55 +0000</pubDate>
      <link>https://dev.to/xiaomei_lu_85e416d898252c/free-browser-tools-for-the-boring-file-tasks-every-dev-runs-into-3df1</link>
      <guid>https://dev.to/xiaomei_lu_85e416d898252c/free-browser-tools-for-the-boring-file-tasks-every-dev-runs-into-3df1</guid>
      <description>&lt;p&gt;Every few days I hit some small file chore that has nothing to do with the actual work: a PDF too big to email, a screenshot that needs a transparent background, a CSV someone wants as JSON. None of it is hard. It's just annoying enough to break my flow, and the first Google result is usually a desktop app that wants an install and an account before it'll do a 5-second job.&lt;/p&gt;

&lt;p&gt;Over time I've collected a set of browser-based tools that handle this stuff without any of that friction. Here's the practical roundup, with concrete steps for the tasks that come up most.&lt;/p&gt;

&lt;h2&gt;
  
  
  Compress a PDF before emailing it
&lt;/h2&gt;

&lt;p&gt;Mail servers commonly reject attachments over ~10-25 MB, and exported PDFs (especially anything with images or scans) blow past that fast.&lt;/p&gt;

&lt;p&gt;The steps are basically the same everywhere:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Open a PDF compressor in your browser.&lt;/li&gt;
&lt;li&gt;Drag the file in.&lt;/li&gt;
&lt;li&gt;Pick a compression level — "medium" is usually the sweet spot between size and readable text.&lt;/li&gt;
&lt;li&gt;Download and check it still looks fine before you send.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The thing to watch: heavy compression can soften scanned text or photos. Always eyeball the output. If it's a contract or anything someone has to read carefully, stay on the lighter setting.&lt;/p&gt;

&lt;p&gt;Tools I've used for this: &lt;strong&gt;Smallpdf&lt;/strong&gt;, &lt;strong&gt;PDF24&lt;/strong&gt;, and &lt;a href="https://bestaifinds.com/pdf/compress" rel="noopener noreferrer"&gt;BestAIFinds&lt;/a&gt; (full disclosure, I help run that last one). All three do the same core job in the browser. PDF24 is nice because it's genuinely no-account; Smallpdf has a free tier with daily limits. The one I help with is free with no sign-up and no watermark, and it auto-deletes uploads within about an hour — but honestly, for a one-off, grab whatever tab is already open.&lt;/p&gt;

&lt;h2&gt;
  
  
  Remove an image background
&lt;/h2&gt;

&lt;p&gt;This used to mean opening an editor and masking by hand. Now an automatic remover gets you 90% of the way in one click — great for product shots, profile pictures, or dropping a logo onto a slide.&lt;/p&gt;

&lt;p&gt;How it goes:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Upload the image (PNG/JPG).&lt;/li&gt;
&lt;li&gt;Let it auto-detect the subject.&lt;/li&gt;
&lt;li&gt;Download as a transparent PNG.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;It struggles with fine detail — wispy hair, glass, motion blur. For those, &lt;strong&gt;Photopea&lt;/strong&gt; is worth knowing about: it's a free, in-browser Photoshop clone where you can clean up edges manually with the same keyboard muscle memory. For the quick automatic version I'll use an in-browser remover like the one on &lt;a href="https://bestaifinds.com/image/remove-bg" rel="noopener noreferrer"&gt;BestAIFinds&lt;/a&gt;, but the workflow is identical across tools.&lt;/p&gt;

&lt;h2&gt;
  
  
  Convert formats without a round-trip
&lt;/h2&gt;

&lt;p&gt;The two that come up constantly:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;PDF to Word&lt;/strong&gt; when you need to edit text in a doc someone "helpfully" sent as a PDF. Formatting is the hard part — tables and columns are where converters fall apart. Run it, then spend two minutes fixing layout rather than expecting it to be perfect.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;CSV / Excel / JSON / XML&lt;/strong&gt; when you're moving data between a spreadsheet and something that speaks JSON. For small files a browser converter is faster than writing a one-off script; for anything large or repeatable, just use &lt;code&gt;pandas&lt;/code&gt; or &lt;code&gt;jq&lt;/code&gt; and move on.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;iLovePDF&lt;/strong&gt; and &lt;strong&gt;Smallpdf&lt;/strong&gt; both cover the PDF conversions well. I'll often reach for whatever's already open in a tab.&lt;/p&gt;

&lt;h2&gt;
  
  
  A few honest caveats
&lt;/h2&gt;

&lt;p&gt;Browser tools are great, but know their limits:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Privacy:&lt;/strong&gt; anything you upload leaves your machine. Don't put confidential contracts, customer data, or anything under NDA through a random web tool. Check the deletion policy first — some auto-delete uploads within an hour, some are vaguer about it. For sensitive files, prefer a local CLI (&lt;code&gt;qpdf&lt;/code&gt;, &lt;code&gt;ghostscript&lt;/code&gt;, &lt;code&gt;ImageMagick&lt;/code&gt;, &lt;code&gt;ffmpeg&lt;/code&gt;) that never sends bytes anywhere.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Scriptability:&lt;/strong&gt; if a task repeats, automate it. A web UI is for one-offs; for the tenth time, write the script.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Free tiers:&lt;/strong&gt; "free" sometimes means a couple of files a day or a watermark. Read before you rely on it for a deadline.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  A quick reference list
&lt;/h2&gt;

&lt;p&gt;Tasks → what I tend to grab:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;PDF too big to email → any browser compressor, "medium" level, eyeball the result&lt;/li&gt;
&lt;li&gt;PDF → editable text → a PDF-to-Word converter, then fix tables by hand&lt;/li&gt;
&lt;li&gt;Transparent background → automatic remover for speed, Photopea for fiddly edges&lt;/li&gt;
&lt;li&gt;Spreadsheet ↔ JSON → browser converter for small one-offs, &lt;code&gt;pandas&lt;/code&gt;/&lt;code&gt;jq&lt;/code&gt; for real pipelines&lt;/li&gt;
&lt;li&gt;Compress/convert video → an in-browser video tool for short clips, &lt;code&gt;ffmpeg&lt;/code&gt; for batches&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Sign-off
&lt;/h2&gt;

&lt;p&gt;There's no magic here — these are all variations on "upload, click, download." The point is just to not lose 20 minutes installing software for a job that takes seconds. Keep a couple of these bookmarked, keep a local CLI around for anything private or repeatable, and you'll rarely get stuck.&lt;/p&gt;

&lt;p&gt;If you've got a go-to tool I didn't mention, drop it in the comments — I'm always swapping mine out.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>productivity</category>
      <category>tools</category>
      <category>opensource</category>
    </item>
  </channel>
</rss>
