title: Efficiently showing large list in HTML
body: <p>Is there a javascript library that efficiently loads a giant list by only loading the viewable part of that list and faking the scrollbar?</p>
  
  <pre><code>&lt;div id='container'&gt;
    &lt;!-- Empty but height is set to take up space to fake scrollbar --&gt;
    &lt;div id='hidden-before'&gt;&lt;/div&gt;      
  
    &lt;!-- Preloaded in case the user scrolls up --&gt;
    &lt;div id='preload-before'&gt;&lt;/div&gt;
  
    &lt;!-- User can see this. Height == #container's height --&gt;
    &lt;div id='viewable-section'&gt;&lt;/div&gt;   
  
    &lt;!-- Preloaded in case the user scrolls down --&gt;
    &lt;div id='preload-after'&gt;&lt;/div&gt;
  
    &lt;!-- Empty but height is set to take up space to fake scrollbar --&gt;
    &lt;div id='hidden-after'&gt;&lt;/div&gt;       
  &lt;/div&gt;
  </code></pre>
  
  <p>Google Docs for example does this for large text documents.</p>
  
  <p>Note: What I am looking for is more complex than infinite scroll. Infinite scroll just waits for you to hit the bottom and it will load more data, enlarging the scrollbar. What I'm looking for will make you think all the data has been loaded because the scrollbars are faked. When you hit the bottom, you've actually hit the end of the list I want to show.</p>