-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Labels
[Feature] Client Side MediaMedia processing in the browser with WASMMedia processing in the browser with WASM[Status] In ProgressTracking issues with work in progressTracking issues with work in progress[Type] EnhancementA suggestion for improvement.A suggestion for improvement.
Description
Summary
There are currently no performance benchmarks for client-side media image processing in Gutenberg's performance test suite. As discussed in #76752 (comment), having tracked metrics would help catch regressions and validate optimizations — particularly for expensive formats like AVIF.
Proposal
Add a new performance test that measures the time to decode and encode (generate) all sub-size images for each supported format:
- JPEG
- WebP
- AVIF
The test should exclude upload time and only measure the client-side image processing pipeline: decode → resize to all registered sub-sizes → encode.
Implementation details
- Add a new performance test spec (e.g.,
test/performance/specs/media-processing.spec.js) following the pattern established in existing specs likepost-editor.spec.js. - Load a test image for each format and run the sub-size generation pipeline using
@wordpress/vips/@wordpress/upload-media. - Record processing duration per format as new metrics.
- Add the new metrics to the performance reporter (
test/performance/config/performance-reporter.ts) and the codevitals logging script (bin/log-performance-results.js) so results are tracked on https://codevitals.run/public/WordPress/gutenberg/metrics.
Key files
test/performance/config/performance-reporter.ts— metric type definitions and reportertest/performance/specs/post-editor.spec.js— example performance test patternbin/log-performance-results.js— codevitals.run integrationpackages/vips/src/index.ts— image processing (resizeImage,batchResizeImage)packages/upload-media/src/store/private-actions.ts— sub-size generation orchestration
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
[Feature] Client Side MediaMedia processing in the browser with WASMMedia processing in the browser with WASM[Status] In ProgressTracking issues with work in progressTracking issues with work in progress[Type] EnhancementA suggestion for improvement.A suggestion for improvement.
Type
Fields
Give feedbackNo fields configured for Task.