Для подобных целей использую Mindjet MindManager 2016. В нём есть возможность создать граф или карту из задач. Это хозяйство можно отобразить в виде списка или диаграммы Ганта. Если задач получается очень много, то там есть фильтры.

//Вот так можно вывести количество прокрученных пикселей до блока
const el = document.querySelector('.target')
console.log(el.scrollTop)
//Вот так можно вывести высоту блока в пикселях
console.log(el.clientHeight)

Документация: scrollTop и clientHeight

Если вешаете что-то на скролл, то посмотрите ещё что-такое debounce и throttling.