# When should I use the Slot component instead of the useContent hook?

Asked by Shauna Kelly on 2024-08-14. Tags: react, sdk, content.

Hi all, reading through the React SDK docs and I see there's both a `<Slot>`
component and a `useContent` hook that seem to do the same job. Is there an actual
difference in how they load content, or is it just ergonomics? I don't want to pick
one now and regret it later when the loading states start misbehaving

Cheers,
Shauna

## 1 answer

### Answer from dermot_k (2024-08-14)

They fetch content exactly the same way, so it really is ergonomics.

`<Slot>` is the declarative wrapper for the plain "render whatever the slot
returns" case. You give it the slot ID and a render function and you are done.

`useContent` gives you the content value directly, which is what you want when
the content feeds into custom logic, gets combined with other data, or is passed
down to components that should not know about Croct at all:

```tsx
const {title, ctaLabel} = useContent('home-hero', {
    fallback: {title: 'Welcome', ctaLabel: 'Get started'},
});
```

Loading behavior is identical: both rely on React Suspense while the content is
being fetched. So either way you need a `<Suspense>` boundary above the
component, or you pass an `initial`/`fallback` value so it can render
immediately without suspending.

My rule of thumb: start with `useContent`, reach for `<Slot>` when the component
is literally just a passthrough.

#### Reply from Shauna Kelly (2024-08-15)

Great, that settles it. Went with `useContent` plus a fallback and the loading
state is a non-issue. Cheers Dermot!
