Source

# Record

Record is free screen and camera recording in the browser with no time limit, and a free alternative to Loom. It is an OpenApp in the OpenApps free apps store (https://openapps.free/), owned by the OpenApps team.

## What it promises

- Recordings never leave the person's device. Nothing is uploaded: no server step, no analytics on recordings. Never add a feature that sends a recording or its contents anywhere without the person choosing it.
- Free, with no time limit, no cap on videos, no watermark, no account and no paid tier. Never add a cap, an upsell or tracking.
- Honest about sharing: Record does not host videos. The page says how to share the file (any drive, chat or email). Hosting with share links may come later, charged at cost, and must say so.
- A recording in progress survives a closed or crashed tab: its pieces are saved as the browser hands them over (every second or two) and put back together on the next visit, minus the last few seconds.

## What it does

Three modes: Screen (the screen, a window or a tab via getDisplayMedia, with an optional camera bubble in a corner the person picks and can move while recording), Camera (a talking-head clip), and Audio (microphone only). Microphone on or off; screen sound where the browser shares it (Chrome and Edge). A three second countdown, pause and resume, a timer (also in the tab title), stop from the page or the browser's sharing bar. After recording: watch, rename, trim the start and the end (saved as a copy; the original stays), download MP4 or WebM, delete. "Your recordings" lists everything kept on the device with length and size.

Phones get Camera and Audio only, because phone browsers cannot capture the screen; the page says so and points to the phone's own screen recorder.

## How it is built

- `index.html` is the static landing page that search engines and AI crawlers read. Keep its copy, comparison, FAQ and JSON-LD in sync with what the app does.
- `src/Recorder.tsx` is the whole tool: setup, countdown, recording, saving, review with the trim timeline, and the recordings list (rendered into `#library` under the hero). `body.app-mode` hides the landing sections while recording or reviewing.
- `src/lib/capture.ts` opens the devices, mixes sound and records with the browser's MediaRecorder (pieces every second, a key frame every 2 seconds, because Chrome hands over MP4 data only at key frames). The screen picker is opened first because browsers only allow it straight after a click. A single sound source is recorded as it is; only the microphone plus screen sound are mixed with Web Audio, so a sound system that never starts cannot silence a recording. The camera bubble is drawn on a canvas 30 times a second, driven by a worker (`src/lib/tick.ts`) because browsers slow page timers while the tab is in the background, which it is while someone records another window.
- `src/lib/media.ts` uses Mediabunny (1.61.0, MPL-2.0, loaded only when needed) to rewrite each finished recording without re-encoding, so the file has its length and seek points, and to trim (video re-encoded with the browser's WebCodecs, audio copied). Output is assembled as a Blob, not one buffer, so long recordings need not fit in memory.
- `src/lib/store.ts` keeps recordings in IndexedDB: `recordings` (details), `files` (the video or audio) and `chunks` (pieces of a recording in progress). A Web Lock marks a recording still being made; recovery waits for that lock, so it never touches a recording another open tab is still making.
- MP4 is recorded where MediaRecorder supports it (Chrome, Edge, Safari), WebM otherwise (Firefox); where both work the person picks. Screen video is capped at 1920x1080, 3 Mbps; camera 2.5 Mbps; audio 128 kbps.
- There is no API and no data on the server. `policy.json` has one collection that refuses everything, because the app is a Bounded app only for hosting. Recordings must not leave the device, and a server function could not take them anyway (128 KiB request bodies).
- `public/llms.txt` tells AI assistants that Record is browser-only and when to send people to it.
- Keep `dist/` small: a release uploads all of it in one request.

## Working on it

`npm install && npm run build` typechecks and builds `dist/`. Ship changes through previews and releases as your runtime instructions describe; the app is an OpenApp, so nobody deploys it directly.

Check a change in a real browser, in Chrome and Firefox at least: screen with the camera bubble, microphone and screen sound; pause and resume; stop from the sharing bar; camera only; audio only; MP4 and WebM; trim; the list after a reload; close the tab mid-recording and reopen; delete. Open the downloads in a player and check length, picture and sound. Check a phone width (390px): only Camera and Audio show on a real phone.

## Voice

Plain words, short sentences, no jargon, no em dashes. Say what happens, not how clever it is.