> ## Documentation Index
> Fetch the complete documentation index at: https://docs.streampixel.io/llms.txt
> Use this file to discover all available pages before exploring further.
# Mobile streaming
> Optimize your stream for iOS and Android browsers, including touch input and bandwidth constraints.
The outcome: a clean stream that loads fast on cellular, responds to touch, doesn't bake the device, and survives the iOS Safari quirks that break naive integrations.
Streampixel works on mobile via the device browser — Safari on iOS and Chrome on Android. There is no native mobile SDK; everything is the same Web SDK with a different config profile.
## Step 1 — Detect mobile, don't guess
User-agent sniffing is fragile, but for switching between desktop and mobile config it's good enough:
```javascript theme={"dark"}
const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);
```
Use this to feed different values into the SDK — not to gate features. A user on a Pixel Tablet wants the desktop experience; a user on an iPhone Mini wants tighter bitrate caps. Detect, then choose.
## Step 2 — Mobile-tuned SDK init
```html theme={"dark"}
Streampixel Mobile
Tap to start
```
What each option buys you:
* **`touchInput: true`** — translate browser touch events into Pixel Streaming touch input so Unreal sees taps as taps, not as mouse clicks at (0, 0).
* **`startResolutionMobile: '480p'`** — load fast. Adaptive bitrate negotiates upward as the connection allows.
* **`preferredCodec: 'H264'`** — every mobile decoder has H264 silicon. VP9 software-decodes on most phones and burns CPU.
* **`maxBitrate`** — cap the stream so an over-eager adaptive controller doesn't try to push 12 Mbps over LTE.
* **`forceTurn: true`** — most carrier NATs block direct WebRTC; TURN relays just work.
## Step 3 — Touch UI in Unreal
The browser-side `touchInput: true` flag delivers touch events to Unreal. Whether your Unreal project does anything useful with them depends on what touch UI is built into the project itself.
For projects packaged with on-screen joysticks, on-screen buttons, or other touch HUD, see [Hide / unhide touch controls](/resources/additional-unreal-engine-features/hide-unhide-touch-controls) for runtime control of those overlays. Show them when `touchInput` is active and hide them on desktop.
## Step 4 — Bandwidth budget
Plan for the network the user actually has, not the network you wish they had:
| Connection | Realistic sustained bitrate | Recommended `maxBitrate` |
| ---------------------- | --------------------------- | ------------------------ |
| LTE (good signal) | 10–20 Mbps | 4 Mbps |
| LTE (weak / congested) | 1–3 Mbps | 2 Mbps |
| 5G (sub-6) | 50–200 Mbps | 6 Mbps |
| 5G (mmWave) | 500+ Mbps | 8 Mbps |
| Hotel / cafe Wi-Fi | 5–20 Mbps shared | 4 Mbps |
`maxBitrate` is in bits per second. The 4 Mbps cap above is `4_000_000`. Adaptive bitrate will scale down further on bad networks; it will not scale up beyond the cap.
If your user base skews toward mobile data plans with hard caps, default to 2–3 Mbps and let users opt into higher quality from a settings menu. The bandwidth saved over a 30-minute session adds up.
## Step 5 — Battery and thermals
A long mobile streaming session is a sustained workload: GPU decode, screen at full brightness, radio active. Phones throttle when they get hot, and a throttled phone produces a worse stream.
Things you can do from your application:
* **Set a sensible AFK timeout.** If the user puts the phone down for 30 seconds, Streampixel can disconnect them and free the worker. They can reconnect when they pick it back up.
* **Drop FPS targets if your UE project supports it.** A console command via `emitConsoleCommand('t.MaxFPS 30')` halves render work and saves battery on long-form, low-motion content (configurators, tours).
* **Honour `prefers-reduced-motion`** for any spinner / loader animations on your page.
There's nothing the streaming side can do about a phone's thermal envelope. Cap session length where appropriate or design for short bursts.
## Step 6 — iOS Safari quirks
iOS has the most edge cases. The big ones:
### Audio requires a user gesture
iOS will not start playing audio until a tap, click, or other input event. The "Tap to start" overlay in the example above exists to satisfy that requirement. Without it, the stream connects, video plays muted, and audio never starts even after `audio.play()` is called.
```javascript theme={"dark"}
document.getElementById('unmute').addEventListener('click', () => {
UIControl.toggleAudio?.();
}, { once: true });
```
### Autoplay policies
Even muted autoplay can fail in some Safari configurations, especially with PiP enabled. The Web SDK handles the muted autoplay attribute correctly, but if you wrap it in your own `