Encontré un script aquí para consultar la actividad de la pestaña del navegador y quería combinar eso con una función que reproduce una pequeña animación de título cuando está inactiva.

Aparte del hecho de que todavía puedo optimizar el rendimiento de alguna manera, se muestran símbolos de error en cada lado cuando el tren ha pasado una vez.

Al principio pensé que era el emoji (dos emoji combinados), pero a otros también les pasa. ¿Alguien tiene una idea?

 var vis = (function () { var stateKey, eventKey, keys = { hidden: "visibilitychange", webkitHidden: "webkitvisibilitychange", mozHidden: "mozvisibilitychange", msHidden: "msvisibilitychange" }; for (stateKey in keys) { if (stateKey in document) { eventKey = keys[stateKey]; break; } } return function (c) { if (c) { document.addEventListener(eventKey, c); //document.addEventListener("blur", c); //document.addEventListener("focus", c); } return !document[stateKey]; }; })(); var storeTitle = document.title, myAnimation; function getLokTitle() { let title = "_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 🚂 ", //let title = "_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 🚄 ", i = 0; myAnimation = setTimeout(function () { setInterval(function () { document.title = title.substr(i, title.length) + title.substr(0, i); i = (i + 1) % title.length; if (vis() === true) { clearTimeout(myAnimation); document.title = storeTitle; return storeTitle; } }, 250); }, 1000); return title; } function getStoreTitle() { if (typeof myAnimation !== "undefined") { clearTimeout(myAnimation); } return storeTitle; } vis(function () { document.title = vis() ? getStoreTitle() : getLokTitle(); //console.log(new Date, 'visible ?', vis()); }); // to set the initial state document.title = vis() ? getStoreTitle() : getLokTitle();