[Feature] Dynamic Client-Side Document Header (head) Synchronization

[HaHiepThanh]

📋 Context & Problem Description

The gutter.Head widget currently allows injecting raw HTML, title, and metadata into the document header during Server-Side Rendering (SSR). This is critical for static SEO crawlers.

However, during client-side SPA routing (client-side transitions):

• The document head is not updated when new pages with different Head configurations are rendered.
• The document title (document.title) and Open Graph (OG) meta tags remain unchanged, leading to stale metadata.

💡 Proposed Solution & Implementation Plan

Create a head synchronization mechanism for the WASM client:

1. Client-Side Head Elements:
   Implement client-side behavior for Head widgets inside element_wasm.go. When a Head element is mounted or updated:
   • Dynamically query and update document.title.
   • Insert, update, or remove matching <meta> elements in the DOM head using syscall/js.
2. Namespace Management:
   Use specific data-attributes or classes to uniquely identify Gutter-controlled meta tags so that transitions do not duplicate elements.

🎯 Impact & Benefits

• Dynamic SEO & Sharing: Sharing SPA routes on social media platforms displays correct metadata.
• Polished UX: Document titles update seamlessly on navigation.

🏷️ Suggested Labels

feature, routing, wasm