Agent skill

React Native Moq

by software-mansion-labs in software-mansion-labs/skills

Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a…

MITAuto-check passedMobile

Install React Native Moq

skills CLI
$ npx skills add software-mansion-labs/skills --skill react-native-moq -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install software-mansion-labs/skills react-native-moq --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/software-mansion-labs/skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/react-native-moq .claude/skills/react-native-moq && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
react-native-moq
GitHub stars
291
Token cost
~1.6k tokens
SKILL.md length
532 words
Files
5 (incl. references)
Skills in repo
20
Repo updated
First seen
Licence
MIT

At a glance

Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a…

  • Works in 9 steps: Errors are strings, not exceptions.… → publish() requires session.state ===… → Gate codecs with… → …
  • : react-native-moq
  • SKILL.md covers Mental model, Quick start — watch, Quick start — go live and Critical rules, plus 1 more section
  • Calls npm

What it does

React Native Moq is an agent skill from software-mansion-labs/skills. Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a MoQ relay. MUST USE before writing, reviewing, or debugging ANY code that uses react-native-moq or react-native-moq-ui. Trigger on: 'react-native-moq', 'MoQ', 'Media over QUIC', 'moq relay', 'moq-kit', 'useSession', 'useBroadcasts', 'useVideoPlayer', 'useAudioPlayer', 'usePublisher', 'useCamera', 'useMultiCamera'…

Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 5 other files, including reference files (for example `references/custom-tracks.md`, `references/imperative.md` and `references/playback.md`).

It sits in Mobile, covering Cross-platform mobile apps. It works with React Native. The repository describes itself as: Software Mansion's set of skills for AI-assisted React Native development. The licence is MIT.

When your agent uses it

  • : react-native-moq
  • Media over QUIC
  • UseScreenBroadcast
  • UseDataMessages

Example prompts

  • “react-native-moq”
  • “Media over QUIC”
  • “moq relay”
  • “/react-native-moq”

Requirements

  • Node.js

Workflow steps

9 steps, taken from the first numbered list in SKILL.md.

  1. Errors are strings, not exceptions. States are unions like 'connected' | 'error:...'; check state.startsWith('error:'). Nothing throws on…
  2. publish() requires session.state === 'connected', otherwise the publisher goes straight to error:session is not connected. Gate the…
  3. Gate codecs with getSupportedVideoCodecs() / getSupportedAudioCodecs(). On Android an unsupported encoder (often h265) makes publishing…
  4. Permissions are the host app's job — request CAMERA/RECORD_AUDIO on Android, add NSCameraUsageDescription/NSMicrophoneUsageDescription on…
  5. takes no children (the Android native view is not a ViewGroup). Render overlays as absolutely-positioned siblings.
  6. Capture hooks are refcounted device singletons — all consumers share the physical camera/mic; flip() affects everyone. Use enabled: false…
  7. Broadcast paths are relative to the subscription prefix (broadcast live/test appears as path: 'test' under prefix 'live'). Subscribe with…
  8. Data tracks are not in the catalog — publisher and subscriber must agree on the track name out of band (default 'data').
  9. An idle iOS microphone capture holds the audio session in playAndRecord and can block other audio libraries (insufficientPriority)…

What it can do on your machine

Read from SKILL.md and the folder at commit e3f00cd. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use npm, which can reach the network depending on how they are called.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

React Native Moq loads about 1.6k tokens when it runs, and up to ~5.7k if it reads all its reference files. Until then it costs about 197 tokens; SKILL.md has 532 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~197
When it runs · the whole SKILL.md, loaded when a task matches
~1.6k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~5.7k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from software-mansion-labs/skills at commit e3f00cd, republished under its MIT licence (© software-mansion-labs). 532 words, ~1,605 tokens.

Download SKILL.mdSave it as .claude/skills/react-native-moq/SKILL.md (or your agent's skills folder). This skill also uses 4 other files; get the full folder from GitHub.
name
react-native-moq
description
Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a MoQ relay. MUST USE before writing, reviewing, or debugging ANY code that uses react-native-moq or react-native-moq-ui. Trigger on: 'react-native-moq', 'MoQ', 'Media over QUIC', 'moq relay', 'moq-kit', 'useSession', 'useBroadcasts', 'useVideoPlayer', 'useAudioPlayer', 'usePublisher', 'useCamera', 'useMultiCamera', 'useMicrophone', 'useScreenBroadcast', 'useDataTrack', 'useDataMessages', 'useAudioChunks', 'useAudioSource', 'useVideoSource', 'VideoView', 'PublisherView', 'VideoPlayerView', 'BroadcastPickerView', 'createSession', 'createPublisher', 'subscribeBroadcasts'.
license
MIT

react-native-moq

React Native bindings for Media over QUIC (MoQ): live video, audio, and data tracks with sub-second latency, published to and consumed from a MoQ relay. Built on Software Mansion's moq-kit native library.

Requirements: React Native New Architecture (Fabric + TurboModules), iOS 16+, Android API 30+.

sh
npm install react-native-moq
cd ios && pod install

Optional player chrome (fullscreen modal, controls, volume slider):

sh
npm install react-native-moq-ui @react-native-vector-icons/material-icons

iOS also needs MaterialIcons.ttf under UIAppFonts in Info.plist, then pod install again. Skip this package if composing your own player UI on <VideoView>.

Mental model

  • A Session is one connection to a MoQ relay (useSession(url)). It does not auto-connect — call session.connect() yourself. One session serves both subscribing and publishing.
  • Subscribing: useBroadcasts(session, prefix) lists live broadcasts under a path prefix → pick a BroadcastInfo → useVideoPlayer / useAudioPlayer → render with <VideoView player={player}>. Raw-media alternatives: useAudioChunks (encoded or PCM to JS) and useDataMessages (string payloads).
  • Publishing: capture hooks produce tracks (useCamera, useMicrophone, useMultiCamera) or you generate them (useDataTrack, useAudioSource, useVideoSource) → usePublisher(session).publish({ path, tracks }). Screen sharing (useScreenBroadcast) is separate and out-of-process.
  • Every hook has a hook-free counterpart — create* (returns the object plus destroy()) for the stateful ones, subscribe* (returns start()/stop()) for the subscription hooks — see references/imperative.md.
  • Objects expose reactive state (session.state, publisher.state, player.isPlaying, …); hooks re-render on changes. Subscribe manually with addListener or the useEvent/useEventListener helpers.

Quick start — watch

tsx
function Watch() {
  const session = useSession('https://relay.example.com', (s) => s.connect());
  const broadcasts = useBroadcasts(session, ''); // '' = all paths
  return broadcasts.map((b) => <BroadcastPlayer key={b.path} broadcast={b} />);
}

function BroadcastPlayer({ broadcast }: { broadcast: BroadcastInfo }) {
  const player = useVideoPlayer(broadcast, (p) => p.play());
  return <VideoView player={player} style={{ width: '100%', aspectRatio: 16 / 9 }} />;
}

useVideoPlayer/useAudioPlayer require a non-null broadcast — mount them in a child rendered only once one exists.

Quick start — go live

tsx
const session = useSession(url, (s) => s.connect());
const camera = useCamera();
const microphone = useMicrophone();
const publisher = usePublisher(session);

<PublisherView camera={camera} style={styles.preview} />
// when session.state === 'connected':
publisher.publish({ path: 'live/test', tracks: [camera, microphone] });

Critical rules

  1. Errors are strings, not exceptions. States are unions like 'connected' | 'error:...'; check state.startsWith('error:'). Nothing throws on media failure. Sessions carry the message only in the state string (state.slice(6)); capture tracks and the publisher additionally expose a lastError field. Players have no error surface at all — watch session and publisher state instead.
  2. publish() requires session.state === 'connected', otherwise the publisher goes straight to error:session is not connected. Gate the go-live button on session state.
  3. Gate codecs with getSupportedVideoCodecs() / getSupportedAudioCodecs(). On Android an unsupported encoder (often h265) makes publishing start then silently stop with no error. Default to h264/opus.
  4. Permissions are the host app's job — request CAMERA/RECORD_AUDIO on Android, add NSCameraUsageDescription/NSMicrophoneUsageDescription on iOS. A black preview usually means a missing permission.
  5. <VideoView> takes no children (the Android native view is not a ViewGroup). Render overlays as absolutely-positioned siblings.
  6. Capture hooks are refcounted device singletons — all consumers share the physical camera/mic; flip() affects everyone. Use enabled: false to keep hardware off while mounted instead of calling hooks conditionally.
  7. Broadcast paths are relative to the subscription prefix (broadcast live/test appears as path: 'test' under prefix 'live'). Subscribe with '' to see full paths. A listed broadcast that won't play (relay error code=13 NotFound) means a path/prefix mismatch.
  8. Data tracks are not in the catalog — publisher and subscriber must agree on the track name out of band (default 'data').
  9. An idle iOS microphone capture holds the audio session in playAndRecord and can block other audio libraries (insufficientPriority). Disable the mic (enabled: false) when not publishing.
Show full SKILL.md (49 more words)Show less

References

TaskRead
Sessions, broadcast discovery, video/audio playback, <VideoView>, stats, track switching, events, react-native-moq-uireferences/playback.md
Camera, multi-camera, microphone, publisher lifecycle, screen broadcasting, codec queriesreferences/publishing.md
Data tracks & messages, audio chunks to JS, push-your-own audio (PCM) and video (frame buffers)references/custom-tracks.md
Using without React: create* handles, subscribe* functions, cleanupreferences/imperative.md

© software-mansion-labs, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 4 other files (references) in skills/react-native-moq of software-mansion-labs/skills.

  • SKILL.md
  • references/custom-tracks.md
  • references/imperative.md
  • references/playback.md
  • references/publishing.md

Open the folder on GitHubat commit e3f00cd

Compare with similar skills

React Native Moq next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

React Native Moq compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
React Native Moq this skillsoftware-mansion-labs/skills291—~1.6kAutomated safety check: PassMIT
React Native Best Practicesvercel-labs/openreview1.7k17 repos~1.1kAutomated safety check: PassMIT
Creating Reanimated Animationsgluestack/gluestack-ui5.3k—~2.4kAutomated safety check: PassNone
RtlGetStream/stream-chat-react-native1.2k—~4.4kAutomated safety check: PassCustom licence
Mobile App UI Designceorkm/mobile-app-ui-design400—~2kAutomated safety check: PassNone
Sleek Design Mobile Appssleekdotdesign/agent-skills583—~2.1kAutomated safety check: PassMIT

Similar skills

  • React Native Best Practices

    vercel-labs/openreview

    Official

    A prioritized rule set for React Native and Expo apps covering list performance, animation, navigation, UI patterns, state, rendering, monorepos and configuration.

    1.7k GitHub starsUsed in 17 repos~1.1k tokens
    MobileAuto-check passed
  • Creating Reanimated Animations

    gluestack/gluestack-ui

    Generate React Native Reanimated animation code for React Native apps.

    5.3k GitHub stars~2.4k tokensUpdated 1 mo ago
    MobileAuto-check passed
  • Rtl

    GetStream/stream-chat-react-native

    Audit and maintain RTL (right-to-left) layout compatibility in stream-chat-react-native.

    1.2k GitHub stars~4.4k tokensUpdated yesterday
    MobileAuto-check passed
  • Mobile App UI Design

    ceorkm/mobile-app-ui-design

    Design high-quality mobile app UI/UX screens, flows, and components.

    400 GitHub stars~2k tokensUpdated 3 mo ago
    MobileAuto-check passed
  • Sleek Design Mobile Apps

    sleekdotdesign/agent-skills

    Design mobile app screens with Sleek, edit Sleek projects, and implement their designs in React Native or HTML.

    583 GitHub stars~2.1k tokensUpdated 2 days ago
    MobileAuto-check passed
  • Argent Metro Debugger

    bbplayer-app/BBPlayer

    Debug a JS runtime via CDP using argent debugger tools. An agent skill from bbplayer-app/BBPlayer.

    1.1k GitHub stars~3.4k tokensUpdated yesterday
    MobileAuto-check passed

More from software-mansion-labs/skills

All 20 skills in this repo
  • Detour Onboarding

    software-mansion-labs/skills

    Complete onboarding guide for developers who are new to Detour, the open-source deferred deep linking SDK by Software Mansion.

    291 GitHub stars~2.8k tokensUpdated 9 days ago
    Auto-check passed
  • Typegpu

    software-mansion-labs/skills

    TypeGPU is type-safe WebGPU in TypeScript. An agent skill from software-mansion-labs/skills.

    291 GitHub starsUsed in 2 repos~5.6k tokens
    Auto-check passed
  • Enable Worklets Bundle Mode

    software-mansion-labs/skills

    Enable react-native-worklets Bundle Mode (imports inside worklets, third party libraries on worklet runtimes) in an Expo, RN CLI or brownfield React Native app, including the mandatory…

    291 GitHub stars~4k tokensUpdated 9 days ago
    Auto-check passed
  • Moq Kit

    software-mansion-labs/skills

    Software Mansion's moq-kit — native Swift (iOS) and Kotlin (Android) SDKs for Media over QUIC (moq-lite) live streaming: sub-second-latency playback, camera/microphone/screen publishing, and…

    291 GitHub stars~5k tokensUpdated 9 days ago
    Auto-check passed
  • Expo Horizon

    software-mansion-labs/skills

    Software Mansion's guide for migrating Expo SDK apps to Meta Quest using expo-horizon packages.

    291 GitHub stars~2.8k tokensUpdated 9 days ago
    Auto-check passed
  • Fishjam JS Server SDK

    software-mansion-labs/skills

    Node.js / TypeScript server SDK for Fishjam — backends that create rooms, mint peer tokens, listen to server notifications, and run agents.

    291 GitHub stars~1.4k tokensUpdated 9 days ago
    Auto-check passed

Works with

Categories

Questions about React Native Moq

What does React Native Moq do?

Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a…. React Native Moq is an agent skill from software-mansion-labs/skills. Software Mansion's react-native-moq — Media over QUIC (MoQ) live streaming for React Native: sub-second-latency video/audio playback, camera/mic/screen publishing, and realtime data tracks over a MoQ relay.

When should I use React Native Moq?

React Native Moq fits situations like: : react-native-moq; media over QUIC; useScreenBroadcast; useDataMessages.

How do I install React Native Moq in Claude Code?

Run `npx skills add software-mansion-labs/skills --skill react-native-moq -a claude-code`. Or copy the skill folder (skills/react-native-moq in software-mansion-labs/skills) into .claude/skills/react-native-moq in your project. Claude Code loads it when a task matches its description.

How do I install React Native Moq in Codex?

Run `npx skills add software-mansion-labs/skills --skill react-native-moq -a codex`. Or copy the skill folder (skills/react-native-moq in software-mansion-labs/skills) into .agents/skills/react-native-moq in your project. Codex loads it when a task matches its description.

Can I use React Native Moq in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add software-mansion-labs/skills --skill react-native-moq -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-native-moq, .gemini/skills/react-native-moq, .github/skills/react-native-moq and .opencode/skills/react-native-moq in your project.

What does React Native Moq need to run?

Going by SKILL.md and its folder, React Native Moq needs the command-line tools its instructions call (npm). Our summary lists: Node.js.

Does React Native Moq access the network?

SKILL.md contains no URLs. Its commands use npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is React Native Moq safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does React Native Moq use?

React Native Moq is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does React Native Moq use?

About 1.6k tokens (SKILL.md is roughly 6.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 4.1k tokens, read only when the agent opens those files.

What are the alternatives to React Native Moq?

Skills that share tags, products or a category with React Native Moq: React Native Best Practices (vercel-labs/openreview, 1.7k stars), Creating Reanimated Animations (gluestack/gluestack-ui, 5.3k stars), Rtl (GetStream/stream-chat-react-native, 1.2k stars) and Mobile App UI Design (ceorkm/mobile-app-ui-design, 400 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains React Native Moq?

software-mansion-labs (a GitHub organization) maintains it in software-mansion-labs/skills, which has 291 GitHub stars. The repository holds 20 skills in this directory. The repository was last updated on September 28, 2026.

Source: software-mansion-labs/skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.