Skip to main content

filter · Image filters

Resize images for mobile (resize_mobile_images)

Category:
Image
CoreFilters:
No
OptimizeForBandwidth:
No
Risk:
Test first

resize_mobile_images serves smaller images to mobile devices based on the User-Agent header. Enabling it also enables inline_preview_images, which it depends on.

When to use it

  • Not in CoreFilters: it runs only when you enable it by name.
  • Risk rating on these docs: Test first.

Risks

  • Inlining increases HTML size. Inlined images are not cached separately by the browser. Set ImageInlineMaxBytes conservatively.

  • resize_mobile_images relies on User-Agent detection. Incorrect UA classification can serve wrong-sized images. It also pulls in inline_preview_images, so expect that filter’s placeholder-then-swap behavior when enabling it.

Configuration

Enable it in the module configuration, at server, virtual-host or location scope:

Apache

ModPagespeedEnableFilters resize_mobile_images

nginx

pagespeed EnableFilters resize_mobile_images;

IIS (pagespeed.config)

pagespeed EnableFilters resize_mobile_images
ParameterDefaultDescription
ImageInlineMaxBytes3072Maximum image size in bytes to inline as a data: URI

Scoping, ForbidFilters and the thresholds filters read: Choosing filters .

Live example

Serves smaller low-quality placeholders to mobile browsers, then the full image.

This filter changes how the page is structured or delivered, not its size, so the example shows a source diff rather than a byte or request reduction.

See the before and after, with the source diff →

Frequently asked questions

What does the resize_mobile_images filter do?
resize_mobile_images serves smaller images to mobile devices based on the User-Agent header. Enabling it also enables inline_preview_images, which it depends on.
Is resize_mobile_images enabled by default?
No. resize_mobile_images is not in CoreFilters, the default RewriteLevel; it runs only when you enable it by name with EnableFilters.
How do I enable resize_mobile_images on Apache and nginx?
Add ModPagespeedEnableFilters resize_mobile_images on Apache or pagespeed EnableFilters resize_mobile_images; on nginx. On IIS, add pagespeed EnableFilters resize_mobile_images to pagespeed.config.

This page is drawn from the resize_mobile_images entry on Image filters. Every filter in one table: PageSpeed filters.

Search