In my application (frontend nuxt, backend spring boot) I'm using JWT access tokens for authentication/authorization.
In my frontend I want to display the user's name and family name in all the pages where I have a little profile avatar image.
Since I'm not using the user's name, family name and email address for authentication/authorization purposes, what is the safest place to store this data in the frontend?
I just need them to show them in the UI. Nothing more
And I want this to be persisted when the browser closes or refreshes the page
The fields you mention are considered personally identifiable information (PII) and should be treated with care in frontend apps.
In an OAuth architecture for example, the secure option is for a fragment of the page to call the authorization server's user info endpoint, to get name details for display, then only manage them in memory. I would aim to follow this pattern.
If instead you issue these values to an ID token that the app can read, the data hangs around for an entire user session and may be revealed in unintentional ways.
For example, in an OpenID Connect logout an id_token_hint parameter is sometimes used, to identify the client. If this reveals PII it can be raised as a security issue in PEN tests.
There is nowhere secure to store such values in the browser. Avoid premature optimization, choose the secure option and get the values every time the page reloads.
An SPA architecture is meant to use frequent API requests. You can even run my Online SPA for an example.