Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

async-preloader

Package Overview
Dependencies
Maintainers
1
Versions
48
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

async-preloader - npm Package Compare versions

Comparing version 4.9.2 to 5.0.0

.github/workflows/main.yml

157

package.json
{
"name": "async-preloader",
"version": "4.9.2",
"version": "5.0.0",
"description": "Assets preloader using ES2017 async/await and fetch.",
"main": "lib/async-preloader.cjs.js",
"browser": "lib/async-preloader.umd.js",
"module": "lib/async-preloader.esm.js",
"jsnext:main": "lib/async-preloader.esm.js",
"types": "lib/index.d.ts",
"license": "MIT",
"repository": "https://github.com/dmnsgn/async-preloader",
"author": {
"name": "Damien Seguin",
"url": "https://github.com/dmnsgn/"
},
"engines": {
"node": ">=10.0.0"
},
"keywords": [

@@ -27,27 +13,44 @@ "preloader",

],
"homepage": "https://github.com/dmnsgn/async-preloader",
"bugs": "https://github.com/dmnsgn/async-preloader/issues",
"repository": "dmnsgn/async-preloader",
"funding": [
{
"type": "individual",
"url": "https://paypal.me/dmnsgn"
},
{
"type": "individual",
"url": "https://commerce.coinbase.com/checkout/56cbdf28-e323-48d8-9c98-7019e72c97f3"
}
],
"license": "MIT",
"author": "Damien Seguin (https://github.com/dmnsgn)",
"type": "module",
"main": "lib/index.js",
"types": "types/index.d.ts",
"scripts": {
"dev": "rollup -c -w -m inline --environment NODE_ENV:development",
"build": "rollup -c --environment NODE_ENV:production",
"test": "jest test/",
"jest": "jest test/ --watch --coverage --no-cache",
"lint": "eslint 'src/**/*.{js,ts}'",
"format": "prettier 'src/**/*.{js,ts}' --write",
"format:check": "prettier 'src/**/*.{js,ts}' --check",
"docs": "typedoc --out docs --mode modules --excludeExternals --includeDeclarations --module commonjs --theme default src && touch docs/.nojekyll",
"clean": "rm -rf lib && rm -rf docs",
"preversion": "npm run clean && npm run test",
"version": "npm run build && npm run docs && git add -A",
"postversion": "git push origin master && git push --tags && npm publish"
"jest": "jest test/ --watch --coverage --no-cache"
},
"jest": {
"collectCoverageFrom": [
"src/**/*.{ts,tsx,js,jsx}"
],
"coverageDirectory": "coverage",
"moduleFileExtensions": [
"json",
"ts",
"tsx",
"js",
"jsx"
],
"resolver": "jest-ts-webcompat-resolver",
"setupFiles": [
"<rootDir>/test/setupFile.js"
],
"coverageDirectory": "coverage",
"collectCoverageFrom": [
"src/**/*.{ts,tsx,js,jsx}"
],
"testEnvironmentOptions": {
"resources": "usable"
},
"testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(ts|js)x?$",
"transform": {

@@ -58,86 +61,24 @@ "^.+\\.(t|j)s$": "ts-jest"

"node_modules/(?!(fontfaceobserver-es)/)"
],
"testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(ts|js)x?$",
"moduleFileExtensions": [
"json",
"ts",
"tsx",
"js",
"jsx"
]
},
"devDependencies": {
"@types/jest": "^26.0.0",
"@types/node": "^14.0.13",
"@typescript-eslint/eslint-plugin": "^3.3.0",
"@typescript-eslint/parser": "^3.3.0",
"eslint": "^7.3.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-prettier": "^3.1.4",
"jest": "^26.0.1",
"jsdom": "^16.2.2",
"node-fetch": "^2.6.0",
"prettier": "^2.0.5",
"rollup": "^2.18.0",
"rollup-plugin-commonjs": "^10.1.0",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-typescript2": "^0.27.1",
"rollup-plugin-uglify": "^6.0.4",
"ts-jest": "^26.1.1",
"typedoc": "^0.17.7",
"typescript": "^3.9.5",
"xmldom": "^0.3.0"
},
"dependencies": {
"fontfaceobserver-es": "^3.3.3",
"tslib": "^2.0.0"
"tslib": "^2.1.0"
},
"eslintConfig": {
"parser": "@typescript-eslint/parser",
"extends": [
"eslint:recommended",
"plugin:prettier/recommended",
"plugin:@typescript-eslint/recommended"
],
"plugins": [
"prettier",
"@typescript-eslint"
],
"rules": {
"prettier/prettier": "error"
},
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module"
},
"env": {
"es6": true,
"browser": true
},
"overrides": [
{
"files": [
"test/**/*.js"
],
"parser": "esprima",
"extends": [
"eslint:recommended",
"plugin:prettier/recommended"
],
"plugins": [
"prettier"
],
"env": {
"es6": true,
"browser": true,
"jest": true,
"jasmine": true,
"node": true
}
}
]
"devDependencies": {
"@types/jest": "^26.0.21",
"@types/node": "^14.14.35",
"core-js": "^3.9.1",
"jest": "^26.6.3",
"jest-ts-webcompat-resolver": "^1.0.0",
"jsdom": "^16.5.1",
"node-fetch": "^2.6.1",
"ts-jest": "^26.5.4",
"typescript": "^4.2.3",
"xmldom": "^0.5.0"
},
"eslintIgnore": [
"node_modules"
]
"engines": {
"node": ">=15.0.0",
"npm": ">=7.0.0"
}
}
# async-preloader
[![Build Status](https://travis-ci.org/dmnsgn/async-preloader.svg?branch=master)](https://travis-ci.org/dmnsgn/async-preloader)
[![npm version](https://badge.fury.io/js/async-preloader.svg)](https://www.npmjs.com/package/async-preloader)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)
[![npm version](https://img.shields.io/npm/v/async-preloader)](https://www.npmjs.com/package/async-preloader)
[![stability-stable](https://img.shields.io/badge/stability-stable-green.svg)](https://www.npmjs.com/package/async-preloader)
[![npm minzipped size](https://img.shields.io/bundlephobia/minzip/async-preloader)](https://www.npmjs.com/package/async-preloader)
[![dependencies](https://img.shields.io/david/dmnsgn/async-preloader)](https://github.com/dmnsgn/async-preloader/blob/master/package.json)
[![types](https://img.shields.io/npm/types/async-preloader)](https://github.com/microsoft/TypeScript)
[![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-fa6673.svg)](https://conventionalcommits.org)
[![styled with prettier](https://img.shields.io/badge/styled_with-Prettier-f8bc45.svg?logo=prettier)](https://github.com/prettier/prettier)
[![linted with eslint](https://img.shields.io/badge/linted_with-ES_Lint-4B32C3.svg?logo=eslint)](https://github.com/eslint/eslint)
[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)
[![license](https://img.shields.io/github/license/dmnsgn/async-preloader)](https://github.com/dmnsgn/async-preloader/blob/master/LICENSE)
> Assets preloader using ES2017 async/await and fetch.
[![paypal](https://img.shields.io/badge/donate-paypal-informational?logo=paypal)](https://paypal.me/dmnsgn)
[![coinbase](https://img.shields.io/badge/donate-coinbase-informational?logo=coinbase)](https://commerce.coinbase.com/checkout/56cbdf28-e323-48d8-9c98-7019e72c97f3)
[![twitter](https://img.shields.io/twitter/follow/dmnsgn?style=social)](https://twitter.com/dmnsgn)
## Install

@@ -18,4 +28,4 @@

* [AsyncPreloader class](https://dmnsgn.github.io/async-preloader/classes/_index_.asyncpreloader.html)
* [AsyncPreloader types](https://dmnsgn.github.io/async-preloader/modules/_types_.html)
- [AsyncPreloader class](https://dmnsgn.github.io/async-preloader/classes/_index_.asyncpreloader.html)
- [AsyncPreloader types](https://dmnsgn.github.io/async-preloader/modules/_types_.html)

@@ -32,14 +42,14 @@ ## Quick start

const items = [
{ "id": "myDefaultFile", "src": "assets/default" },
{ "id": "myTextFile", "src": "assets/text.txt" },
{ "id": "myJsonFile", "src": "assets/json.json" },
{ "id": "myImageFile", "src": "assets/image.jpg" },
{ "id": "myVideoFile", "src": "assets/video.mp4" },
{ "id": "myAudioFile", "src": "assets/audio.mp3" },
{ "id": "myXmlFile", "src": "assets/xml.xml" },
{ "id": "mySvgFile", "src": "assets/xml.svg" },
{ "id": "myHtmlFile", "src": "assets/xml.html" },
{ "id": "myDefaultXmlFile", "src": "assets/xml", "loader": "Xml" },
{ "id": "myFont", "loader": "Font" },
{ "src": "assets/fileWithoutId" } // Can be retrieved with the src property eg. AsyncPreloader.items.get("assets/fileWithoutId")
{ id: "myDefaultFile", src: "assets/default" },
{ id: "myTextFile", src: "assets/text.txt" },
{ id: "myJsonFile", src: "assets/json.json" },
{ id: "myImageFile", src: "assets/image.jpg" },
{ id: "myVideoFile", src: "assets/video.mp4" },
{ id: "myAudioFile", src: "assets/audio.mp3" },
{ id: "myXmlFile", src: "assets/xml.xml" },
{ id: "mySvgFile", src: "assets/xml.svg" },
{ id: "myHtmlFile", src: "assets/xml.html" },
{ id: "myDefaultXmlFile", src: "assets/xml", loader: "Xml" },
{ id: "myFont", loader: "Font" },
{ src: "assets/fileWithoutId" }, // Can be retrieved with the src property eg. AsyncPreloader.items.get("assets/fileWithoutId")
];

@@ -53,10 +63,11 @@

pItems
.then(items => {
.then((items) => {
const element = AsyncPreloader.items.get("myVideoFile");
document.body.appendChild(element);
})
.catch(error => console.error("Error loading items", error));
.catch((error) => console.error("Error loading items", error));
```
---
Note: Font loader is using [FontFaceObserver](https://github.com/bramstein/fontfaceobserver)

@@ -77,7 +88,10 @@

// Returns a Promise with an array of LoadedValue
const pItems = AsyncPreloader.loadManifest("assets/manifest.json", "data.preloader.items");
const pItems = AsyncPreloader.loadManifest(
"assets/manifest.json",
"data.preloader.items"
);
pItems
.then(items => useLoadedItemsFromManifest(items)) // or AsyncPreloader.items.get("src or id")
.catch(error => console.error("Error loading items", error));
.then((items) => useLoadedItemsFromManifest(items)) // or AsyncPreloader.items.get("src or id")
.catch((error) => console.error("Error loading items", error));
```

@@ -97,10 +111,11 @@

// Returns a Promise with the LoadedValue
const pItem = AsyncPreloader.loadJson({ "src": "assets/json.json" });
const pItem = AsyncPreloader.loadJson({ src: "assets/json.json" });
pItem
.then(item => useLoadedItem(item))
.catch(error => console.error("Error loading item", error));
.then((item) => useLoadedItem(item))
.catch((error) => console.error("Error loading item", error));
```
---
Note: Using the loaders directly won't add the item to the `items` Map.

@@ -119,8 +134,11 @@ Alternatively you could use `AsyncPreloader.loadItem` and rely on the file extension or add `{ loader: "Json"}` to the item.

const audioContext = new AudioContext();
const pItem = AsyncPreloader.loadAudio({ src: "assets/audio.mp3", body: "arrayBuffer" });
const pItem = AsyncPreloader.loadAudio({
src: "assets/audio.mp3",
body: "arrayBuffer",
});
pItem
.then(item => audioContext.decodeAudioData(item))
.then(decodedData => useDecodedData(decodedData))
.catch(error => console.error("Error decoding audio", error));
.then((item) => audioContext.decodeAudioData(item))
.then((decodedData) => useDecodedData(decodedData))
.catch((error) => console.error("Error decoding audio", error));
```

@@ -136,3 +154,3 @@

const items = [
{ "id": "myDefaultFile", "src": "assets/default" } // ...
{ id: "myDefaultFile", src: "assets/default" }, // ...
];

@@ -145,6 +163,6 @@

await Promise.all(
items.map(async item => {
items.map(async (item) => {
const data = await AsyncPreloader.loadItem(item);
loadedCount++;
console.log(`Progress: ${100 * loadedCount / items.length}%`);
console.log(`Progress: ${(100 * loadedCount) / items.length}%`);
})

@@ -155,6 +173,7 @@ );

await preload();
})()
})();
```
---
Note: the example above uses the async functions (which is the core of this module). You'll need to transpile it if you are targetting older browsers (namely IE11). See support [here](https://caniuse.com/#feat=async-functions).

@@ -161,0 +180,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc