> ## Documentation Index
> Fetch the complete documentation index at: https://docs.livepeer.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Developer Landscape

> Five developer mental models for the Livepeer network: AI inference, video platform, compute primitives, live-video-first, and protocol. Each maps to a network-direct surface.

export const CenteredContainer = ({children, maxWidth = "800px", padding = "0", preset = "default", width = "", minWidth = "", marginRight = "", marginBottom = "", textAlign = "", style = {}, className = "", ...rest}) => {
  const presets = {
    default: {},
    fitContent: {
      width: "fit-content",
      minWidth: "fit-content"
    },
    readable70: {
      width: "70%",
      minWidth: "fit-content"
    },
    readable80: {
      width: "80%",
      minWidth: "fit-content"
    },
    readable90: {
      width: "90%"
    },
    wide900: {
      maxWidth: "900px"
    }
  };
  const presetStyle = presets[preset] || presets.default;
  return <div className={className} style={{
    maxWidth: presetStyle.maxWidth || maxWidth,
    margin: "0 auto",
    padding: padding,
    ...presetStyle.width ? {
      width: presetStyle.width
    } : {},
    ...presetStyle.minWidth ? {
      minWidth: presetStyle.minWidth
    } : {},
    ...width ? {
      width
    } : {},
    ...minWidth ? {
      minWidth
    } : {},
    ...marginRight ? {
      marginRight
    } : {},
    ...marginBottom ? {
      marginBottom
    } : {},
    ...textAlign ? {
      textAlign
    } : {},
    ...style
  }} {...rest}>
      {children}
    </div>;
};

export const CustomDivider = ({color = "var(--lp-color-border-default)", middleText = "", spacing = "default", style = {}, className = "", ...rest}) => {
  const spacingPresets = {
    default: {
      margin: "24px 0"
    },
    overlap: {
      margin: "-1rem 0 -1rem 0"
    },
    tight: {
      margin: "0 0 -1rem 0"
    },
    section: {
      margin: "0 0 -2rem 0"
    },
    sectionOverlap: {
      margin: "-1rem 0 -2rem 0"
    },
    deepOverlap: {
      margin: "-1rem 0 -1.5rem 0"
    }
  };
  const spacingStyle = spacingPresets[spacing] || spacingPresets.default;
  return <div role="separator" aria-orientation="horizontal" className={className} style={{
    display: "flex",
    alignItems: "center",
    ...spacingStyle,
    fontSize: style?.fontSize || "16px",
    height: "fit-content",
    ...style
  }} {...rest}>
      <span style={{
    marginRight: "var(--lp-spacing-px-8)",
    opacity: 0.2
  }}>
        <Icon icon="/snippets/assets/logos/Livepeer-Logo-Symbol-Theme.svg" />
      </span>
      <div style={{
    flex: 1,
    height: "1px",
    background: "var(--lp-color-border-default)",
    opacity: 0.4
  }}></div>
      {middleText && <>
          <Icon icon="circle" size={2} />
          <span style={{
    margin: "0 8px",
    fontWeight: "bold",
    color: color,
    opacity: 0.7
  }}>
            {middleText}
          </span>
          <Icon icon="circle" size={2} />
        </>}
      <div style={{
    flex: 1,
    height: "1px",
    background: "var(--lp-color-border-default)",
    opacity: 0.4
  }}></div>
      <span style={{
    marginLeft: "var(--lp-spacing-px-8)",
    opacity: 0.2
  }}>
        <span style={{
    display: "inline-block",
    transform: "scaleX(-1)"
  }}>
          <Icon icon="/snippets/assets/logos/Livepeer-Logo-Symbol-Theme.svg" />
        </span>
      </span>
    </div>;
};

export const LinkArrow = ({href, label, description, newline = true, borderColor, className = '', style = {}, ...rest}) => {
  const linkArrowStyle = {
    display: 'inline-flex',
    alignItems: 'center',
    justifyContent: 'center',
    gap: "var(--lp-spacing-1)",
    width: 'fit-content',
    ...borderColor && ({
      borderColor
    })
  };
  return <span className={className} style={style} {...rest}>
      {newline && <br />}
      <span style={linkArrowStyle}>
        <a href={href} target="_blank" rel="noopener noreferrer">
          {label}
        </a>
        <Icon icon="arrow-up-right" size={14} color="var(--lp-color-accent)" />
      </span>
      {description && description}
      {description && <div style={{
    height: "var(--lp-spacing-3)"
  }} />}
    </span>;
};

<CenteredContainer preset="readable90">
  <Tip>Livepeer is a decentralised compute network for video and AI. Developers reach it through one of five surfaces, each suited to a different mental model.</Tip>
</CenteredContainer>

***

Livepeer is a decentralised compute network for video and AI. Independent Orchestrator nodes run GPU workloads against the Livepeer Protocol on Arbitrum One. Developers reach that network through a layered set of surfaces: community Gateways for free experimentation, self-hosted Gateways for production control, BYOC containers for custom workloads, and the trickle protocol for transport. Hosted Solutions like Studio and Daydream sit above these surfaces; the Developers tab covers everything below.

Five developer mental models cover the surfaces you'll actually build against. Each one maps to a quickstart and a deeper guide.

<CustomDivider />

## AI Inference Mental Model

You're treating Livepeer as an OpenAI-shaped inference API. You want an endpoint, a key (or a free off-chain Gateway), and a model menu. Text-to-image, image-to-video, audio-to-text, LLM completions, and seven more native pipelines are reachable through one REST surface.

Your entry surface is the AI Gateway API. Two providers exist: the Livepeer Cloud Community Gateway at `dream-gateway.livepeer.cloud` (free, no key, off-chain), and Gateways operated by Studio or other Solutions providers. Calling either one routes through the protocol to the GPU that runs your job.

The activation moment is your first successful API call. Use the <LinkArrow href="/v2/developers/build/ai-and-agents/ai-jobs-direct-quickstart" label="AI Jobs Direct Quickstart" newline={false} />.

## Video Platform Mental Model

You're treating Livepeer as a transcoding and playback backbone. You want ingest, ABR ladders, an HLS manifest, a player, optional VOD, and webhooks. The hosted-API closest fit is Studio (documented in Solutions). The network-direct path is a self-hosted video Gateway running `go-livepeer` in broadcaster mode against Arbitrum One.

Your entry surface is `go-livepeer` itself, configured as a broadcaster. Inputs are RTMP or WebRTC streams; outputs are HLS or LL-HLS manifests that any HLS-capable player can consume. The `@livepeer/react` Player component wraps the browser side.

The activation moment is your first live stream with a playback URL. Use the <LinkArrow href="/v2/developers/build/video/transcoding-direct-quickstart" label="Transcoding Direct Quickstart" newline={false} />.

## Compute Primitives Mental Model

You're treating Livepeer as a GPU compute market. You bring a container, the network handles routing and payment, you get paid per second of GPU compute. The cost model is closer to Modal or RunPod than to a hosted inference API.

Your entry surface is BYOC: a container contract, a capability ID registered against the network, and per-second compute billing under PR #3641. The reference implementations live at `muxionlabs/byoc-example-apps`, with the SDK at `@muxionlabs/byoc-sdk`.

The activation moment is your first BYOC container completing a paid job. Use the <LinkArrow href="/v2/developers/build/compute/byoc/byoc-quickstart" label="BYOC Quickstart" newline={false} />.

## Live Video Mental Model

You're treating Livepeer as a low-latency streaming backbone. You need sub-three-second glass-to-glass, ABR, and WebRTC ingest. The path is the same Gateway as the video platform mental model, but tuned for latency: WebRTC ingest, LL-HLS playback, chunk sizing reduced, browser-side ABR aggressive.

Your entry surface is `go-livepeer` in broadcaster mode with low-latency flags. The browser side uses `<Broadcast.Root>` and `<Player.Root>` from `@livepeer/react`.

The activation moment is a sub-three-second loop between broadcaster tab and viewer tab. Use the <LinkArrow href="/v2/developers/build/video/transcoding-direct-quickstart" label="Transcoding Direct Quickstart" newline={false} />, then the <LinkArrow href="/v2/developers/build/tutorials/low-latency-live-streaming-app" label="Low-Latency Live Streaming tutorial" newline={false} />.

## Protocol Mental Model

You're treating Livepeer as a cryptoeconomic protocol. You're interested in LPT, the staking and bonding mechanics, on-chain settlement, governance, and proposal flow. The Developers tab is not your home.

Your entry surface is the About tab for mechanics and contracts, and the Community tab for contribution and governance participation. Both are linked from <LinkArrow href="/v2/about" label="Extending the Protocol" newline={false} />.

<CustomDivider />

## Layer Disambiguation

Three distinctions trip up developers arriving from hosted-API backgrounds.

The **network** is the protocol plus the GPU operators running against it. It is not a product. It is reachable directly through any compatible Gateway implementation. The protocol runs on Arbitrum One.

A **Gateway** is a node that accepts your job and routes it to an Orchestrator. Multiple Gateway implementations exist: the reference `go-livepeer` binary, the Cloud SPE community Gateway, j0sh's Python implementation, and others under <LinkArrow href="/v2/developers/build/alt-gateways/overview" label="Alt-Gateways" newline={false} />. You can call a hosted Gateway or run one yourself.

A **pipeline** is a containerised AI workload that an Orchestrator runs. Eleven native pipelines ship with `ai-runner`. BYOC lets you ship your own container as a new pipeline.

Hosted Solutions such as Studio and Daydream wrap a Gateway and add hosted account management, dashboards, SDKs, and billing. The Solutions tab documents them. The Developers tab covers everything below the Solutions layer.

<CustomDivider />

## Coming From OpenAI

Your closest fit is the AI Inference Mental Model. The AI Gateway API speaks JSON over HTTP and returns a Job ID; you poll or stream the result. The LLM pipeline accepts OpenAI's `/v1/chat/completions` request shape, so existing OpenAI SDK code works against the LLM endpoint with a base URL swap.

What changes: pricing is per pipeline; LLM is per token; model availability depends on the active Orchestrator set instead of one provider; the free community Gateway lets you experiment without a key.

## Coming From Mux

Your closest fit is the Video Platform Mental Model. The transcoding pipeline accepts RTMP and WebRTC, outputs HLS and LL-HLS, and embeds via `@livepeer/react`. Webhooks and asset APIs match the shape you'd expect.

What changes: you run the Gateway yourself for network-direct, the Orchestrators are independent operators across many providers, and on-chain settlement requires a small Arbitrum ETH balance for payments.

## Coming From Modal or RunPod

Your closest fit is the Compute Primitives Mental Model. Wrap your workload in a container with a Livepeer capability ID, register the capability, and the network routes jobs to your container with per-second billing.

What changes: you don't choose the GPU host; the network does, and payment settles through Probabilistic Micropayments on Arbitrum.

<CustomDivider />

Once you know which mental model fits, the [infrastructure stack](/v2/developers/concepts/infra-stack) page maps each model to the specific tools, SDKs, and infrastructure components you need.

## After Choosing a Model

<CardGroup cols={2}>
  <Card title="Infra Stack" icon="diagram-project" href="/v2/developers/concepts/infra-stack">
    See the persona-by-persona infrastructure map for your model.
  </Card>

  <Card title="Repo Map" icon="folder-tree" href="/v2/developers/concepts/repo-map">
    The repositories behind each surface.
  </Card>
</CardGroup>
