AnimalTracks.wiki
Project story & architecture

The Wildlife Encyclopedia That Rocks

What happens when you swap dry 19th-century taxonomy tables for punk rock, sludge metal, and evolutionary superpowers.

545 Curated Species
117 Music Genres
1,860 Biological FAQs
0 KB Framework Runtime
RFC 9110 Agent Ready
PART 1

The Idea: Wildlife Meets Soundtracks

1. Escaping the Dusty Phylum Tables

Traditional wildlife reference guides read like Victorian specimen catalogs. They bury young readers under Kingdom-Phylum-Class tables, Latin nomenclature lists, and dry habitat descriptions. On the other end of the spectrum, mass-produced children's sites rely on cookie-cutter trivia and low-effort summaries.

Curious early teens (and adults who still love nature) do not get hooked on biology through family trees. They get hooked through wild biological reality: the immortal jellyfish resetting its cellular clock when injured, the mantis shrimp striking fast enough to vaporize water into flash-points of light, and the honey badger taking a nap to metabolize puff adder venom before getting back to work.

The Goal: Create a modern encyclopedia built around extreme adaptations, kinetic striking forces, and chemical defenses, written with real wit and zero patronizing fluff.

2. The Biological Genre Formula

Every animal profile pairs its biological superpower with a hand-selected musical genre, artist, and track. But this is not random playlist padding. We enforce a strict editorial rule: never pair an animal by geographic stereotypes. A red kangaroo is never assigned didgeridoo music, and a giant panda is never paired with traditional folk instruments simply because of where they live.

Instead, matches are calculated from verifiable evolutionary physics:

Kinetic BPM

Rhythm and striking velocity. Erratic 1,200 BPM hummingbird wingbeats match hyperpop, while a 240 mph peregrine falcon stoop matches speed metal.

Acoustic Frequency

Sonic communication ranges. Deep-sea sperm whale clicks and blue whale infrasound match ambient drone and orchestral minimalism.

Courtship & Armor

Elaborate peacock spider tap dances match funk, while heavily armored pangolins and armadillos match desert stoner rock.

3. Clean Curation & Safety First

AnimalTracks is targeted at smart 11 to 14-year-olds, middle-school classrooms, and curious adults. That means content standards are non-negotiable:

  • Zero explicit tracks: Every single Spotify track is checked programmatically against the Spotify Web API (explicit: false) to ensure clean listening.
  • Blacklist on predatory actors: We maintain a strict editorial blacklist barring artists with criminal convictions or predatory abuse allegations.
  • Punchy editorial standards: Every profile is written with genuine voice, wit, and concrete biological measurements, strictly avoiding dry academic jargon, textbook padding, and formulaic clichés.
PART 2

Under the Hood: Technical Architecture

While the core concept is straightforward, the infrastructure is engineered for speed, low hosting costs, zero framework bloat, and full compatibility with modern web crawlers and autonomous agents.

PERFORMANCE

0-Island Static Delivery

Built with Astro 7 SSG and styled with Tailwind CSS 4. AnimalTracks delivers a 100% pre-rendered static site with zero client-side JavaScript framework overhead. No React, Vue, or Svelte runtime is loaded onto user devices.

Interactive UI features like the 5-photo crossfade gallery, the accessible slide-in drawer, and search triggers run on lightweight Vanilla TypeScript inside scoped scripts. Result: 0 KB framework hydration and near-instant load times designed for peak Core Web Vitals.

CLIENT-SIDE WASM

Decoupled Search Engine

Instead of running heavy server-side search databases or recurring third-party search subscriptions, global search is powered by Pagefind.

At build time, all 545 species profiles, scientific names, bands, and superpowers are indexed into a tiny WebAssembly payload. Users get instantaneous, typo-tolerant full-text search directly in the browser with zero server latency.

MEDIA PIPELINE

Sharp Image Optimization

Wildlife imagery is sourced ethically from Wikimedia Commons under Creative Commons licensing and optimized for high-density mobile displays.

Our Node.js pipeline uses Sharp to crop and compress imagery into responsive WebP tiers (800x450 card crops and 240x160 thumbnails). Automated audits apply an RGB color-variance threshold (variance >= 8.0) to filter out monochrome diagrams, while SHA-256 buffer hashing prevents duplicates. For rare species where only historical scientific plates currently exist, we progressively upgrade entries to live wild photography as open collections expand.

CONTENT NEGOTIATION

RFC 9110 Markdown Negotiation

AnimalTracks is built for both modern browsers and next-generation research tools, terminal clients, and autonomous agents. When a client requests any page with Accept: text/markdown, Nginx serves clean, token-dense Markdown instead of HTML.

Markdown responses cut payload size and token consumption by over 90% (~850 tokens versus ~9,500 HTML tokens for species profiles), accompanied by complete Schema.org JSON-LD, machine-readable /llms.txt, and Content Signals headers.

CI/CD Automated Quality Gates

Every code change and content addition must pass four automated quality gates before production release:

npm run audit:images
Blocks duplicate, monochrome and human-handled photos
npm run audit:vibes
Validates clean non-explicit Spotify tracks
npm run generate:markdown
Builds RFC 9110 negotiation files & llms.txt
npm run test
Vitest suites for the battle engine, quizzes and site rules

Ready to Explore?

Discover 545 creatures, compare combat stats, or test your personality match.