Сергей Новиков

Может ваше решение в 2000е еще бы казалось бы нормальным, но сейчас есть и технологии и удобные библиотеки для этого. Попробуйте сделать такое на canvas, например, с помощью paper.js. Если хорошо поискать, наверняка есть хотя бы 50% решение такой задачи.

Генераторы - это одно, промисы/async/await - другое. Генератор по сути - функция, которая запоминает свое внутреннее состояние (1, 2, 3). Генераторы нужны для создания "сложных" последовательностей.
Async/await (1, 2) задуманы как альтернатива промисам, т.к. промисы хоть и решают проблему callback hell, но все равно сложны для чтения. При этом async/await все еще экспериментальный функционал, поэтому без Babel тут не обойдешься (который собственно сведет async/await к промисам).

А cookie/localStorage не вариант? Тогда AJAX запрос, где PHP записывает в файл.

function hello(event) {
  console.log("Hello, ", event.target);
}

$("#example1").on("click", hello);
$("#example2").on("click hover", hello);
$("#example3").on("mouseenter mouseleave", hello);

https://jsfiddle.net/3rmye8on/

При открытии модалки добавьте для html { padding-right: 17px }.

Почему 17px? Это размер скролбара в Window. Конечно решение не идеальное, но в большинстве библиотек используют его.

$(document).on("click", "div", function (event) {
  $(event.target).draggable();
});

https://jsfiddle.net/xb1rmr0u/

Да хоть Bootstrap Carousel. Индикаторы делаете не точками, а треугольниками и все.

Да вроде никто не запрещает использовать список шрифтов, один не доступен, используй следующий.
font-family: Roboto, ..., sans-serif;

Попробуйте это. Давно не обновлялось, но все еще работает.

А зачем писать свои костыли, если за тебя уже написали другие? В jQuery можно решить некоторые вещи в одну короткую строчку, за место n-строчного решения на pure JS.