[Перевод] Делегирование событий в JavaScript: когда обычного всплытия недостаточно

По мере роста фронтенд-приложений управление пользовательскими взаимодействиями становится все более важным. Добавление обработчика событий на каждый интерактивный элемент — плохая практика: это усложняет код, увеличивает расход памяти и снижает производительность. Здесь на помощь приходит делегирование событий (event delegation). Каждая интерактивная веб-страница опирается на Document Object Model (DOM) и ее систему событий. Когда мы нажимаем кнопку, вводим текст в поле или наводим курсор на изображение, возникает событие. Но оно не происходит само по себе — событие проходит по дереву DOM в процессе, который называется распространением события (event propagation).

https://habr.com/ru/companies/timeweb/articles/940722/

#javascript #js #react #timeweb_статьи #event_delegation #event_propagation #делегирование_событий #распространение_событий #listener #timeweb_статьи_перевод

React: одна любопытная особенность порталов

Привет, друзья! В этой небольшой заметке я хочу рассказать вам об одной интересной особенности порталов в React, которую я долгое время упускал из виду, но которая на днях привела к любопытному багу. Речь идет о том, что структурно дерево React не всегда соответствует DOM. Полагаю, статья будет интересна всем разработчикам React, а также тем, кто любит разбираться с тонкостями работы JavaScript и браузерных API. Предполагается, что вы имеете некоторый опыт работы с React, и вам не надо объяснять, что такое порталы и для чего они нужны.

https://habr.com/ru/companies/timeweb/articles/828816/

#timeweb_статьи #javascript #reactjs #reactjs #react #portal #портал #event_propagation #event_bubbling #event #распространение_событий #всплытие_событий #событие