Feature/schema

app/app.vue

@@ -26,6 +26,19 @@ useSeoMeta({
   twitterCard: 'summary_large_image'
 })
 
+useSchemaOrg([
+  defineOrganization({
+    name: 'MavonEngine',
+    url: 'https://mavonengine.com',
+    logo: 'https://mavonengine.com/favicon.ico',
+    sameAs: ['https://github.com/mavonengine']
+  }),
+  defineWebSite({
+    name: 'MavonEngine',
+    description: 'Full-stack Three.js game engine for single-player and multiplayer browser games.'
+  })
+])
+
 provide('navigation', navigation)
 </script>
 

app/pages/[...slug].vue

@@ -57,6 +57,23 @@ useSeoMeta({
 
 const headline = computed(() => findPageHeadline(navigation?.value, page.value?.path))
 
+const breadcrumbItems = computed(() => {
+  const items: { name: string, item?: string }[] = [{ name: 'Home', item: 'https://mavonengine.com/' }]
+  if (headline.value) {
+    const sectionSlug = (route.params.slug as string[])[0]
+    items.push({ name: headline.value, item: `https://mavonengine.com/${sectionSlug}` })
+  }
+  if (page.value?.title && page.value.title !== headline.value) {
+    items.push({ name: page.value.title, item: `https://mavonengine.com${route.path}` })
+  }
+  return items
+})
+
+useSchemaOrg([
+  defineWebPage(),
+  defineBreadcrumb({ itemListElement: breadcrumbItems })
+])
+
 const links = computed(() => {
   const links = []
   if (toc?.bottom?.edit) {

app/pages/index.vue

@@ -32,6 +32,108 @@ useSeoMeta({
   ogImage: 'https://mavonengine.com/community/assets/site-image-kipwrzwn.png',
   twitterImage: 'https://mavonengine.com/community/assets/site-image-kipwrzwn.png'
 })
+
+const faqSchemas: Record<string, object> = {
+  en: {
+    '@type': 'FAQPage',
+    'mainEntity': [
+      {
+        '@type': 'Question',
+        'name': 'What is a Three.js game engine?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'A Three.js game engine builds on top of Three.js\'s rendering to add the systems every game needs — physics, networking, entity management, animations, and tooling. Instead of wiring together separate libraries yourself, a game engine gives you all of that integrated and working together. MavonEngine is a Three.js game engine built specifically for browser games, with server-authoritative physics and multiplayer networking built in from the start.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'How is a Three.js game engine different from vanilla Three.js?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Three.js is a rendering library — it draws 3D scenes in the browser. A Three.js game engine like MavonEngine adds everything else: an entity system, state machines, physics simulation, real-time multiplayer networking, asset loading, animations, particles, and a level editor. You write less boilerplate and focus on game logic instead.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Can you build multiplayer games with Three.js?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Yes, but Three.js alone has no networking or physics — you have to integrate them yourself. MavonEngine solves this by running Rapier3D physics on the server alongside the client\'s Three.js scene, with WebRTC-based state synchronization built in. It handles the hard parts of multiplayer so you can focus on gameplay.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'What is the best Three.js game engine for multiplayer?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'MavonEngine is the only Three.js game engine purpose-built for multiplayer browser games. It runs a server-authoritative physics simulation in parallel with the client\'s Three.js world, giving you accurate hit detection, anti-cheat, and real-time state sync without building it from scratch.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Does a Three.js game engine handle physics?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'MavonEngine includes Rapier3D physics on both the server and client. The server runs the authoritative simulation — collision, hit detection, spatial queries — while the client uses physics for visual feedback. This split prevents cheating and keeps gameplay consistent across all players.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Is there a free Three.js game engine?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Yes. MavonEngine is free and open source. It includes rendering, physics, multiplayer networking, entity management, animations, particles, and a level editor — all at no cost.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'How do I start building a 3D browser game with Three.js?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'The fastest way is to scaffold a project with npx @mavonengine/create-bootstrap. This sets up a working Three.js game engine project with physics and multiplayer support in under a minute. Follow the Getting Started guide at mavonengine.com/getting-started to go from zero to a running game.' }
+      }
+    ]
+  },
+  de: {
+    '@type': 'FAQPage',
+    'mainEntity': [
+      {
+        '@type': 'Question',
+        'name': 'Was ist eine Three.js-Spieleengine?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Eine Three.js-Spieleengine baut auf dem Rendering von Three.js auf und fügt die Systeme hinzu, die jedes Spiel braucht — Physik, Netzwerk, Entity-Verwaltung, Animationen und Tooling. Statt separate Bibliotheken selbst zusammenzuführen, liefert eine Spieleengine all das integriert und funktionierend. MavonEngine ist eine Three.js-Spieleengine für Browserspiele — mit serverautoritativer Physik und Multiplayer-Netzwerk von Anfang an.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Was ist der Unterschied zwischen einer Three.js-Spieleengine und purem Three.js?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Three.js ist eine Rendering-Bibliothek — sie zeichnet 3D-Szenen im Browser. Eine Three.js-Spieleengine wie MavonEngine ergänzt alles Weitere: ein Entity-System, State Machines, Physiksimulation, Echtzeit-Multiplayer-Netzwerk, Asset-Loading, Animationen, Partikel und einen Level-Editor. Du schreibst weniger Boilerplate und konzentrierst dich auf die Spiellogik.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Kann man mit Three.js Multiplayer-Spiele bauen?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Ja, aber Three.js allein hat kein Netzwerk und keine Physik — du musst beides selbst integrieren. MavonEngine löst das, indem es Rapier3D-Physik auf dem Server neben der Three.js-Szene des Clients betreibt, mit WebRTC-basierter Zustandssynchronisierung. Es übernimmt die schwierigen Teile von Multiplayer, damit du dich auf das Gameplay konzentrieren kannst.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Was ist die beste Three.js-Spieleengine für Multiplayer?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'MavonEngine ist die einzige Three.js-Spieleengine, die speziell für Multiplayer-Browserspiele entwickelt wurde. Sie betreibt eine serverautoritäre Physiksimulation parallel zur Three.js-Welt des Clients — für präzise Treffererkennung, Anti-Cheat und Echtzeit-Zustandssynchronisierung, ohne es selbst aufbauen zu müssen.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Unterstützt eine Three.js-Spieleengine Physik?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'MavonEngine enthält Rapier3D-Physik auf Server und Client. Der Server führt die autoritäre Simulation aus — Kollision, Treffererkennung, räumliche Abfragen — während der Client Physik für visuelles Feedback nutzt. Diese Aufteilung verhindert Cheating und sorgt für konsistentes Gameplay bei allen Spielern.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Gibt es eine kostenlose Three.js-Spieleengine?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Ja. MavonEngine ist kostenlos und Open Source. Es enthält Rendering, Physik, Multiplayer-Netzwerk, Entity-Verwaltung, Animationen, Partikel und einen Level-Editor — alles kostenlos.' }
+      },
+      {
+        '@type': 'Question',
+        'name': 'Wie starte ich mit dem Bau eines 3D-Browserspiels mit Three.js?',
+        'acceptedAnswer': { '@type': 'Answer', 'text': 'Der schnellste Weg ist, ein Projekt mit npx @mavonengine/create-bootstrap zu erstellen. Das richtet ein funktionierendes Three.js-Spieleengine-Projekt mit Physik und Multiplayer-Unterstützung in unter einer Minute ein. Folge dem Erste-Schritte-Leitfaden unter mavonengine.com/de/getting-started, um von null zu einem laufenden Spiel zu kommen.' }
+      }
+    ]
+  }
+}
+
+const faqSchema = faqSchemas[locale.value] ?? faqSchemas.en
+
+useSchemaOrg([
+  faqSchema,
+  defineSoftwareApp({
+    name: 'MavonEngine',
+    operatingSystem: 'Web',
+    applicationCategory: 'GameApplication',
+    description: 'Full-stack Three.js game engine for single-player and multiplayer browser games — with server-authoritative physics, real-time networking, and a unified server-client architecture.',
+    url: 'https://mavonengine.com',
+    offers: {
+      '@type': 'Offer',
+      'price': '0',
+      'priceCurrency': 'USD'
+    },
+    keywords: 'threejs game engine, three.js, multiplayer browser games, webgl game engine, rapier physics'
+  })
+])
 </script>
 
 <template>

content/2.core-concepts/7.level-editor.md

@@ -8,5 +8,5 @@ navigation:
 Very early WIP — a level editor that loads directly from the running game instance on the page.
 
 ::div{class="rounded-xl overflow-hidden shadow-2xl my-6"}
-:video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full"}
+:video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full" title="MavonEngine Three.js Game Engine — Level Editor"}
 ::

content/9.prefabs/2.grass.md

@@ -5,7 +5,7 @@ navigation:
   icon: i-lucide-trees
 ---
 
-:video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6"}
+:video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6" title="MavonEngine Three.js Game Engine — Grass Prefab with Wind Simulation"}
 
 The `Grass` prefab renders an interactive grass field. Entities that implement `GrassAffectingEntity` will cause the grass to react to their presence (e.g. bend/part as a character walks through).
 

content/9.prefabs/3.water.md

@@ -5,7 +5,7 @@ navigation:
   icon: i-lucide-waves
 ---
 
-:video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6"}
+:video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6" title="MavonEngine Three.js Game Engine — Water Shader Prefab"}
 
 The `Water` prefab renders a water surface using a custom shader.
 

content/de/2.kernkonzepte/7.level-editor.md

@@ -8,5 +8,5 @@ navigation:
 Sehr frühes WIP — ein Level-Editor, der direkt aus der laufenden Spielinstanz auf der Seite lädt.
 
 ::div{class="rounded-xl overflow-hidden shadow-2xl my-6"}
-:video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full"}
+:video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full" title="MavonEngine Three.js-Spieleengine — Level-Editor"}
 ::

content/de/9.prefabs/2.gras.md

@@ -5,7 +5,7 @@ navigation:
   icon: i-lucide-trees
 ---
 
-:video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6"}
+:video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6" title="MavonEngine Three.js-Spieleengine — Gras-Prefab mit Windsimulation"}
 
 Das `Grass`-Prefab rendert ein interaktives Grasfeld. Entities, die `GrassAffectingEntity` implementieren, lassen das Gras auf ihre Anwesenheit reagieren (z.B. biegen/teilen, wenn ein Charakter hindurchläuft).
 

content/de/9.prefabs/3.wasser.md

@@ -5,7 +5,7 @@ navigation:
   icon: i-lucide-waves
 ---
 
-:video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6"}
+:video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-6" title="MavonEngine Three.js-Spieleengine — Wasser-Shader-Prefab"}
 
 Das `Water`-Prefab rendert eine Wasseroberfläche mit einem benutzerdefinierten Shader.
 

content/de/index.md

@@ -11,7 +11,7 @@ orientation: horizontal
 Three.js [Spieleengine]{.text-primary} für Single- & Multiplayer
 
 #description
-MavonEngine ist eine Three.js-Spieleengine für Echtzeit-Browserspiele — die einzige mit serverautoritativer Physik von Anfang an. Baue Single- oder Multiplayer-3D-Spiele mit einer einheitlichen Server-Client-Architektur, integrierter Physik und Echtzeit-Netzwerkfunktionen. Der Server betreibt eine vereinfachte Hitbox-Szene neben der vollständigen Three.js-Welt des Clients — für autoritativen Treffernachweis, Raycasting und räumliche Abfragen, ohne dem Client zu vertrauen.
+MavonEngine ist eine Three.js-Spieleengine für Echtzeit-Browserspiele — die einzige mit serverautoritativer Physik von Anfang an. Baue Single- oder Multiplayer-3D-Spiele mit einer einheitlichen Server-Client-Architektur, integrierter Physik und Echtzeit-Netzwerkfunktionen.
 
 #links
   :::u-button
@@ -170,7 +170,7 @@ Sehr frühes WIP — ein Level-Editor, der direkt aus der laufenden Spielinstanz
 
 #default
   :::div{class="rounded-xl overflow-hidden shadow-2xl"}
-  :video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full"}
+  :video{src="/static/levelEditor.mp4" autoplay loop muted playsinline controls class="w-full" title="MavonEngine Three.js-Spieleengine — Level-Editor"}
   :::
 ::
 
@@ -188,13 +188,13 @@ Sofort einsatzbereite Prefabs, die von der Community erstellt wurden — von Umg
 
   :::div{class="grid grid-cols-1 lg:grid-cols-2 gap-6"}
     ::::div
-    :video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-4"}
+    :video{src="/static/grassPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-4" title="MavonEngine Three.js-Spieleengine — Gras-Prefab mit Windsimulation"}
 
     **Gras** — Üppige, performante Grasfelder mit Windsimulation und LOD-Unterstützung. Füge es in deine Szene ein und konfiguriere Dichte, Schwingung und Farbe in Sekunden.
     ::::
 
     ::::div
-    :video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-4"}
+    :video{src="/static/waterPrefab.mp4" autoplay loop muted playsinline controls class="w-full rounded-xl mb-4" title="MavonEngine Three.js-Spieleengine — Wasser-Shader-Prefab"}
 
     **Wasser** — Einfacher Wasser-Shader. 3 LODs + Grundanpassungen — sofort einsatzbereit.
     ::::
@@ -228,7 +228,7 @@ Die meisten Multiplayer-Browserspiele werden mit Klebeband zusammengehalten. Mav
   Server + Client-Einheit
 
   #description
-  Schreibe Spiellogik einmal und sie funktioniert auf Server und Client. Das gemeinsame Entity-System eliminiert Duplikation und Drift.
+  Schreibe Spiellogik einmal und sie funktioniert auf Server und Client. Das gemeinsame Entity-System eliminiert Duplikation und Drift. Der Server betreibt eine vereinfachte Hitbox-Szene neben der vollständigen Three.js-Welt des Clients — für autoritativen Treffernachweis, Raycasting und räumliche Abfragen, ohne dem Client zu vertrauen.
   :::
 
   :::u-page-feature
@@ -315,6 +315,42 @@ MavonEngine ist eine Three.js-Spieleengine für Browserspiele — Single-Player
 ::
 
 
+::u-page-section
+#title
+Häufig gestellte Fragen
+
+#default
+  ::accordion
+    :::accordion-item{label="Was ist eine Three.js-Spieleengine?"}
+    Eine Three.js-Spieleengine baut auf dem Rendering von Three.js auf und fügt die Systeme hinzu, die jedes Spiel braucht — Physik, Netzwerk, Entity-Verwaltung, Animationen und Tooling. Statt separate Bibliotheken selbst zusammenzuführen, liefert eine Spieleengine all das integriert und funktionierend. MavonEngine ist eine Three.js-Spieleengine für Browserspiele — mit serverautoritativer Physik und Multiplayer-Netzwerk von Anfang an.
+    :::
+
+    :::accordion-item{label="Was ist der Unterschied zwischen einer Three.js-Spieleengine und purem Three.js?"}
+    Three.js ist eine Rendering-Bibliothek — sie zeichnet 3D-Szenen im Browser. Eine Three.js-Spieleengine wie MavonEngine ergänzt alles Weitere: ein Entity-System, State Machines, Physiksimulation, Echtzeit-Multiplayer-Netzwerk, Asset-Loading, Animationen, Partikel und einen Level-Editor. Du schreibst weniger Boilerplate und konzentrierst dich auf die Spiellogik.
+    :::
+
+    :::accordion-item{label="Kann man mit Three.js Multiplayer-Spiele bauen?"}
+    Ja, aber Three.js allein hat kein Netzwerk und keine Physik — du musst beides selbst integrieren. MavonEngine löst das, indem es Rapier3D-Physik auf dem Server neben der Three.js-Szene des Clients betreibt, mit WebRTC-basierter Zustandssynchronisierung. Es übernimmt die schwierigen Teile von Multiplayer, damit du dich auf das Gameplay konzentrieren kannst.
+    :::
+
+    :::accordion-item{label="Was ist die beste Three.js-Spieleengine für Multiplayer?"}
+    MavonEngine ist die einzige Three.js-Spieleengine, die speziell für Multiplayer-Browserspiele entwickelt wurde. Sie betreibt eine serverautoritäre Physiksimulation parallel zur Three.js-Welt des Clients — für präzise Treffererkennung, Anti-Cheat und Echtzeit-Zustandssynchronisierung, ohne es selbst aufbauen zu müssen.
+    :::
+
+    :::accordion-item{label="Unterstützt eine Three.js-Spieleengine Physik?"}
+    MavonEngine enthält Rapier3D-Physik auf Server und Client. Der Server führt die autoritäre Simulation aus — Kollision, Treffererkennung, räumliche Abfragen — während der Client Physik für visuelles Feedback nutzt. Diese Aufteilung verhindert Cheating und sorgt für konsistentes Gameplay bei allen Spielern.
+    :::
+
+    :::accordion-item{label="Gibt es eine kostenlose Three.js-Spieleengine?"}
+    Ja. MavonEngine ist kostenlos und Open Source. Es enthält Rendering, Physik, Multiplayer-Netzwerk, Entity-Verwaltung, Animationen, Partikel und einen Level-Editor — alles kostenlos.
+    :::
+
+    :::accordion-item{label="Wie starte ich mit dem Bau eines 3D-Browserspiels mit Three.js?"}
+    Der schnellste Weg ist, ein Projekt mit `npx @mavonengine/create-bootstrap` zu erstellen. Das richtet ein funktionierendes Three.js-Spieleengine-Projekt mit Physik und Multiplayer-Unterstützung in unter einer Minute ein. Folge dem [Erste-Schritte-Leitfaden](/de/getting-started), um von null zu einem laufenden Spiel zu kommen.
+    :::
+  ::
+::
+
 ::u-page-section
   :::u-page-c-t-a
   ---