404Lyrics

Idee

Spotifys eigene Lyrics-Ansicht macht eine Sache richtig: die Synchronisation sitzt exakt, weil sie aus derselben Quelle kommt, die Spotify selbst nutzt. 404Lyrics übernimmt genau das und baut den Rest komplett neu. Die aktive Zeile steht im Zentrum, alles andere fällt mit Tiefenschärfe und sinkender Deckkraft zurück, und die Spalte gleitet so, dass die laufende Zeile immer auf derselben Leseposition bleibt — auf einem Hintergrund, der aus dem Coverbild gewonnen wird.

Farblich und thematisch passt das zum kpop-theme, läuft aber auch mit jedem anderen Spotify-Theme.

Wort-für-Wort-Karaoke

Ist die Option aktiv, fragt die App bei Netease Cloud Music nach echtem Wort-Timing (yrc bzw. klyric) für den laufenden Titel. Gibt es das, füllt sich die aktive Zeile Wort für Wort im Takt des Gesangs — bereits gesungene Wörter hell, das aktuelle füllt sich von links nach rechts, kommende bleiben gedämpft.

Netease wird ausschließlich für das Wort-Timing herangezogen; dessen zeilenweise Lyrics werden verworfen, damit ein möglicher Zeitversatz nie die exakte Synchronisation von Spotify verdrängt. Der Treffer wird zusätzlich über die Titellänge abgesichert (±4 Sekunden) — passt das nicht, fällt die Zeile auf normale Zeilen-Synchronisation zurück. Erfundenes Wort-Timing gibt es nicht: ohne echte Daten bleibt es beim Zeilen-Erlebnis, unverändert.

Ein optionaler Karaoke-Focus-Mode reduziert die Ansicht zusätzlich: Die aktive Zeile springt in Größe und Kontrast nach vorn, die beiden Nachbarzeilen bleiben lesbar, der Rest verblasst, und die Bedienelemente blenden sich von selbst aus.

Übersetzung ohne API-Key

Eine Spicetify-Custom-App ist reines Frontend-JavaScript — ein bezahlter oder mit Schlüssel geschützter Übersetzungsdienst würde diesen Schlüssel an jede Installation ausliefern. 404Lyrics nutzt stattdessen dieselben schlüssellosen Endpunkte, auf die auch Browser-Übersetzungserweiterungen setzen, in fester Reihenfolge durchprobiert, weil jeder für sich inoffiziell und einzeln ratenbegrenzt ist. Alle Anfragen laufen über Spicetify.CosmosAsync, den einzigen verlässlichen Weg an CSP und Browser-CORS vorbei.

Übersetzung ist standardmäßig aus — solange sie es ist, geht keine einzige Anfrage raus. Jede übersetzte Zeile landet zusätzlich in einem lokalen Cache mit bis zu 4000 Einträgen, sodass ein erneutes Öffnen desselben Titels nichts mehr kostet.

Kein Build-Schritt

Wie bei Zen Mode und Spicetify Stats lädt Spicetify die Dateien direkt — kein npm, kein Bundler, kein TypeScript, kein JSX. React-Elemente entstehen über einen kurzen h()-Helper um Spicetify.React.createElement.

Jeder Track-Wechsel bekommt ein monoton steigendes Token und einen eigenen AbortController; Übersetzungs-Batches zählt ein separater Generation-Counter mit. Lyrics, Cover-Farben, Karaoke und Übersetzung werden nur übernommen, wenn ihr Token noch aktuell ist — eine späte Antwort für einen bereits übersprungenen Titel kann so nie mehr anzeigen, was gerade nicht mehr stimmt.