Repository navigation
Local poster generation during video upload #79366
Description
What problem does this address?
When a user uploads a video, the page has no poster image to show until the video itself loads, so the video area can render blank/late and hurt perceived performance and layout stability. Generating a poster image locally from the video's first frame during upload lets pages render meaningful content before the video finishes loading.
Anne called this out for the 7.1 cycle ("local poster generation during video upload so pages can render before a video finishes loading").
Approach
The original assumption was that we could reuse the poster-generation step from the GIF-to-video work (#76942 / #78410). In practice that step runs vips on a GIF's first frame (a still-image decode) and cannot decode a real video, so there was no reusable video-frame extractor to build on. Instead, a small, dependency-free video first-frame extractor was added (the approach proven in swissspidy/media-experiments), implemented independently on trunk.
In @wordpress/upload-media:
- A new
poster-utils.tswithgetPosterFromVideo()loads the video, seeks slightly past the start (to avoid an empty first frame), draws it to anOffscreenCanvas, and returns a JPEGFile. No new dependencies. - Two new pipeline operations,
AddPosterandUploadPoster. For video uploads,prepareItemqueuesAddPoster -> Upload -> UploadPoster:addPosterForItemgenerates the poster (best-effort).uploadPosterForItemuploads the poster as its own image attachment and pushes its URL to the block viaonChange, setting the block'sposterattribute. The poster upload runs independently so the video item completes immediately.
- In
@wordpress/block-library, the Video block'sonSelectVideonow readsmedia.posterin addition to the media-librarymedia.image.src.
Frame extraction is fully guarded: an unplayable codec, a seek timeout, or a missing canvas context results in no poster and a normal upload.
Acceptance criteria
- Regular video uploads generate a local poster from the first frame during upload
- Generated poster is sideloaded and applied to the video block automatically
- Graceful fallback when the browser cannot extract a frame
- e2e coverage
Notes
- Rather than reusing the Add animated GIF to web video conversion #76942 poster step (not feasible, see above), a dedicated video-frame extractor was added.
- Linking the poster as the video attachment's
featured_media(so it is also exposed via the REST API / media library) is left as a follow-up:@wordpress/upload-mediadelegates all server I/O to injectedsettingscallbacks and has no direct REST dependency, and the poster already persists via the block'sposterattribute in post content.
Metadata
Metadata
Assignees
Labels
Type
Projects
- StatusShow more project fields🦵 Punted to 7.3
Activity
[-]Client Side Media: Local poster generation during video upload[/-][+]Local poster generation during video upload[/+]adamsilverstein commentedon Jul 13, 2026
Punting from 7.1.
swissspidy commentedon Aug 21, 2026
Related: #79364 (regenerate/optimize an existing video as well as its poster image)