Run Large Rooms, Panelists, Permissions, and Breakouts by SDK

Scale a room without rendering every camera at once, and moderate it without confusing panelists, co-host responsibilities, participant permissions, and room-wide policy. Choose your SDK for the available controls and examples.

The large-room model

Use four separate pieces of state:

1. Participants: everyone currently known to the room.
2. Display page: the people or shared content visible now.
3. Consumer state: which remote tracks are active, paused, or awaiting a resume acknowledgement.
4. Authority: who may publish, moderate, change room policy, or manage breakouts.

Pagination is not just visual slicing. After a page changes, the active display names and consumer state must move together. A hidden tile must not keep an expensive video route active indefinitely, and a newly visible tile must not be shown as live until its consumer resumes.

autoAdjust in the TypeScript and Kotlin-family cores returns a 12-column layout split based on room shape, participant count, screen share, and board state. It does not choose a page, enforce a server limit, or prove that a consumer resumed.

Roles and permissions are different

• Host/co-host responsibility decides who may perform named host work.
• Panelist membership decides who is promoted into the active speaker or presentation set; panelist focus controls the emphasized set.
• Participant permission changes a named capability for one person.
• Room permission configuration changes the default or room-wide policy.
• Remove disconnects a person. Ban also prevents the same stable room identity from returning. A ban is only durable when identity is stable.

Confirm every authority change from the next room update. Hiding a control is not server authorization.

Breakout lifecycle

Treat breakouts as a state machine: prepare assignments, start, observe the confirmed destinations, update assignments only through the active breakout, and stop before clearing drafts. After reconnection, load current breakout state; never start another breakout because the previous response was lost.

ReactJS 4.3.0

ModernMediasfuGeneric owns pagination, visible stream names, and consumer updates. For a custom renderer, use Pagination, FlexibleGrid, AudioGrid, autoAdjust, resumePauseStreams, and resumePauseAudioStreams only with the complete live room parameters.

import {autoAdjust} from 'mediasfu-reactjs';

export async function chooseConferenceColumns(participantCount: number) {
  const [mainColumns, sideColumns] = await autoAdjust({
    n: participantCount,
    eventType: 'conference',
    shareScreenStarted: false,
    shared: false,
    whiteboardStarted: false,
    whiteboardEnded: false,
  });
  return {mainColumns, sideColumns};
}

Use the supplied modern participant, co-host, panelist, permission, and breakout workspaces. ReactJS 4.2.9 does not publish every panelist and permission action as a stable standalone root function; do not deep-import them to recreate the supplied moderator workspace.

Continue with React participant workspaces and React collaboration controls.

Angular 2.3.1

Angular publishes Pagination, FlexibleGrid, ResumePauseStreams, and the room display services. It also publishes PanelistsModalComponent, PermissionsModalComponent, AddPanelist, RemovePanelist, FocusPanelists, UpdateParticipantPermission, BulkUpdateParticipantPermissions, UpdatePermissionConfig, and LaunchBreakoutRooms.

Use dependency injection with the active room parameters. Keep participant and room-wide permission changes separate in labels and confirmation messages.

This moderator facade makes that distinction explicit. The first action changes one participant's level; the second updates the room-wide capability policy:

import {Injectable} from '@angular/core';
import {
  UpdateParticipantPermission,
  UpdatePermissionConfig,
  type UpdateParticipantPermissionOptions,
  type UpdatePermissionConfigOptions,
} from 'mediasfu-angular';

@Injectable({providedIn: 'root'})
export class RoomModerator {
  constructor(
    private readonly participantPermission: UpdateParticipantPermission,
    private readonly roomPermissions: UpdatePermissionConfig,
  ) {}

  setParticipantLevel(
    request: UpdateParticipantPermissionOptions,
  ): Promise<void> {
    return this.participantPermission.updateParticipantPermission(request);
  }

  setRoomPolicy(request: UpdatePermissionConfigOptions): Promise<void> {
    return this.roomPermissions.updatePermissionConfig(request);
  }
}

See Angular participants and collaboration.

Vue 1.1.1

Vue's supplied room owns paging and active consumer state. The package root does not publish standalone Pagination, autoAdjust, or resumePauseStreams contracts, and it does not expose the same standalone panelist and permission action set as Angular, React Native, or Expo. Keep large-room and moderator workflows inside the supplied room and avoid internal imports.

See Vue participants and collaboration.

React Native 2.4.0

React Native exports Pagination, ModernPagination, autoAdjust, resumePauseStreams, panelist and permission modals, panelist updates, participant permission updates, room permission configuration, and breakout workspaces.

Run pagination and consumer changes through the mounted room. Test long lists, fast page changes, app backgrounding, and resumed remote video on physical devices. Do not treat a scrolled-off native view as a paused consumer.

See React Native participants and collaboration.

Expo 2.5.0

Expo exposes the same named pagination, consumer, panelist, permission, and breakout surfaces in its own 2.5.0 package. Use Expo's current room parameters; do not reuse a React Native options object or assume native and web view lifecycle are identical.

Test the same large-room page change on Android, iOS, and web, including a screen share and an active breakout.

See Expo participants and collaboration.

Flutter 2.3.0

Use MediasfuGeneric and its supplied Pagination for the first large-room release. The room coordinates visible participants and consumer changes. The supplied panelist, permission, and breakout workspaces are safer than manually constructing their option objects because the root import does not expose a complete low-level contract for every action.

Use BreakoutRoomsModal to prepare, start, update, and stop breakouts. Confirm destinations from room state before navigating a participant.

See Flutter participants and collaboration.

Android 1.0.5

Use the Android Compose room's pagination and current state. The Android publication includes the same room-core layout, consumer, panelist, permission, and breakout state as the KMP release, but Android lifecycle and media routing remain platform-specific.

Do not keep an off-page Android renderer attached merely because its participant still exists. Verify consumer and renderer cleanup during page changes, rotation, backgrounding, breakout movement, and final exit.

Kotlin Multiplatform 1.0.5

Kotlin supplies Pagination, MediaSfuEngine.autoAdjustLayout, MediaSfuEngine.resumePauseStreams, and Compose room state. It also supplies waiting/request responses, co-host responsibilities, panelist actions, participant permission updates, room permission configuration, and breakout UI.

import com.mediasfu.sdk.MediaSfuEngine
import com.mediasfu.sdk.model.EventType

suspend fun chooseLayout(engine: MediaSfuEngine, participantCount: Int) =
    engine.autoAdjustLayout(
        n = participantCount,
        eventType = EventType.CONFERENCE,
        shareScreenStarted = false,
        shared = false,
    )

Use the exact current 1.0.5 signature in your generated API reference; the returned layout is not consumer acknowledgement. Observe resumed media and the confirmed breakout state separately.

See Kotlin participants and collaboration.

Swift and Apple platforms 0.1.3

The hosted Apple room owns large-room rendering, page state, and supplied moderation panels. The Swift bridge opens the hosted workspaces; it does not publish a standalone Swift pagination engine, panelist editor, permission editor, or breakout assignment model for an app-owned renderer.

Keep an app-owned toolbar synchronized with the hosted controller and test large rooms, interruptions, rotation, and background restore on real Apple devices.

Unity 0.1.0-preview.2

Unity is application-rendered. Use CurrentRoom.Participants as the source list, page that list in the scene, and explicitly pause or resume consumers outside the visible page with PauseConsumerAsync and ResumeConsumerAsync.

foreach (var consumerId in consumerIdsLeavingTheVisiblePage)
    await client.PauseConsumerAsync(consumerId);

foreach (var consumerId in consumerIdsEnteringTheVisiblePage)
    await client.ResumeConsumerAsync(consumerId);

Unity exposes participant media control and waiting responses, but it does not publish the full panelist, room-permission, or breakout workspace contract of the supplied UI SDKs. Keep those controls out of the scene until a documented client or backend contract is available.

Shared core 1.1.0

Shared core exports autoAdjust, resumePauseStreams, resumePauseAudioStreams, breakout start/stop helpers, panelist actions, updateParticipantPermission, and updatePermissionConfig. It renders none of them.

Your framework must keep page state, active display names, renderer lifecycle, consumer acknowledgement, authority, and error recovery synchronized. Use room-wide permission configuration only for product policy intended to affect the room; use participant permission updates for one person.

See Shared-core participants and collaboration.

Release checklist

• Test with more participants than one page can display.
• Page changes update both visible renderers and active consumers.
• Rapid next/previous actions cannot leave stale videos playing.
• Screen share, host video, and active speakers remain visible according to the product's layout policy.
• Host, co-host, panelist, and ordinary participant see different controls.
• One-person permissions and room-wide defaults are tested separately.
• Remove and ban labels match their actual effect and identity model.
• Breakout start, update, reconnect, movement, and stop are tested with participants in every destination.
• Leaving or ending the room releases off-page consumers and renderers.