<?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: Fang Ji</title>
    <description>The latest articles on DEV Community by Fang Ji (@fgghyyfk).</description>
    <link>https://dev.to/fgghyyfk</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%2F4091770%2F7d36313d-801c-475a-ab26-2c198ae8d168.jpg</url>
      <title>DEV Community: Fang Ji</title>
      <link>https://dev.to/fgghyyfk</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/fgghyyfk"/>
    <language>en</language>
    <item>
      <title>Browser-local image tools: how to check the upload boundary</title>
      <dc:creator>Fang Ji</dc:creator>
      <pubDate>Fri, 06 Nov 2026 05:34:44 +0000</pubDate>
      <link>https://dev.to/fgghyyfk/browser-local-image-tools-how-to-check-the-upload-boundary-59ol</link>
      <guid>https://dev.to/fgghyyfk/browser-local-image-tools-how-to-check-the-upload-boundary-59ol</guid>
      <description>&lt;h2&gt;Browser-local image tools: how to check the upload boundary&lt;/h2&gt;

&lt;p&gt;This guide comes from the ImgIng project. It explains how to evaluate an image tool's processing path; it is not an independent security audit or a comparison of compression performance.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimging.cn%2Fassets%2Fog-cover-en.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimging.cn%2Fassets%2Fog-cover-en.png" alt="ImgIng official English product cover" width="800" height="420"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A browser interface does not tell you where a file is processed. A web app might run a codec on your device, send the source to a service, or combine both paths. The useful question is more specific than “is this website private?”: &lt;strong&gt;what does this selected operation send, receive, and save?&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;Separate the operation from the product name&lt;/h2&gt;

&lt;p&gt;ImgIng's published documentation describes common image-processing routes as local to the browser. It also documents specialist-server exceptions. Reading an existing HEIC photo is a different operation from exporting a new HEIC file, for example. A local compression workflow does not establish that every conversion offered by the same site is local.&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;&lt;tr&gt;
&lt;th&gt;Selected task&lt;/th&gt;
&lt;th&gt;Published processing boundary&lt;/th&gt;
&lt;th&gt;What to check before using it&lt;/th&gt;
&lt;/tr&gt;&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Common-format image compression and supported local exports&lt;/td&gt;
&lt;td&gt;Described by ImgIng as browser-local&lt;/td&gt;
&lt;td&gt;The actual input, chosen output, and notice in that workflow&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;HEIC writing, TIFF, JPEG 2000, or exporting images to PDF&lt;/td&gt;
&lt;td&gt;May use a labelled specialist server&lt;/td&gt;
&lt;td&gt;Whether this operation uploads material and whether that fits your requirements&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Compressing an existing PDF&lt;/td&gt;
&lt;td&gt;Described as local; different from creating a PDF from images&lt;/td&gt;
&lt;td&gt;The PDF's supported features and the saved result&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;HTML to PDF&lt;/td&gt;
&lt;td&gt;Has a server-side rendering path&lt;/td&gt;
&lt;td&gt;The conversion notice rather than a general local-processing claim&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;These are documented boundaries, not measurements performed for this post. Check the current tool notice because file type, output choice, and product changes can affect the route.&lt;/p&gt;

&lt;h2&gt;A download is not the same event as an upload&lt;/h2&gt;

&lt;p&gt;A local application still needs its page, scripts, and other assets. Some workflows also download a codec or a machine-learning model before processing can start. Network activity alone therefore does not prove that the source image left the device. Conversely, finding one local worker does not prove that another part of the workflow never sends data.&lt;/p&gt;

&lt;p&gt;Squoosh provides another useful distinction: its official README describes local compression, while separately disclosing analytics. Local image processing and the absence of all telemetry are different claims. Evaluate each requirement separately.&lt;/p&gt;

&lt;h2&gt;Inspect a small, permission-cleared example&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Choose a non-sensitive image you own or are allowed to use. Keep an unchanged original.&lt;/li&gt;
&lt;li&gt;Open the browser's Network panel before loading the workflow. Record the browser version, page, date, and selected task.&lt;/li&gt;
&lt;li&gt;Run that one operation. Distinguish document, script, codec, and model downloads from requests carrying file or image content. Inspect payloads where the browser makes them available.&lt;/li&gt;
&lt;li&gt;Repeat after assets are cached, recording the difference. Do not turn one apparently quiet run into a claim covering every format or feature.&lt;/li&gt;
&lt;li&gt;Save and reopen the output. Confirm dimensions, format, transparency, text legibility, and the details that matter to the intended use.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Browser inspection can provide observations for a particular run; it is not a complete security audit. If your organization restricts uploads, follow those handling rules and verify the selected route before using confidential material.&lt;/p&gt;

&lt;h2&gt;Record output quality separately&lt;/h2&gt;

&lt;p&gt;For compression comparisons, retain the input and output files, actual byte sizes, dimensions, format, exposed quality settings, errors, and unsupported cases. Compare equivalent tasks: PNG-to-PNG optimization and converting PNG to WebP answer different questions. Smaller files can still lose detail or behave differently in the destination workflow.&lt;/p&gt;

&lt;p&gt;The aim is a reproducible decision about a concrete job, with the data path and output quality evaluated independently. You can explore &lt;a href="https://imging.ai/" rel="noopener noreferrer"&gt;ImgIng&lt;/a&gt; using a permission-cleared example and the current operation notices.&lt;/p&gt;

&lt;h2&gt;Sources&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://imging.ai/en/privacy/" rel="noopener noreferrer"&gt;ImgIng: local image processing and privacy architecture&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://imging.ai/en/llms.txt" rel="noopener noreferrer"&gt;ImgIng English product summary&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/GoogleChromeLabs/squoosh" rel="noopener noreferrer"&gt;Squoosh official repository and README&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Sources checked on November 6, 2026. Product statements are attributed to their publishers. No new compression benchmark, file-handling test, or security-audit result is presented here.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>showdev</category>
    </item>
    <item>
      <title>I built an image toolbox that keeps common processing inside the browser</title>
      <dc:creator>Fang Ji</dc:creator>
      <pubDate>Tue, 25 Aug 2026 03:50:40 +0000</pubDate>
      <link>https://dev.to/fgghyyfk/i-built-an-image-toolbox-that-keeps-common-processing-inside-the-browser-oob</link>
      <guid>https://dev.to/fgghyyfk/i-built-an-image-toolbox-that-keeps-common-processing-inside-the-browser-oob</guid>
      <description>&lt;p&gt;I work with product images every day. The usual workflow was surprisingly annoying: one site for compression, another for format conversion, another for background removal, and another for animated images. Most of them required uploading the original file.&lt;/p&gt;

&lt;p&gt;So I built Imging as a local-first browser tool. Common image work stays on the device: JPG, PNG, WebP, AVIF and HEIC conversion, compression, background removal, and GIF/APNG/animated WebP editing. Larger codecs and models load only when a feature needs them.&lt;/p&gt;

&lt;p&gt;The main engineering lesson was that “runs in the browser” is not one capability. Decoding, canvas processing, encoding, WebGPU inference, WASM fallback, memory limits and file saving all fail independently. I now test each capability instead of assuming support from the browser name.&lt;/p&gt;

&lt;p&gt;Background removal prefers WebGPU and falls back to WASM. Animated images go through a frame pipeline so timing and loop information can be kept while frames are edited or recompressed. PDF compression rewrites the document structure instead of turning every page into a large bitmap.&lt;/p&gt;

&lt;p&gt;There are still honest limits. Some uncommon formats cannot be handled completely in the browser, mobile memory is tight for large animations, and HEIC files are not always consistent. The tool reports those cases instead of pretending every operation is local.&lt;/p&gt;

&lt;p&gt;Imging is free to use without an account or watermark:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://imging.cn/en/" rel="noopener noreferrer"&gt;https://imging.cn/en/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I used AI-assisted coding during development, but the capability checks, processing boundaries and validation cases came from the actual product-image workflow.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>showdev</category>
      <category>tools</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
