Count animation from number A to B

Question

I am updating a numeric value inside an element by doing intervalled ajax requests.

To make the whole thing a bit more alive,

Answer 1

Current solutions do update more often than needed. Here a frame based approach, which is accurate:

function animateValue(obj, start, end, duration) {
  let startTimestamp = null;
  const step = (timestamp) => {
    if (!startTimestamp) startTimestamp = timestamp;
    const progress = Math.min((timestamp - startTimestamp) / duration, 1);
    obj.innerHTML = Math.floor(progress * (end - start) + start);
    if (progress < 1) {
      window.requestAnimationFrame(step);
    }
  };
  window.requestAnimationFrame(step);
}

const obj = document.getElementById('value');
animateValue(obj, 100, -25, 2000);

div {font-size: 50px;}

100