cloudflare · swapnilmadavi · Dec 1, 2025
@@ -3,7 +3,7 @@ pcx_content_type: navigation
 title: Local Participant
 slug: realtime/realtimekit/core/local-participant
 sidebar:
-  order: 4
+  order: 5
 ---
 
 import { Tabs, TabItem } from "~/components";

@@ -3,7 +3,7 @@ pcx_content_type: navigation
 title: Meeting Metadata
 slug: realtime/realtimekit/core/meeting-metadata
 sidebar:
-  order: 3
+  order: 4
 ---
 
 import { Tabs, TabItem } from "~/components";
@@ -208,4 +208,4 @@ The `socketConnectionUpdate` event provides:
 Explore related topics:
 
 - [Meeting Object Explained](/realtime/realtimekit/core/meeting-object-explained/) - Comprehensive meeting object reference
-- [Session Lifecycle](/realtime/realtimekit/concepts/session-lifecycle/) - Understanding meeting states and transitions
+- [Peer Lifecycle](/realtime/realtimekit/core/peer-lifecycle/) - Understanding different peer states and transitions
@@ -3,7 +3,7 @@ pcx_content_type: navigation
 title: Meeting Object Explained
 slug: realtime/realtimekit/core/meeting-object-explained
 sidebar:
-  order: 2
+  order: 3
 ---
 
 import { Tabs, TabItem } from "~/components";

@@ -0,0 +1,37 @@
+---
+pcx_content_type: navigation
+title: Peer Lifecycle
+slug: realtime/realtimekit/core/peer-lifecycle
+sidebar:
+  order: 2
+---
+
+When a user (participant) connects to a meeting, they become a **peer** in the meeting session.
+A peer then moves through several states in the session based on the preset, connection state, and actions by the user or the host.
+
+## Lifecycle of a Peer in a Session
+
+![Peer Lifecycle In a Session](~/assets/images/realtime/realtimekit/peer-lifecycle.svg)
+
+Here’s how the peer lifecycle works:
+
+1. **Initialization state**: When the SDK is initialized, the participant connects to the meeting session as a peer.
+   This state can be used for pre-join experiences, such as previewing audio and video and editing the display name before joining.
+
+2. **Join intent**: When the peer decides to join, one of the following occurs:
+   - If waitlisting is enabled, the peer is placed in the waiting room.
+   - If the peer is allowed to enter directly, they join the session.
+
+3. **Waitlisted**: The peer remains in the waiting room until a host peer approves or denies their entry.
+   - If their entry is approved, they enter the meeting session.
+   - If their entry is denied, they move to the rejected state. To try joining again, they must start from initializing the SDK.
+
+4. **During the session**: The peer can see and interact with other peers in the meeting session.
+
+5. **Session termination**: The session terminates for the peer and they exit when:
+   - The peer voluntarily leaves the session or the meeting session ends.
+   - The peer is removed from the meeting session by a host.
+   - The peer experiences a network disconnection and SDK cannot reconnect them after multiple attempts.
+
+The [prebuilt](/realtime/realtimekit/ui-kit/) experience that the UIKit provides handles the peer lifecycle for you and shows the corresponding UI for each state.
+If you want to build a fully custom experience that matches your application requirements and design, you can use the Core SDK and handle the peer lifecycle directly in your code.
@@ -3,7 +3,7 @@ pcx_content_type: navigation
 title: Remote Participant
 slug: realtime/realtimekit/core/remote-participant
 sidebar:
-  order: 5
+  order: 6
 ---
 
 import { Tabs, TabItem } from "~/components";

@@ -3,7 +3,7 @@ pcx_content_type: navigation
 title: Waiting Room
 slug: realtime/realtimekit/core/waiting-room
 sidebar:
-  order: 6
+  order: 8
 ---
 
 import { Tabs, TabItem } from "~/components";

@@ -5,51 +5,52 @@ slug: realtime/realtimekit/sdk-selection
 sidebar:
   order: 4
 ---
-import RTKSDKSelector from '~/components/realtimekit/RTKSDKSelector/RTKSDKSelector.astro';
-import RTKPill from '~/components/realtimekit/RTKPill/RTKPill.astro';
+
+import RTKSDKSelector from "~/components/realtimekit/RTKSDKSelector/RTKSDKSelector.astro";
+import RTKPill from "~/components/realtimekit/RTKPill/RTKPill.astro";
 
 :::note
 If you haven't already, we recommend trying out our [demo app](https://demo.realtime.cloudflare.com/meeting?demo=Default) to get a feel for what RealtimeKit can do.
 :::
 
 ### Offerings
 
-RealtimeKit provides two ways to build real-time media applications: 
+RealtimeKit provides two ways to build real-time media applications:
 
 **Core SDK**: Client SDK built on top of Realtime SFU that provides a full set of APIs for managing video calls, from joining and leaving sessions to muting, unmuting, and toggling audio and video.
 
 **UI Kit**: <RTKPill>Recommended</RTKPill> UI library of pre-built, customizable components for rapid development — sits on top of the Core SDK.
 
 > **Note:** When you use our UI Kit, you also get access to the core SDK with it, which can be used to build additional features based on your needs.
 
-
-### Select you framework
+### Select your framework
 
 RealtimeKit support all the popular frameworks for web and mobile platforms. Please select the Platform and Framework that you are building on.
-<RTKSDKSelector />
 
-| Framework/Library                      | Core SDK                                                                                                   | UI Kit                                                                                                           | 
-| -------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | 
-| Web-Components (HTML, Vue, Svelte)     | [@cloudflare/realtimekit](https://www.npmjs.com/package/@cloudflare/realtimekit)                           | [@cloudflare/realtimekit-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-ui)                           |
-| React                                  | [@cloudflare/realtimekit-react](https://www.npmjs.com/package/@cloudflare/realtimekit-react)               | [@cloudflare/realtimekit-react-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-react-ui)               |
-| Angular                                | [@cloudflare/realtimekit](https://www.npmjs.com/package/@cloudflare/realtimekit)                           | [@cloudflare/realtimekit-angular-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-angular-ui)           |
+<RTKSDKSelector />
 
+| Framework/Library                  | Core SDK                                                                                     | UI Kit                                                                                                 |
+| ---------------------------------- | -------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ |
+| Web-Components (HTML, Vue, Svelte) | [@cloudflare/realtimekit](https://www.npmjs.com/package/@cloudflare/realtimekit)             | [@cloudflare/realtimekit-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-ui)                 |
+| React                              | [@cloudflare/realtimekit-react](https://www.npmjs.com/package/@cloudflare/realtimekit-react) | [@cloudflare/realtimekit-react-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-react-ui)     |
+| Angular                            | [@cloudflare/realtimekit](https://www.npmjs.com/package/@cloudflare/realtimekit)             | [@cloudflare/realtimekit-angular-ui](https://www.npmjs.com/package/@cloudflare/realtimekit-angular-ui) |
 
 ### Technical comparison
+
 Here is a comprehensive guide to help you choose the right option for your project. This comparison will help you understand the trade-offs between using the Core SDK alone versus combining it with the UI Kit.
 
-| Feature                | Core SDK only                                                           | UI Kit                                                                   |
-| ---------------------- | ----------------------------------------------------------------------- | ------------------------------------------------------------------------ |
-| **What you get**       | Core APIs for managing media, host controls, chat, recording and more.  | prebuilt UI components along with Core APIs.                             |
-| **Bundle size**        | Minimal (media/network only)                                            | Larger (includes Core SDK + UI components)                               |
-| **Time to ship**       | Longer (build UI from scratch). Typically 5-6 days.                     | Faster (UI Kit handles Core SDK calls). Can build an ship under 2 hours. |
-| **Customization**      | Complete control, manual implementation. Need to build you own UI       | High level of customization with plug and play component library.        |
-| **State management**   | Needs to be manually handled.                                           | Automatic, UI Kit takes care of state management.                        |
-| **UI flexibility**     | Unlimited (build anything)                                              | High (component library + add-ons)                                       |
-| **Learning curve**     | Steeper (learn Core SDK APIs directly)                                  | Gentler (declarative components wrap Core SDK)                           |
-| **Maintenance**        | More code to maintain. Larger project.                                  | Less code, component updates included                                    |
-| **Design system**      | Headless, integrates with any design system.                            | Allows you to provide your theme.                                        |
-| **Access to Core SDK** | Direct API access                                                       | Direct API access + UI components                                        |
+| Feature                | Core SDK only                                                          | UI Kit                                                                   |
+| ---------------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------ |
+| **What you get**       | Core APIs for managing media, host controls, chat, recording and more. | prebuilt UI components along with Core APIs.                             |
+| **Bundle size**        | Minimal (media/network only)                                           | Larger (includes Core SDK + UI components)                               |
+| **Time to ship**       | Longer (build UI from scratch). Typically 5-6 days.                    | Faster (UI Kit handles Core SDK calls). Can build an ship under 2 hours. |
+| **Customization**      | Complete control, manual implementation. Need to build you own UI      | High level of customization with plug and play component library.        |
+| **State management**   | Needs to be manually handled.                                          | Automatic, UI Kit takes care of state management.                        |
+| **UI flexibility**     | Unlimited (build anything)                                             | High (component library + add-ons)                                       |
+| **Learning curve**     | Steeper (learn Core SDK APIs directly)                                 | Gentler (declarative components wrap Core SDK)                           |
+| **Maintenance**        | More code to maintain. Larger project.                                 | Less code, component updates included                                    |
+| **Design system**      | Headless, integrates with any design system.                           | Allows you to provide your theme.                                        |
+| **Access to Core SDK** | Direct API access                                                      | Direct API access + UI components                                        |
 
 :::note
 If you are building with our Core SDK only, you can reference our [open source repos](https://github.com/orgs/cloudflare/repositories?q=realtimekit) for implementation examples to speed up your development.

@@ -182,6 +182,6 @@ To build your own custom meeting UI, follow these guides in order:
 
 1. **[UI Kit Components Library](/realtime/realtimekit/ui-kit/component-library/)** - Browse available components and their visual representations
 2. **[UI Kit Meeting Lifecycle](/realtime/realtimekit/ui-kit/meeting-lifecycle/)** - Lifecycle of a meeting and how components communicate and synchronize with each other
-3. **[Session Lifecycle](/realtime/realtimekit/concepts/session-lifecycle/)** - Understand different peer states and transitions
+3. **[Peer Lifecycle](/realtime/realtimekit/core/peer-lifecycle/)** - Understand different peer states and transitions
 4. **[Meeting Object Explained](/realtime/realtimekit/core/meeting-object-explained/)** - Access meeting data and participant information using the Core SDK
 5. **[Build Your Own UI](/realtime/realtimekit/ui-kit/build-your-own-ui/)** - Put everything together to create a custom meeting interface