infinite-scroll-loader.js

var load = () => {
  var loader = document.createElement('div')
  loader.style.backgroundColor = 'white'
  loader.style.width = '100vw'
  loader.style.height = '100vh'
  loader.style.position = 'fixed'
  loader.style.zIndex = 1000
  loader.style.display = 'flex'
  loader.style.alignItems = 'center'
  loader.style.justifyContent = 'center'
  loader.style.fontSize = '11px'
  loader.style.fontWeight = 'bold'
  loader.style.color = '#c9c9c9'
  loader.style.textTransform = 'uppercase'
  loader.style.letterSpacing = '.2em'
  loader.style.transition = '.5s'
  loader.style.opacity = '0'

  loader.textContent = 'Loading...'

  var scrollHeight = -Infinity
  var date, animationFrameRequest

  var scroll = () => {
    if(scrollHeight !== document.body.scrollHeight) {
      document.body.scrollTop = scrollHeight = document.body.scrollHeight
      cancelAnimationFrame(animationFrameRequest)

      setTimeout(() => {
        date = Date.now()
        animationFrameRequest = requestAnimationFrame(scroll)
      }, 600)
    }
    else if(Date.now() - date < 4000) animationFrameRequest = requestAnimationFrame(scroll)
    else {
      cancelAnimationFrame(animationFrameRequest)
      loader.style.opacity = 0
      setTimeout(() => document.body.removeChild(loader), 500)
    }
  }

  document.body.appendChild(loader)
  setTimeout(() => { loader.style.opacity = 1 }, 1)
  setTimeout(() => {
    date = Date.now()
    scroll()
  }, 510)
}