Как реализована анимация в игре 2048 на JavaScript?

Вся анимация там сделана средствами css. Всего анимаций три:

Анимация появления и слияния блоков сделана через масштабирование элемента:

@include keyframes(pop) {
  0% {
    @include transform(scale(0));
  }

  50% {
    @include transform(scale(1.2));
  }

  100% {
    @include transform(scale(1));
  }
}

Перемещение блока сделано через изменение его координат. В данной игре не используется canvas, каждый блок на игровой сетке — это обычный div с применёнными стилями. Позиционирование блока на сетке происходит через задание элементу определённого класса. Например, для помещения блока в нижний правый угол ему задаётся класс tile-position-4-4 со следующим содержимым:

transform: translate(363px, 363px);

Эти классы сгенерированы автоматически через цикл с помощью SCSS (используется директива @for).

Ко всем блокам применено свойство transition:

position: absolute;
transition: 100ms ease-in-out;
transition-property: transform;

Поэтому при изменении своих координат блок не перепрыгивает резко, а плавно скользит от одного состояния к другому.

Все упомянутые стили и классы находятся в файле main.scss