HTML5 Video Element & OffscreenCanvas Decoding
By setting the currentTime property on a detached <video> element and listening for the seeked event, client-side JavaScript extracts the exact pixel matrix at any arbitrary millisecond.
Drawing the video buffer onto an OffscreenCanvas or 2D canvas context using drawImage(video, 0, 0) enables instantaneous export to lossless 32-bit PNG or lightweight WebP.
GIF Frame Parsing via Binary Netpbm/LZW Decoders
Animated GIFs do not use standard video keyframes; they use sequential graphics control blocks with disposal methods (restore to background, do not dispose).
A client-side GIF parser decodes each LZW compressed image descriptor and maintains an internal accumulator canvas to accurately render transparency layers without ghosting artifacts.
Step-by-Step Tutorial
Load Video File Locally
Select your MP4, WebM, or GIF file via the local browser file picker (no files are transmitted over the network).
Set Frame Sampling Rate
Choose between extracting every frame (e.g. 30 fps), sampling 1 frame per second, or capturing a specific timestamp.
Export Image Zip Archive
Download all extracted sequential frames packaged neatly into a single ZIP archive.
Ready to Try It Yourself?
DocSwift processes everything directly on your device. Fast, safe, and completely free forever.
How helpful was this guide?
Rated 4.9 / 5 by 3,420+ users worldwide
Share with Colleagues & Friends
Help others protect their document privacy
Frequently Asked Questions
Can I extract 4K frames in the browser?
Yes! Because the browser leverages your local GPU hardware acceleration, decoding 4K (3840x2160) frames is fast and bounded only by your computer RAM.
Are private recordings uploaded to DocSwift servers?
No. The entire decoding, seeking, and PNG rendering pipeline runs 100% locally in your browser memory.