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

# Choose a rendering model

> Four ways to render the payment moment — compare credential, runtime, and engineering effort before you pick one.

| Model                    | Credential              | Runs in                              | Best for                                            | Engineering effort |
| ------------------------ | ----------------------- | ------------------------------------ | --------------------------------------------------- | ------------------ |
| In-app `<PulseCheckout>` | API key                 | Your React tree (trusted runtime)    | Server components, native, a BFF                    | Low                |
| Embedded iframe (Tier A) | Session token (`cs_`)   | Pulse-controlled iframe in your page | Untrusted browsers, your brand, least data exposure | Low–medium         |
| Hosted page (Tier B)     | Session token (`cs_`)   | Pulse-hosted white-label page        | Minimal frontend lift, redirect flows               | Lowest             |
| Headless / API (Tier C)  | API key / session token | Your own UI, end to end              | Full control over every pixel                       | High               |

All four models drive the same backend order — minted once with
`pulse.collectionSessions.create` (see [Create a session](/backend/create-session))
— and all four settle the same way: credit a customer only from a verified
`disbursement.completed` webhook, never from a client callback (see
[Webhooks](/backend/webhooks)).

<CardGroup cols={2}>
  <Card title="In-app component" icon="puzzle-piece" href="/render/in-app-checkout">
    Render `<PulseCheckout>` directly in your React tree, driven by your API key — for trusted runtimes only.
  </Card>

  <Card title="Embedded iframe (Tier A)" icon="window" href="/render/embedded-iframe">
    Mount the payment surface inside a Pulse-controlled iframe on your page, driven by a session token.
  </Card>

  <Card title="Hosted page (Tier B)" icon="link" href="/render/hosted-page">
    Redirect to a white-label, Pulse-hosted page you can serve from your own subdomain.
  </Card>

  <Card title="Headless / API (Tier C)" icon="code" href="/render/headless-api">
    Build your own UI end to end against the order object — no Pulse-rendered surface at all.
  </Card>
</CardGroup>