Preload strategy

[adaniello]

Hi, have any chance to have a preload strategy to fast load with high numbers of pages?

Thanks

[martinhbramwell]

I do this:

      function buildPageDiv(index, spec, path) {
        const imageSpec = document.createElement('img');
        imageSpec.setAttribute('src', `${path}/${spec.page}.jpg`);
        imageSpec.setAttribute('alt', `${spec.page}`);
        imageSpec.setAttribute('class', 'responsive');

        const pageImage = document.createElement('div');
        imageSpec.setAttribute('class', 'page-image');
        pageImage.appendChild(imageSpec);

        const pageContent = document.createElement('div');
        imageSpec.setAttribute('class', 'page-content');
        pageContent.appendChild(pageImage);

        const pageSpec = document.createElement('div');
        imageSpec.setAttribute('class', 'my-page');
        imageSpec.setAttribute('data-density', spec.density);
        pageSpec.appendChild(pageContent);

        return pageSpec;
      }

      document.addEventListener('DOMContentLoaded', function() {
          console.log("DOM loaded")
          const book = document.getElementById("book")


          let output = '';
          let imagesPath = 'img';
          pageSpecs.forEach(function (pageSpec, idx) {
            pageSpec = buildPageDiv(idx, pageSpec, imagesPath);
            book.appendChild(pageSpec);
          });

          console.log("All loaded")
          const pageFlip = new St.PageFlip(
              document.getElementById("book"),
              {
                  width: 550, // base page width
                  height: 733, // base page height
               :                     :                     :                
               :                     :                     :                

You could alter that to run buildPageDiv as a timer call back. Timers are resource intensive so you might need to break it into batches of N pages at a time.

[Garito]

Is this dumb?:

<link rel="prefetch" href="<img's url>" />