buoy_images

Image debugger for Flutter — part of the Buoy devtools suite.

A live registry of every image the app loads through BuoyImage: cache verdict (memory / disk / network), load timing, decoded-vs-displayed oversize audit (are you decoding a 4K bitmap into a 120pt thumbnail?), estimated decoded / wasted memory, and a failure log with the HTTP status where available. Per-image hard reload / retry and simulation overrides (force error / loading / blank / URL swap, plus app-wide offline / cold-start / blank-images modes) let you reproduce image bugs on device. Streams live to Buoy Desktop and the MCP server (get_images, image_action, set_image_simulation).

Image HTTP traffic in Flutter is fetched by dart:io image loaders and never surfaces the layout size or cache origin the network inspector needs — this tool is the visibility layer for images.

Why a widget wrapper?

Flutter has no app-wide Image decorator hook (unlike React Native's unstable_setImageComponentDecorator). Capture is therefore opt-in at the widget level: use BuoyImage in place of Image / CachedNetworkImage. It wraps your ImageProvider, measures the rendered box for the oversize audit, and owns the props so reload/retry and simulations work.

BuoyImage(
  provider: CachedNetworkImageProvider(url), // or NetworkImage(url), AssetImage(...)
  width: 140,
  height: 140,
  fit: BoxFit.contain,
  placeholder: (context) => const CircularProgressIndicator(),
  errorWidget: (context, error) => const Icon(Icons.broken_image),
)

Registration is automatic when you mount the BuoyDevTools umbrella widget; call registerBuoyImages() once before runApp to wire it standalone.

Debug builds only — release builds render the child untouched.

Libraries

buoy_images
Buoy Images tool for Flutter.