# How useContent works

Source: https://docs.arcxp.com/en/products/publishing-platform/how-usecontent-works.html

On **server-side render**, `useContent` immediately returns the data in cache for the content source. The system uses the first server-side render pass to gather all the content source requests and the second to make the data available. 

On **client-side render**, `useContent` first returns the data that is in cache. If your component rendered on the server-side, then it should have some data in cache. If the data is not expired, the system makes no additional render. If the data is missing (if the server-side render failed or if the component is rendered on only the client-side) or expired, the `useContent` hook makes a request to get fresh data. If that request succeeds, the component calling the `useContent` hook re-renders with the new data. A functional component always re-renders when the data from a hook changes. (You can experiment with `useContext` for a pure React example).

In the event of a fetch failure, if you don’t catch the `useContent` failures, the React component throws an exception, which stops the render of anything in that component. You can handle error scenarios of `useContent` and make your feature component not render anything or render a fallback content or a placeholder.

Following React’s rule of hooks, you should never conditionally call a hook. If you don’t want to use the data from the hook, you can call `useContent` and then ignore the results when you’re rendering on server-side. If you prefer to avoid the call completely, you could pass a null value into the source for the `useContent`.
