`{lang="html"} or loading in a JavaScript framework using `<script>`{lang="html"} tags. While setting tags in a HTML document is dead simple, JavaScript frameworks have moved us well away from the days of pure HTML into a world of fully dynamic client-side pages and server-side rendering. Modern JavaScript applications need to render code outside the app entry (typically `<div id="app"></div>`{lang="html"}) in both a server-rendered and client-rendered environment. The role of the "head manager" is then to manage the tags in the `<head>`{lang="html"} and all tags outside the app entry. ```html <!DOCTYPE html> <html>  <head>  </head> <body>   <div id="app"></div>   </body> </html> ``` ## Introducing Unhead Unhead was built as a universal head manager for JavaScript applications. Initially allowing frameworks such as Vue and Nuxt, to offload the complex work of managing the head to a standalone library. While many frameworks themselves implement solutions for managing the above tags, it can be difficult to maintain for the diverse ways tags can be inserted into the document. As Unhead is a dedicated library it can innovate on the head management developer experience, providing an ecosystem of plugins and integrations that can be used across all frameworks. ## Innovating on Head Management - Lazy DOM Patching with tiny DOM diffing engine - Fully typed API with MDN documentation - Flat SEO meta tags with `useSeoMeta()`{lang="ts"} - Schema.org support with `useSchemaOrg()`{lang="ts"}

--- title: "Unhead: Full Stack Head Manager" description: Learn how Unhead can help you manage the head of your document in both server and client-rendered environments. navigation: title: Introduction to Unhead --- ## What is head manager? Adding tags in your ``{lang="html"} is one of the fundamental tasks in web development. Whether it be setting a page title using ``{lang="html"} or loading in a JavaScript framework using `<script>`{lang="html"} tags. While setting tags in a HTML document is dead simple, JavaScript frameworks have moved us well away from the days of pure HTML into a world of fully dynamic client-side pages and server-side rendering. Modern JavaScript applications need to render code outside the app entry (typically `<div id="app"></div>`{lang="html"}) in both a server-rendered and client-rendered environment. The role of the "head manager" is then to manage the tags in the `<head>`{lang="html"} and all tags outside the app entry. ```html <!DOCTYPE html> <html>  <head>  </head> <body>   <div id="app"></div>   </body> </html> ``` ## Introducing Unhead Unhead was built as a universal head manager for JavaScript applications. Initially allowing frameworks such as Vue and Nuxt, to offload the complex work of managing the head to a standalone library. While many frameworks themselves implement solutions for managing the above tags, it can be difficult to maintain for the diverse ways tags can be inserted into the document. As Unhead is a dedicated library it can innovate on the head management developer experience, providing an ecosystem of plugins and integrations that can be used across all frameworks. ## Innovating on Head Management - Lazy DOM Patching with tiny DOM diffing engine - Fully typed API with MDN documentation - Flat SEO meta tags with `useSeoMeta()`{lang="ts"} - Schema.org support with `useSchemaOrg()`{lang="ts"} - Script API with `useScript()`{lang="ts"}