Как предотвратить повторение одного и того же события? В настоящее время в результате нескольких слоев одного и того же события рендеринга

Question

Расширение

My Chrome при прокрутке страницы определенных сайтов снова и снова отображает один и тот же элемент, что приводит к снижению производительности. Рендеринг происходит в тот момент, когда я прекращаю прокрутку. Это приводит к тому, что несколько слоев одного слоя накладываются друг на друга. На изображении ниже вы можете видеть 3 слоя, уложенных друг на друга (см. Красную стрелку) и четвертый, который присоединится к ним (см. Синюю стрелку).

Вопрос. Как мне остановить дополнительные слои? Должен отображаться только один слой.

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

Это происходит не на каждой странице при прокрутке.

• Имеется ли НЕ на stackoverflow.com.
• Встречается ли с developers.google.com вот так one .

note ...

• черные ящики были Я удаляю любую конфиденциальную информацию.
• снимок экрана был сделан при просмотре слоев в Chrome DevTools.

Answer 1

После работы с другим инженером по этой проблеме выяснилось, что у нас есть фоновый скрипт, который использует прослушиватель событий, чтобы проверить, была ли завершена загрузка страницы, прежде чем переписать скрипт контента. Некоторые страницы на конце прокрутки будут запускать несколько завершенных событий, в результате чего мой компонент будет отображаться снова и снова. Мы исправили это, добавив еще один классификатор, чтобы убедиться, что после того, как страница была первоначально завершена, она не будет запускаться снова, независимо от того, сколько завершенных событий было выброшено страницей впоследствии.