Set react context without useEffect

In my app I'm using a react context to store data like, is the page loading, is the network available and the title for the breadcrump.

const defaultValueForContext = {
    breadcrumb: null,
    networkState: window.navigator.onLine ? 'online' : 'offline',
    isLoading: false
}

If the breadcrump in null I display a Header1, else Header2 with its title. Header1 is a default header. I set my breadcrump title in a component that I need it with useEffect.

useEffect(() => setContext({ breadcrumb: { title: 'Breadcrump title' } }), [])

My problem is where I have that Header2. If I change something on that page that makes the component to re-render, first it takes that default header ( Header1 ) and when content renders, the useEffect sets the breadcrump title and that makes my header to 'flash'.

Is there a way to set the context value before the content renders ( without useEffect ), to get rid of that 'flash' ?