Put your media
in motion.
Point ef-video at a video file in your storage. Editframe makes playback segments as the playhead needs them, so the file does not have to be transcoded first.
Film outline
- Your original file stays in your bucket. A 2.71 GB, 3840 × 2160 file keeps its storage URL. ef-video points at that URL, and the variants endpoint plans 2-second play segments and 30-second scrub windows without encoding anything.
- Segments are made just ahead of the playhead. Each segment reads one slice of the source, widened to the nearest keyframes, and becomes a 1080p segment as the playhead approaches, like track laid in front of a moving train.
- A far seek shows a coarse proxy first. Dragging the scrubber to 1:24 pulls a 30-second, 320-pixel scrub window, then the 2-second play segment for that position replaces it.
- A replay comes from cache. Segments that already exist are reused. Nothing is read from the bucket or encoded again.
- The video plays in your product. Daybreak's title and synced captions play over the master, and playback requests carry a token your server signed.
From URL to usable playback.
Set api-host on ef-configuration and point ef-video at the file's URL. The composition decides where the clip appears and which part of the source plays.
Playback uses 2-second segments at up to 1080p. Scrubbing uses 30-second windows at 320 pixels, so a far seek shows a frame before the full segment arrives. Each segment reads only its slice of the file, widened to the nearest keyframes, and is cached, so a replay does not encode it again.
<ef-configuration api-host="https://editframe.com">
<ef-timegroup mode="fixed" duration="8s">
<ef-video
src="https://cdn.example.com/interview.mov"
sourcein="2s"
sourceout="10s"
></ef-video>
</ef-timegroup>
</ef-configuration>Drag the scrubber. The title and the footage share one clock.
Keep files where they already are.
Use an HTTPS URL from the storage your product already has, and keep its access policy. To keep sources and renders in one API, upload to Editframe Files and reference the upload with file-id. Uploaded files are prepared for playback once, when they arrive.
Sign media URLs on your server.
Set signing-url on ef-configuration and the player asks your server for a token before it requests media. Your route checks that the viewer may see the URL, then signs it with the API key that never leaves the server.
Each token covers one URL and expires after an hour. The same flow protects video, image, and caption files.
URL signing docs →// Your server: check access, then sign.
import { Client, createURLToken } from "@editframe/api"
const client = new Client(process.env.EDITFRAME_API_KEY)
app.post("/sign-url", async (req, res) => {
if (!canView(req.user, req.body.url)) return res.sendStatus(403)
const token = await createURLToken(client, req.body.url)
res.json({ token })
})<ef-configuration signing-url="/sign-url">
<ef-video src="https://cdn.example.com/interview.mov"></ef-video>
</ef-configuration>Start from a study in the motion catalog.
Browse all studies ↗
Add video
to your timeline.
Start with one ef-video and the URL of a file you already store.