jamey/berrypod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

feat: enhance image optimization with on-demand JPEG fallbacks

Browse Source 
Improve the image optimization pipeline with better compression and
smarter variant generation:

- Change to_lossless_webp → to_optimized_webp (lossy, quality 90)
- Auto-resize uploads larger than 2000px to save storage
- Skip pre-generating JPEG variants (~50% disk savings)
- Add on-demand JPEG generation for legacy browsers (<5% of users)
- Add /images/:id/variant/:width route for dynamic serving
- Add VariantCache to supervision tree for startup validation
- Add image_cache to static paths for disk-based serving

The pipeline now stores smaller WebP sources and generates AVIF/WebP
variants upfront, with JPEG generated only when legacy browsers request it.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Jamey Greenwood
2026-01-25 00:33:09 +00:00
parent 252ca2268a
commit 2bc05097b9
11 changed files with 610 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
test/simpleshop_theme/images/optimize_worker_test.exs Normal file
View File

@@ -0,0 +1,51 @@
defmodule SimpleshopTheme.Images.OptimizeWorkerTest do
use SimpleshopTheme.DataCase, async: false
use Oban.Testing, repo: SimpleshopTheme.Repo
alias SimpleshopTheme.Images.OptimizeWorker
import SimpleshopTheme.ImageFixtures
setup do
cleanup_cache()
on_exit(&cleanup_cache/0)
:ok
end
describe "perform/1" do
test "processes image and generates variants" do
image = image_fixture(%{source_width: 1200, source_height: 800})
assert :ok = perform_job(OptimizeWorker, %{image_id: image.id})
# Verify pre-generated variants were created (AVIF and WebP only, not JPEG)
for w <- [400, 800, 1200], fmt <- [:avif, :webp] do
assert File.exists?(cache_path(image.id, w, fmt))
end
# JPEG is generated on-demand, not pre-generated
refute File.exists?(cache_path(image.id, 400, :jpg))
end
test "cancels for missing image" do
assert {:cancel, :image_not_found} =
perform_job(OptimizeWorker, %{image_id: Ecto.UUID.generate()})
end
test "skips SVG images" do
image = svg_fixture()
assert :ok = perform_job(OptimizeWorker, %{image_id: image.id})
end
end
describe "enqueue/1" do
test "inserts and executes job (inline mode)" do
image = image_fixture(%{source_width: 1200, source_height: 800})
# In inline test mode, job executes immediately
assert {:ok, %Oban.Job{state: "completed"}} = OptimizeWorker.enqueue(image.id)
# Verify variants were created (job ran inline)
assert File.exists?(cache_path(image.id, 400, :avif))
end
end
end

66
test/simpleshop_theme/images/optimizer_test.exs
View File

@@ -26,9 +26,9 @@ defmodule SimpleshopTheme.Images.OptimizerTest do
end
end
describe "to_lossless_webp/1" do
describe "to_optimized_webp/1" do
test "converts image and returns dimensions" do
{:ok, webp, width, height} = Optimizer.to_lossless_webp(sample_jpeg())
{:ok, webp, width, height} = Optimizer.to_optimized_webp(sample_jpeg())
assert is_binary(webp)
assert width == 1200
@@ -37,28 +37,47 @@ defmodule SimpleshopTheme.Images.OptimizerTest do
assert <<"RIFF", _size::binary-size(4), "WEBP", _::binary>> = webp
end
test "resizes images larger than 2000px" do
# Create a large test image by scaling up
{:ok, image} = Image.open("test/fixtures/sample_1200x800.jpg")
{:ok, large} = Image.thumbnail(image, 3000)
{:ok, large_data} = Image.write(large, :memory, suffix: ".jpg")
{:ok, webp, width, height} = Optimizer.to_optimized_webp(large_data)
assert is_binary(webp)
assert width == 2000
# Height should be proportionally scaled
assert height <= 2000
end
test "returns error for invalid data" do
assert {:error, _} = Optimizer.to_lossless_webp("not an image")
assert {:error, _} = Optimizer.to_optimized_webp("not an image")
end
end
describe "process_for_image/1" do
test "generates all variants for 1200px image" do
test "generates AVIF and WebP variants for 1200px image" do
image = image_fixture(%{source_width: 1200, source_height: 800})
assert {:ok, [400, 800, 1200]} = Optimizer.process_for_image(image.id)
for w <- [400, 800, 1200], fmt <- [:avif, :webp, :jpg] do
# Only AVIF and WebP are pre-generated (JPEG is on-demand)
for w <- [400, 800, 1200], fmt <- [:avif, :webp] do
assert File.exists?(cache_path(image.id, w, fmt)),
"Missing #{w}.#{fmt}"
end
# JPEG should NOT be pre-generated
refute File.exists?(cache_path(image.id, 400, :jpg))
# Thumbnail is still pre-generated as JPEG
assert File.exists?(cache_path(image.id, "thumb", :jpg))
end
test "generates only applicable widths for smaller image" do
# Create fixture with smaller source width
{:ok, webp, _w, _h} = Optimizer.to_lossless_webp(sample_jpeg())
{:ok, webp, _w, _h} = Optimizer.to_optimized_webp(sample_jpeg())
image =
%SimpleshopTheme.Media.Image{}
@@ -106,10 +125,11 @@ defmodule SimpleshopTheme.Images.OptimizerTest do
end
describe "disk_variants_exist?/2" do
test "returns true when all variants exist" do
test "returns true when all pre-generated variants exist" do
image = image_fixture(%{source_width: 1200, source_height: 800})
{:ok, _} = Optimizer.process_for_image(image.id)
# Should return true even without JPEG (only checks AVIF/WebP)
assert Optimizer.disk_variants_exist?(image.id, 1200)
end
@@ -118,4 +138,36 @@ defmodule SimpleshopTheme.Images.OptimizerTest do
refute Optimizer.disk_variants_exist?(image.id, 1200)
end
end
describe "generate_jpeg_on_demand/3" do
test "generates JPEG variant and caches to disk" do
image = image_fixture(%{source_width: 1200, source_height: 800})
# JPEG shouldn't exist yet
refute File.exists?(cache_path(image.id, 400, :jpg))
# Generate on-demand
{:ok, path} = Optimizer.generate_jpeg_on_demand(image.data, image.id, 400)
assert File.exists?(path)
assert path == cache_path(image.id, 400, :jpg)
end
test "returns cached path if JPEG already exists" do
image = image_fixture(%{source_width: 1200, source_height: 800})
# Generate first time
{:ok, path1} = Optimizer.generate_jpeg_on_demand(image.data, image.id, 800)
{:ok, %{mtime: mtime1}} = File.stat(path1)
Process.sleep(1100)
# Generate second time - should return cached
{:ok, path2} = Optimizer.generate_jpeg_on_demand(image.data, image.id, 800)
{:ok, %{mtime: mtime2}} = File.stat(path2)
assert path1 == path2
assert mtime1 == mtime2, "File was regenerated instead of cached"
end
end
end

42
test/simpleshop_theme_web/controllers/image_controller_test.exs
View File

@@ -3,8 +3,10 @@ defmodule SimpleshopThemeWeb.ImageControllerTest do
alias SimpleshopTheme.Media
# Minimal valid PNG (1x1 transparent pixel)
@png_binary <<137, 80, 78, 71, 13, 10, 26, 10>>
@svg_content ~s(<svg xmlns="http://www.w3.org/2000/svg"><circle fill="#000000" r="10"/></svg>)
@sample_jpeg File.read!("test/fixtures/sample_1200x800.jpg")
describe "show/2" do
test "returns 404 for non-existent image", %{conn: conn} do
@@ -13,19 +15,21 @@ defmodule SimpleshopThemeWeb.ImageControllerTest do
end
test "serves image with proper content type and caching headers", %{conn: conn} do
# Upload a real JPEG which gets converted to WebP
{:ok, image} =
Media.upload_image(%{
image_type: "logo",
filename: "test.png",
content_type: "image/png",
file_size: byte_size(@png_binary),
data: @png_binary
filename: "test.jpg",
content_type: "image/jpeg",
file_size: byte_size(@sample_jpeg),
data: @sample_jpeg
})
conn = get(conn, ~p"/images/#{image.id}")
assert response(conn, 200) == @png_binary
assert get_resp_header(conn, "content-type") == ["image/png; charset=utf-8"]
assert response(conn, 200)
# Image is converted to WebP for storage
assert get_resp_header(conn, "content-type") == ["image/webp; charset=utf-8"]
assert get_resp_header(conn, "cache-control") == ["public, max-age=31536000, immutable"]
assert get_resp_header(conn, "etag") == [~s("#{image.id}")]
end
@@ -37,7 +41,27 @@ defmodule SimpleshopThemeWeb.ImageControllerTest do
assert response(conn, 404) =~ "Image not found"
end
test "falls back to full image when no thumbnail available", %{conn: conn} do
test "generates thumbnail on-demand and serves as JPEG", %{conn: conn} do
# Upload a real image to test thumbnail generation
{:ok, image} =
Media.upload_image(%{
image_type: "logo",
filename: "test.jpg",
content_type: "image/jpeg",
file_size: byte_size(@sample_jpeg),
data: @sample_jpeg
})
conn = get(conn, ~p"/images/#{image.id}/thumbnail")
assert response(conn, 200)
# Thumbnail is served as JPEG
assert get_resp_header(conn, "content-type") == ["image/jpeg; charset=utf-8"]
assert get_resp_header(conn, "cache-control") == ["public, max-age=31536000, immutable"]
end
test "falls back to full image when image data is invalid", %{conn: conn} do
# This uses an invalid PNG header that can't be processed
{:ok, image} =
Media.upload_image(%{
image_type: "logo",
@@ -49,8 +73,8 @@ defmodule SimpleshopThemeWeb.ImageControllerTest do
conn = get(conn, ~p"/images/#{image.id}/thumbnail")
assert response(conn, 200) == @png_binary
assert get_resp_header(conn, "content-type") == ["image/png; charset=utf-8"]
# Falls back to WebP since that's what we tried to convert to
assert response(conn, 200)
end
end

2
test/support/fixtures/image_fixtures.ex
View File

@@ -11,7 +11,7 @@ defmodule SimpleshopTheme.ImageFixtures do
def sample_jpeg, do: @sample_jpeg
def image_fixture(attrs \\ %{}) do
{:ok, webp, w, h} = SimpleshopTheme.Images.Optimizer.to_lossless_webp(@sample_jpeg)
{:ok, webp, w, h} = SimpleshopTheme.Images.Optimizer.to_optimized_webp(@sample_jpeg)
defaults = %{
image_type: "product",