Image Load Lab

Browser Image Tools

Two browser tools that run on your device: an image optimizer and a srcset builder, with worked examples and measured limits.

Image Load Lab has two small tools that run entirely in your browser. They exist so you can repeat, on your own images, the kind of decisions our guides measure: how much a photo shrinks at a given width and quality, and what srcset markup a layout needs. Neither tool uploads anything: we recorded every network request each tool makes while processing an image, and none of them sends the file or its contents to our server.

Image optimizer

Choose a JPEG, PNG or WebP file, set a maximum width and a quality, and the optimizer re-encodes it with your browser’s own encoder, shows the before and after size, and lets you download the result. It is useful for a quick, private export of a single image, for example before uploading a photo to WordPress.

A real example from our tests: a 4160 × 4160 CC0 photo of a cup of coffee (1,258,883 bytes) resized to 1200 pixels became 82,862 bytes as JPEG at quality 80, 38,334 bytes as WebP at 80 and 26,724 bytes as WebP at 60. Most of that saving comes from the resize; the format and quality choice then decide the rest.

What it cannot do: it uses the browser’s encoder, which in our canvas encoder test produced JPEGs 18 % larger than MozJPEG at the same visual quality, and it does not offer AVIF: when we asked Chrome 155 for an AVIF file from a canvas, it silently returned a PNG instead.

Srcset builder

Enter a base file name, the candidate widths you plan to export, a sizes rule and the original dimensions, and the builder writes the complete <img> markup with srcset, sizes, width and height. It also estimates each candidate’s file size from its pixel area.

That estimate is a rough guide, and we measured how rough: on 13 of our test photos, the estimate for the 480-pixel WebP files was a median 33 % too low. Smooth images such as sky and sand land close to the estimate; busy, detailed images do not. Use the builder for markup, and measure real files for byte budgets.

Which tool for which job

  • “How small can this one photo get?” Use the optimizer, then compare the output at 100 % zoom with the original.
  • “What markup do I put in my template?” Use the srcset builder, with widths taken from your layout as described in our srcset and sizes test.
  • “Which format and quality should my whole site use?” Neither tool answers that on one image. Read the format comparison and our WebP quality test, which measure 20 or more images.

Privacy and limits

Both tools work offline once the page has loaded. Files you open stay on your device unless you download the result yourself. Results depend on your browser and its version: record both when you compare outputs. The tools are provided as they are; keep your original files.