Hearth and zerg rush, paste into developer console in chrome.

js-fun.js

function rotate(element = $("body"), time = 20, turn = 1) {
  element.style.transition = `all ${20}s ease-in-out`;
  element.style.transform = `rotate(${turn}turn)`;
}

rotate($("body"));

// find all and spin

function findAll(element) {
  return [...element.childNodes].reduce((acc, node) => {
    const children = [...node.childNodes];
    const grandkids = children.reduce(
      (acc, child) => [...acc, ...findAll(child)],
      []
    );

    return [...acc, ...children, ...grandkids];
  }, []);
}

function spin(element = $("#rso")) {
  const elements = findAll(element);

  elements.reverse().forEach((element, index) =>
    setTimeout(() => {
      if (element.style) {
        element.style.transition = "all 2s ease-in-out";
        element.style.transform = "rotate(1turn)";
      }
    }, index * 10)
  );

  const delay = elements.lenght * 10;

  elements.forEach((element, index) =>
    setTimeout(() => {
      if (element.style) {
        element.style.transition = "all 0.2s ease-in-out";
        element.style.transform = "rotate(0turn)";
      }
    }, delay + index * 10)
  );
}

spin();

// zerg rush
function findAll(element) {
  return [...element.childNodes].reduce((acc, node) => {
    const children = [...node.childNodes];
    const grandkids = children.reduce(
      (acc, child) => [...acc, ...findAll(child)],
      []
    );

    return [...acc, ...children, ...grandkids];
  }, []);
}

findAll($("body"))
  .reverse()
  .forEach((element, index) =>
    setTimeout(() => {
      const text = element.innerText;

      if (!text) {
        return;
      }

      text.split("").forEach(() =>
        setTimeout(() => {
          element.textContent = element.innerText
            .split("")
            .slice(-1)
            .join("");
        }, index * 100)
      );
    }, index * 10)
  );

// hearth
function showHearth() {
  document.querySelector("body").textContent = "";

  const flex = document.createElement("div");
  const box = document.createElement("div");
  flex.classList.add("flex");
  box.classList.add("box", "hearth");
  box.textContent = "❤️";
  flex.appendChild(box);

  window.document.body.appendChild(flex);

  document.querySelector("style").textContent = `
  .flex {
    display: flex;
    width: 100%;
    min-height: 100vh;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: pink;

  }
  .box {

  }
  .hearth {
    animation: spin infinite 10s linear;
    font-size: 100px;
  }
  @keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  `;
}

// zerg rush with hearth
function findAll(element) {
  return [...element.childNodes].reduce((acc, node) => {
    const children = [...node.childNodes];
    const grandkids = children.reduce(
      (acc, child) => [...acc, ...findAll(child)],
      []
    );

    return [...acc, ...children, ...grandkids];
  }, []);
}

findAll($("body"))
  .reverse()
  .forEach((element, index, elements) =>
    setTimeout(() => {
      const text = element.innerText;

      if (!text) {
        return;
      }

      text.split("").forEach(() =>
        setTimeout(() => {
          element.textContent = element.innerText
            .split("")
            .slice(-1)
            .join("");
        }, index * 10)
      );

      if (index === elements.length - 1) {
        setTimeout(() => {
          showHearth();
        }, index * 10 + 1000);
      }
    }, index * 10)
  );