Are Layout's rendered serverside?

[manic stratus]

react router v7 with SPA mode

im getting this error: ReferenceError: Audio is not defined

i have a hook that does this:

const ref = useRef(useMemo(() => new Audio(audioSrc), [audioSrc]));

and theres a component in the layout that uses that hook

i added "use client"; to the hook file and i think it works now ? this should be documented IMO

no it doesnt work, it was the react refresh making it seem like it works, the error persists when i f5

[valid oak]

https://reactrouter.com/how-to/spa#important-note

React Router will still server render your index route to generate that index.html file. This is why your project still needs a dependency on @react-router/node and your routes need to be SSR-safe. That means you can't call window or other browser-only APIs during the initial render, even when server rendering is disabled.

[manic stratus]

oh i see

effects run on the client right? (safe to use browser api's)

[valid oak]

Correct.