Use Nginx and mod_pagespeed to Convert Images to WebP on the Fly

Mon, 07 Oct 2019 10:35:22 +0800

Use Nginx and mod_pagespeed to Convert Images to WebP on the Fly

Compile ngx_pagespeed

First make sure Nginx is built with --with-compat, so we do not need to rebuild Nginx from scratch.

incubator: https://github.com/apache/incubator-pagespeed-ngx.git

# Switch to the nginx source directory and configure the build
./configure --with-compat --add-dynamic-module=../incubator-pagespeed-ngx

# Build modules
make modules

# Copy the built module into the nginx modules directory
sudo cp objs/ngx_pagespeed.so /etc/nginx/modules/

# Create the cache directory for converted images
sudo mkdir -p /var/ngx_pagespeed_cache
sudo chown -R www-data:www-data /var/ngx_pagespeed_cache

load_module modules/ngx_pagespeed.so;


# enable pagespeed module on this server block
pagespeed on;

# Needs to exist and be writable by nginx. Use tmpfs for best performance.
pagespeed FileCachePath /var/ngx_pagespeed_cache;

# Ensure requests for pagespeed optimized resources go to the pagespeed handler
# and no extraneous headers get set.
location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
 add_header "" "";
}
location ~ "^/pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon$" { }

pagespeed RewriteLevel CoreFilters;

The last line (pagespeed RewriteLevel CoreFilters;) specifies the enabled optimizations. It includes basic filters such as:

Webp on Ricky

Use Nginx and mod_pagespeed to Convert Images to WebP on the Fly

Compile ngx_pagespeed