FrontEndDev
28.3K subscribers
2.32K photos
23 videos
7.52K links
🚀 Статьи, новости, туториалы по frontend разработке.

https://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

Читать на парковке: https://max.ru/front_end_dev

Реклама: https://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
SVG Marching Ants — эффект бегущих по границе точек

https://css-tricks.com/svg-marching-ants/
#css

Как сделать импорт Sass файла в любой компонент Vue приложения

https://css-tricks.com/how-to-import-a-sass-file-into-every-vue-component-in-an-app/
#js

Как уменьшить влияние JavaScript на время загрузки вашей страницы

https://engineering.gosquared.com/improve-javascript-page-load-time
#typescript

Школа магии TypeScript: дженерики и расширение типов

https://habr.com/company/ruvds/blog/426729/
typeof Everything и утиные недоразумения

https://habr.com/post/427253/
#js

ES2018 — метод промисов finally

https://habr.com/company/ruvds/blog/427405/
#css

Неполный список ошибок в проектировании CSS

https://wiki.csswg.org/ideas/mistakes
#js

Каррирование функций в JavaScript

https://habr.com/company/ruvds/blog/427295/
#html

Соединение ДНК HTML с помощью атрибутов селекторов CSS

https://www.smashingmagazine.com/2018/10/attribute-selectors-splicing-html-dna-css/
#web

Что нового в Microsoft Edge в Windows 10 October 2018 Update

https://blogs.windows.com/msedgedev/2018/10/04/edgehtml-18-october-2018-update/
#web

Аннотированный webpack 4 Config для разработки фронтенда

https://nystudio107.com/blog/an-annotated-webpack-4-config-for-frontend-web-development
​​​​Заполняем пробелы - event flow

На этой неделе получил стажера для подготовки к собедесованию во внутреннюю лабораторию.
Это мой первый опыт менторства, и я подумал, что это хорошая возможность заполнить свои пробелы в теории / практикe.

Первый пробел касается темы событий - погружение и всплытие. Всегда четко помнил про второе - всплытие. Погружение напрочь вылетело.
Возможно, некоторые из вас тоже забыли стадии event flow:
- capture (перехват)
- target (цель)
- bubbling (всплытие)

Отловить событие на стадии перехвата можно, передав true в качестве 3 аргумента функции addEventListener

Немного о целевом элементе event.target:
event.target – это исходный элемент, на котором произошло событие,
event.currentTarget (он же this) - элемент, на котором выполняется обработчик.

Т.е если повесили обработчик на form:
event.currentTarget - элемент формы,
event.target - элемент внутри формы, на котором произошло событие.

Ссылки по теме:
https://learn.javascript.ru/event-bubbling
https://developer.mozilla.org/ru/docs/Web/API/EventTarget/addEventListener

Если у вас есть что добавить или если я где-то наврал, пишите в личку @jem_jem, разберемся ;)