Neko.js: Vanilla‑JavaScript Desktop‑Pet für moderne Web‑Seiten
Key Takeaway
Neko.js ist ein leichtgewichtiges, vollkommen auf Vanilla‑JavaScript basierendes Tool, das das klassische Desktop‑Pet Neko in moderne Web‑Seiten integriert und sowohl von KI‑generiert als auch von menschlichem Feinschliff profitiert.
Summary
- Geschichte & Ziel
- Ursprung: klassische Desktop‑Pet‑Software „Neko“ (C++).
- Ziel: reine JavaScript‑Reimplementierung für Webseiten.
- Projektstart: KI‑gestütztes „vibe coding“ mit Claude Sonnet 4.5; anschließend manuelle Optimierung.
- Technische Merkmale
- Folgen des Mauszeigers, Idle‑Animationen, und fünf Verhalten‑Modi (Jagen, Flucht, Zufall, Flanieren, Balljagd).
- Pixel‑genaue Sprites (32 × 32 px) eingebettet; Datei ~38 KB unkomprimiert (≈14 KB brotli‑komprimiert).
- Zero‑Dependencies – ausschließlich Vanilla‑JavaScript.
- Unterstützt Konfiguration via
createNeko({ … })(Geschwindigkeit, FPS, Startposition, Verhalten‑Modus, Idle‑Schwelle, Klick‑Änderung).
- Installation & Nutzung
- Schnelle Einbindung per
<script src=".../neko.js" data-autostart></script>. - Optionaler Build‑Schritt (
python3 build.py) zum Packen der Sprites. - API‑Verwendung:
neko.start(),neko.stop(),neko.destroy().
- Schnelle Einbindung per
- Entwicklungsprozess
- Initiale KI‑Generierung durch 4 Prompt‑Sätze (Implementierung, Bugfix, Dokumentation, GitHub‑Integration).
- Manuelle Verbesserungen: vollständige Neuschreibung des Bewegungssystems, Korrektur von Flanken‑ und Kanten‑Erkennung, Klick‑Reaktion auf
mousedownstattclick. - Kosten & Ressourcen: $2,07, 26 min API‑Zeit, 1554 Zeilen hinzugefügt, 51 entfernt, Modelle Claude‑Haiku, Claude‑Opus 4.5, Claude‑Sonnet 4.5.
- Lizenz
- GNU General Public License v3.0, respektiert ursprüngliche Neko-Lizenz.
- Quellen & Credits
- Original‑Code von Masayuki Koba, Port von Louis Abraham.
- Source‑Download: web.archive.org.
- Lizenz‑ und README‑Dateien im Repository.
Related queries:
Wie implementiere ich Neko.js auf einer bestehenden Webseite?
Was sind die Vorteile der KI‑basierten Codegenerierung in diesem Projekt?
Wie kann ich Neko.js in einer Browser‑Erweiterung nutzen?
