LiveKit docs › Getting started › Best practices

---

# Best practices

> Recommendations for creating apps using LiveKit React components.

## Use LiveKit components for lower-level features

You can create custom React components for your LiveKit app. For lower-level features (for example, mic toggle), however, LiveKit components are built using utility state handling hooks. LiveKit strongly recommends you use these instead of creating your own implementation because they manage React state handling and have been rigorously tested. Lower-level features include input device toggling, and audio and video tracks:

- [StartAudio](https://docs.livekit.io/reference/components/react/component/startaudio.md)
- [StartMediaButton](https://docs.livekit.io/reference/components/react/component/startmediabutton.md)
- [TrackToggle](https://docs.livekit.io/reference/components/react/component/tracktoggle.md)
- [TrackLoop](https://docs.livekit.io/reference/components/react/component/trackloop.md)

If you do create custom components, use the provided hooks for state. For example, to create a custom mic toggle button, use `useTrackToggle`:

```typescript
const { buttonProps, enabled } = useTrackToggle(props);
  return (
    <button ref={ref} {...buttonProps}>
      {(showIcon ?? true) && getSourceIcon(props.source, enabled)}
      {props.children}
    </button>
  );

```

## Using hooks for current state

LiveKit recommends using [hooks](https://docs.livekit.io/reference/components/react/concepts/building-blocks.md#hooks) to get the most current information about room state. For example, to get a list of active tracks or participants in a room:

- [useParticipants](https://docs.livekit.io/reference/components/react/hook/useparticipants.md)
- [useTracks](https://docs.livekit.io/reference/components/react/hook/usetracks.md)

## Updating props for the LiveKitRoom component

Updating props for the `LiveKitRoom` component should _not_ result in the component being repeatedly unmounted and remounted. This results in `Client initiated disconnect` errors and cause users to be repeatedly disconnected and reconnected to the room.

---

This document was rendered at 2026-06-07T11:32:03.581Z.
For the latest version of this document, see [https://docs.livekit.io/reference/components/react/guide.md](https://docs.livekit.io/reference/components/react/guide.md).

To explore all LiveKit documentation, see [llms.txt](https://docs.livekit.io/llms.txt).