Dynamic heading not showing in view src but visible in inscpect element

const head = computed(() => {
  const perspectiveData = perspectiveDataG.value;
  const title = perspectiveData?.meta?._seopress_titles_title || '';
  const description = perspectiveData?.meta?._seopress_titles_desc || '';
  const imageUrl = perspectiveData?.featured_image_src || '';

  return {
    title,
    meta: [
      { hid: 'description', name: 'description', content: description },
      { hid: 'og:title', property: 'og:title', content: title },
      { hid: 'og:description', property: 'og:description', content: description },
      { hid: 'og:type', property: 'og:type', content: 'website' },
      { hid: 'og:image', property: 'og:image', content: imageUrl },
      {
        hid: 'og:url',
        property: 'og:url',
        content: `https://${config.public.DOMAIN}/blogs/${route.name}`,
      },
      { name: 'twitter:card', content: 'summary_large_image' },
      { hid: 'twitter:title', name: 'twitter:title', content: title },
      { hid: 'twitter:description', name: 'twitter:description', content: description },
      { hid: 'twitter:domain', property: 'twitter:domain', content: config.public.DOMAIN },
      {
        hid: 'twitter:url',
        property: 'twitter:url',
        content: `https://${config.public.DOMAIN}/${route.name}`,
      },
      { hid: 'twitter:image', name: 'twitter:image', content: imageUrl },
    ],
  };
});

useHead(() => head.value);