Андрей

Полезность итераторов в том что это открытый интерфейс для любой структуры данных. Как вы уже поняли, любой класс/объект в JS может обладать интерфейсом итератора. Идея итератора в том чтобы скрыть внутреннее представление структуры данных от потребителя этих данных. Например, если вы работаете с какими-либо замысловатыми структурами данных, типа бинарных деревьев. Пользователю совсем не обязательно знать как ваш класс/объект хранит бинарное дерево. Пользователь просто его получает и проходит по всем его элементам в цикле. В дальнейшем, вы можете, при необходимости, заменить одну структуру данных на другую, не меняя самого пользователя. Например, вы можете заменить бинарное дерево на б-дерево прозрачно для самого пользователя (пользователь не будет знать что вы подменили структуры, он по прежнему получает что-то что можно проитерировать и ему этого достаточно).

Для того чтоб глубже понять суть вопроса, можно погуглить про инкапсуляцию и SOLID (в вашем случае, принцип Open/closed).

Попробую на пальцах объяснить.

Событие – это конверт, на котором написано его название. Внутрь конверта можете вложить что-нибудь, а можете оставить конверт пустым.

Элемент – это столик. Кто угодно может подойти и положить на столик свой конверт.

Слушатель – это мужик, который топчется около столика и смотрит, нет ли чего с интересующим его названием. Может несколько человек поджидать конвертики с определённым названием – прочтут все, если только в конверте не написано «по прочтении съесть» – тогда кто-то съест и дальше не передаст.

Как создать/отправить конверт. В любом месте кода создайте конверт и дайте ему название: var myEvent = new Event('teaTime'); Остается положить конверт на нужный столик:

document.getElementById('stolik').dispatchEvent(myEvent);

Чтобы в событие вложить какие-то данные, нужно использовать другой конструктор и передать нагрузку в поле detail:

var event = new CustomEvent('saySomething', { detail: "Hello there!" });

Для чего нужно создавать свои события? Чтобы развязать куски кода. Например, в разных местах документа можно нажать на кнопку повторяющегося виджета. Виджет создаст на document событие "widgetClicked". А ещё несколько одинаковых компонентов в странице, слушающих document на предмет события "widgetClicked", получат пинок и что-нибудь вытворят.

Я бы посоветовал вам устроиться на некоторое время работать в офис. Работа в команде очень сильно помогает поднять свой уровень. В этом есть несколько плюсов:
1. У вас всегда под рукой есть ментор, который может подсказать как решить поставленую перед вами конкретную задачу. Знания, получаемые таким образом, усваиваются намного лучше. Вы лучше понимете, как применять свои навыки.
2. К окманде работает несколько человек, каждый со своим мнением и кругозором. Общение на обеде, за кофе и на обсуждениях проектов поможет ваам расширить свой профессиональный кругозор. Вы узнаете про многие технологии. В данный момент они вам не понадобытся, но вы будете знать о них, во время принятия решений в будущем.
3. Устраиваясь на работу в офис стажером (или новичком, в общем неопытным специализстом), вы ставите в известность своего работодателя. Он в замен на пониженый оклад (у начинающего программиста ЗП, конечно ниже), помогает вам обучаться, выделяя вам ментора и давая практику.
4. Вы преобретаете опыт решения реальных кейсов. В дальнейшем вы будете знать, как решается большинство типовых задач.
5. В спокойной, но реальной обстановке получите опыт обучения "на лету" и поиска нужного материала.

Я, когда начинал, тоже страдал такой проблемой. Год работы в комманде из 7 программистов стал для меня сильнейшим рывком. За этот год я поднялся больше, чем за предядущие три года самообучения. Поработал, получил опыт (и кучу положительных эмоций от общения с коллегами), потом спокойно перешел на удаленку.

Мой вам совет: поработайте некоторое время в команде.

Ангуляр сложный. Лучше глянь vuejs. После jquery он более понятен чем другие js фреймворки. И поэтому учится быстрее. React тоже норм но vue проще.
https://vuejs.org/
И ещё один аргумент в пользу vuejs - у него 75к звездочек, а у ангуляра 57к.

Уменьшите битрейт и разрешение видео.
Переместите метаданные в начало mp4 контейнера
Установите preload="metadata"
htmlbook.ru/html/video/preload

Чтобы пиксели в глаза не бросались наложите на видео сеточку из маленьких черных точек
https://jsfiddle.net/soumyabg/wefLyrhp/
css background dotted overlay

Нужно настроить nginx примерно так:

location / {
    root /var/www;
    index index.html;

    try_files $uri $uri/ /index.html;
}

И в index.html указать <base href="/"> для того, чтобы относительные пути работали.