I have next.js website that has a header using some profile data and pages that show the personal data e.g. profile/about, profile/settings, profile/items.
Header only retrieves login status and user display name.
Should I use fragments for splitting that code per page (every page will have to request its info + fragment for the profile header)? And profile header would be just a dummy component.
The profile header will fetch and render its data on every single page making a separate query. And webpage will run another query to retrieve per page data. If so, should it have a different query name and use a different storage key?
Which way is the better and why?
My key metrics: performance and good developer experience.