Tap Tap Loot Wiki

Warum dieses Projekt

Tap Tap Loot ist ein Mobile-Idle-Tapping-Spiel, das wir selbst gezockt haben. Der Item-Katalog ist riesig - Gegner, Loot-Tabellen, Waffen, Rustungen, Upgrades - und wir wollten eine Referenz dafur bauen, die mit dem Spiel mitwachst.

Was gebaut wurde

Tap Tap Loot Wiki ist eine statisch generierte Next.js-Site mit einer prozeduralen Datenpipeline im Kern. Spieldaten werden nicht manuell in Content-Dateien eingetippt - sie werden von generate_wiki.js erzeugt, einem Node.js-Skript, das aus dem exportierten Datenformat des Spiels liest und das strukturierte JSON produziert, das der Next.js-Build konsumiert.

Kernfunktionen:

• Gegner-Index - jeder Gegner mit HP, Drop-Tabellen, Spawn-Orten und Schwächen
• Item-Datenbank - Waffen, Rüstungen, Verbrauchsgüter und passive Items mit vollständigen Stat-Breakdowns
• Loot-Tabellen - durchsuchbar nach Item-Name (welche Gegner droppen es) oder nach Gegner (vollständiger Drop-Pool)
• Upgrade-Planer - clientseitiger Rechner zur Planung von Upgrade-Pfaden für ein gegebenes Item-Set
• Pixelgenaues Rendering - Sprite-Sheets aus dem Spiel, gerendert bei 2x und 4x mit image-rendering: pixelated-CSS und Next.js unoptimized-Flag

Die Datenpipeline

Das ist die Architekturentscheidung, die ein wartbares Wiki von einer Haftung trennt.

generate_wiki.js ist ein Node.js-Skript, das den Datenexport des Spiels (ein Set aus CSV- und JSON-Dateien, das der Spielentwickler aus dem Editor erzeugen kann) nimmt und in das interne Datenschema des Wikis transformiert. Es läuft als Teil der Build-Pipeline: npm run generate && next build.

Der Output wird mit Zod validiert, bevor der Build fortfährt. Wenn die generierten Daten fehlende Pflichtfelder, falsche Typen oder ungültige Beziehungen haben (z.B. ein Loot-Tabellen-Eintrag referenziert eine Item-ID, die in der Item-Tabelle nicht existiert), schlägt der Build fehl. Die Fehlermeldung sagt genau, welcher Datensatz die Validierung nicht bestanden hat und warum.

Das bedeutet:

• Das Wiki für einen neuen Patch aktualisieren = generate_wiki.js ausführen und den Output pushen
• Ein fehlerhafter Datenexport vom Spielentwickler produziert einen klaren Build-Fehler, keinen stillen Null-Wert auf einer nutzerseitigen Seite
• Das Datenschema des Wikis ist explizit im Zod-Schema dokumentiert

Pixel-Art-Rendering

Next.js optimiert Bilder standardmäßig aggressiv - es konvertiert PNGs zu WebP oder AVIF und skaliert sie. Das ist für Pixel-Art genau falsch: Moderne Bildcodecs wenden verlustbehaftete Kompression an, die die scharfen Pixelgrenzen verwischt, die Pixel-Arts visuellen Stil definieren.

Die Lösung: unoptimized={true} auf der <Image>-Komponente für alle Spiele-Sprites, kombiniert mit image-rendering: pixelated-CSS. Die Sprites laden in ihrer nativen Größe (typisch 16×16 oder 32×32 Pixel) und CSS skaliert sie auf die Anzeigedimension mit Nearest-Neighbor-Interpolation - scharfe Pixelgrenzen bleiben erhalten.

Das ist ein kleines Detail, aber es ist der Unterschied zwischen einem Wiki, das zur Spielwelt gehört, und einem, das wie ein verschwommener Screenshot aussieht.

SEO-Architektur

Mobile-Game-Wikis konkurrieren mit Gamepedia-Seiten, die jahrelange Autorität aufgebaut haben. Bei Long-Tail-Suchen zu gewinnen (z.B. "tap tap loot [item-name]") erfordert technische Korrektheit und inhaltliche Tiefe.

Page-per-Item. Jeder Gegner, jede Waffe, jedes Rüstungsteil und jedes Verbrauchsgut hat eine eigene URL mit eigenem H1, eigener Meta-Description und strukturiertem Content. Google kann einzelne Items indexieren und direkt in Suchergebnissen liefern.

Strukturierte Daten. Item-Seiten verwenden an Spielitems angepasste strukturierte Daten; Index-Seiten nutzen ItemList, um die Beziehung zwischen Seiten an Googles Crawler zu kommunizieren.

Canonical-Handling. Items, die in mehreren Kategorien erscheinen, haben eine einzige kanonische URL, auf die alle Kategorie-Listings referenzieren.

Interne Link-Dichte. Jede Loot-Tabelle verlinkt auf Item-Seiten; jede Item-Seite verlinkt zurück auf Gegner, die sie droppen. Das schafft einen dichten Graphen, der Crawling-Effizienz und Page-Authority-Verteilung verbessert.

Ergebnis

Das Wiki gibt Tap Tap Loots Community eine Referenz, die sich mit dem Spiel aktualisiert statt hinter ihm zurückzubleiben. Die Datenpipeline bedeutet: Der Entwickler erzeugt nach einem Patch einen Datenexport, und nach einem fünfminütigen Build ist das Wiki aktuell - kein manuelles Content-Editing, kein Suchen in JSON-Dateien um Zahlen zu aktualisieren.