title: In terms of performance, what is the best-practices way to load images into a JS gallery?
body: <p>I'm building a gallery from scratch that is rendered completely with Javascript/JQuery.</p>
  
  <p>The gallery consists of ~70 photos. The gallery UI will just be previous and next buttons (no thumbnails).</p>
  
  <p>In terms of performance (reduced load times), what is the best-practices way to load the images?</p>
  
  <p>Here are the different techniques I'm considering:</p>
  
  <ol>
  <li><p>On page load, just load the first image, and preload the rest.</p></li>
  <li><p>When the user clicks the "next" button to request an image, use JS to create and append the image tag.</p></li>
  </ol>