Aza Broflovski

У Sketch уже есть комьюнити. Есть куча ui-китов для него. Sketch легковесен и можно работать в связке Sketch + Principle. Но я не могу сказать, что XD плохой. В бету поиграл - понравился. Это просто вопрос вкуса. Какой интерфейс по душе, таким и пользуйтесь. Если нет Mac, то зачем издеваться над собой и делать из буханки троллейбус? При создании чего-то большого, с кучей слоев любой редактор начнет класть систему. Только виртуалка намного слабже, чем установленная винда.

SetInterval не нужен. Добавьте на основной слой со слайдами CSS анимацию, а слайдеру добавляйте только одну координату без всякого там интервала. Сгенерировать анимацию можно тут: matthewlein.com/ceaser

Координаты можно прокручивать в другой конец простой проверкой:

var max = 1000;

if (x < 0) {
    x = max;
} else if (x > max) {
    x = 0;
}

(Все это дико не академично, не корректно и воообще, но должно быть понятно):

Процедурный подход: есть последовательность команд. Каждая из них может содержать последовательность команд.

возьми_кофемашину();
налей_воды_в_кофемашину();
нажми_кнопку();
подставь_кружку();
вылей_кофе_в_кружку();
наслаждайся();

ФП - акцент на действии. Одни действия влекут за собой другие.

наслаждайся(
    своим_кофе(
        которое_сделала_кофемашина(
            в_которую_налили_воды())))

ООП - акцент на объектах. Любое действие совершает конкретный предмет

есть кофемашина;
есть кружка;
есть ты;

ты.имеешь(кружку)
кофемашина.имеет(кружку)
кофемашина.поехали();
ты.возьми_свою_кружку();
ты.наслаждайся();

function С(){
    this.a = 100; 
    // this - это новый объект, который будет присвоен переменной o.
    // т.е. свойство "a" - это свойство создаваемого объекта
}
С.prototype.b = 200;
//С - формально  это функция, логически у нас - это класс. Любая функция имеет прототип, с помощью которого мы можем добавлять свойства и методы для класса
//т.е. свойство "b" - это свойство прототипа, которое наследуется при создании объекта класса
var o = new C();

Теперь немного практики:

var CThis;
function C(){
    alert(this.b); // 200 (b - уже есть, т.к. это свойство прописано в прототипе)
    this.a = 100;
    CThis=this; // сохраним для исследований
}
C.prototype.b = 200; // дополняем в класс новое свойство
var o = new C();

alert(CThis == o); //true 
alert(o.prototype); //undefined (у объекта нет прототипа)
alert(o.constructor==C); //true (у объекта есть конструктор)
alert(o.constructor.prototype==C.prototype); //true

Native DOM Api - 0 байт для загрузки
В дополнение: polyfill.io - для исправления динозавров - от 0 байт до 100кб в зависимости от браузера

Крайне советую вам сделать выбор самому, поможет в этом: habrahabr.ru/post/267721 . Да и в будущем если вас спросят почему вы выбрали то или это, вы сможете обосновать, а не отвечать: "потому что так на тостере посоветовали"

Нормальные браузеры и IE8+

[].forEach.call(document.querySelectorAll('.elements div'), function (el) {
    el.addEventListener('click', function () {
         el.parentNode.removeChild(el);
    }, false);
});

function pureJSEvent(selector, event, callback) {
	var items = document.querySelectorAll(selector);
	for(var i=0; i<items.length; ++i)
		items[i][event] = callback;
}

pureJSEvent('.elements div', 'onclick', function(){
	this.remove();
});

Если существует множество условий, которые ведут к return, то тут может switch ... case и его способность проваливаться сквозь несколько условий, например так:

function test (a) {
    switch (a) {
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
        case 6:
            return;
        case 7:
            // other code
            break;
    }
}