All Projects → JasonBoy → prefetch-image

JasonBoy / prefetch-image

Licence: MIT license
Prefetch all images for your web app, especially for mobile/h5 promotion pages

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to prefetch-image

wp-better-resource-hints
A WordPress plugin to help better manage resource hinting (preloading, prefetching, server pushing).
Stars: ✭ 18 (-18.18%)
Mutual labels:  prefetch, preloader
pure
Beautifully crafted minimalistic loading animations.
Stars: ✭ 14 (-36.36%)
Mutual labels:  preload-images, preloader
wp-quicklink
The WordPress plugin for quicklink. ⚡️ Faster subsequent page-loads by prefetching in-viewport links during idle time.
Stars: ✭ 61 (+177.27%)
Mutual labels:  prefetch
ensure-animation
Ensure animation runs until class loaded
Stars: ✭ 76 (+245.45%)
Mutual labels:  preloader
async-preloader
Assets preloader using ES2017 async/await and fetch.
Stars: ✭ 44 (+100%)
Mutual labels:  preloader
SysMainView
This tool is the result of a reverse engineering process of the Windows service called SysMain. Time to interact with the prefetch files !
Stars: ✭ 21 (-4.55%)
Mutual labels:  prefetch
offline-first-sw
Service worker example with 404 handling, custom offline page and max TTL for specific file types.
Stars: ✭ 82 (+272.73%)
Mutual labels:  prefetch
babl
JSON templating on steroids
Stars: ✭ 29 (+31.82%)
Mutual labels:  preloader
Friendly Code Editor
Try this Friendly Code Editor. You'll love it. I made it with a lot of effort. It has some great features. I will update it adequately later. Very helpful for developers. Enjoy and share.
Stars: ✭ 20 (-9.09%)
Mutual labels:  preloader
Preload Webpack Plugin
Please use https://github.com/vuejs/preload-webpack-plugin instead.
Stars: ✭ 2,174 (+9781.82%)
Mutual labels:  prefetch
Barba
Create badass, fluid and smooth transition between your website's pages.
Stars: ✭ 9,372 (+42500%)
Mutual labels:  prefetch
Quicklink
⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time
Stars: ✭ 9,176 (+41609.09%)
Mutual labels:  prefetch
Guess
🔮 Libraries & tools for enabling Machine Learning driven user-experiences on the web
Stars: ✭ 6,762 (+30636.36%)
Mutual labels:  prefetch
archer-svgs
异步加载svg解决方案
Stars: ✭ 23 (+4.55%)
Mutual labels:  prefetch
uitableview-prefetching
Demonstrating how to use prefetching with UITableView
Stars: ✭ 17 (-22.73%)
Mutual labels:  prefetch
resloader
🎉A image preloaded plugin and can display the loaded image progress bar
Stars: ✭ 20 (-9.09%)
Mutual labels:  preloader

prefetch-image npm

Prefetch all images for your web app, especially for mobile/h5 promotion pages.

Usage

npm install prefetch-image --save or yarn add prefetch-image

const prefetchImages = require('prefetch-image');
//or
//import prefetchImages from 'prefetch-image';

const images = [
  '/1.png',
  '/2.jpg',
  '/3.png',
];
prefetchImages(images, options)
  .then((result) => {
    //result is an array containing all the "Image" objects
    console.log('all images loaded!');
    //start init your page logic...
  });

// or with multiple domain object
const imagesOnMultipleDomains = {
  'http://domain1.com': ['/image1.png', '/image2.png'],
  'http://domain2.com': ['/image3.png', '/image4.png'],
};
prefetchImages(imagesOnMultipleDomains, options)
  .then((results) => {
    //result is an array containing all the "Image" objects grouped by domains, e.g
    //results = [${domain1ImagesArray}, ${domain2ImagesArray}]
    console.log('all images loaded!');
    //start init your page logic...
  });

Don't forget to add Cache-Control for your assets

Options

  • concurrency: number of images be loading concurrently on each domain, default: 6
  • debug: boolean, default false

LICENSE

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].