Infinite scrolling 25,000 records?

[sibertius]

I have played with infinitive scrolling with some success, Used Javascript to get the offset and let the server load next 100 records from the database.

const tbody = document.querySelector('tbody');

tbody.addEventListener('scroll', function () {
  if (tbody.scrollHeight - tbody.scrollTop <= tbody.clientHeight) {
    let rows = document.querySelectorAll('tr');
    let offset = rows[rows.length - 1].rowIndex;
    next_page(offset);
  }
});

function next_page(offset) {
  let url = '/tsk/tr/' + offset

  fetch(url)
    .then((res) => res.text())
    .then((response) => {
      tbody.insertAdjacentHTML('beforeend', response);
    })
    .catch((error) => alert("Error content:", error));
}

This works as I expected, but I think this can be improved. If you have any suggestions, I should be thankful.

[m_hutley]

I mean, i’d be happy enough with that code… though i dont know if i’d be happy with scrolling through 25,000 records.

[sibertius]

@m_hutley

I mean, i’d be happy enough with that code

I think there is a need for fast scrolling down to 24,999? Is there a need for that? I have no experience of infinitive scrolling, so all feedback is welcome. What do you think of the live version?

[m_hutley]

@sibertius

Is there a need for that?

I can’t answer that question for you, because I dont know your dataset or audience use case. But if there is a reasonable need for someone to go straight to 24,999, I dont think scrolling is the solution anymore.