https://github.com/molefrog/srcset-parse
🏙 Extra tiny `srcset` attribute parser ~150B
https://github.com/molefrog/srcset-parse
images micro-library responsive-images srcset zero-dependency
Last synced: 7 months ago
JSON representation
🏙 Extra tiny `srcset` attribute parser ~150B
- Host: GitHub
- URL: https://github.com/molefrog/srcset-parse
- Owner: molefrog
- Created: 2020-07-12T09:40:58.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2024-05-24T09:44:49.000Z (over 1 year ago)
- Last Synced: 2025-04-19T10:57:23.022Z (9 months ago)
- Topics: images, micro-library, responsive-images, srcset, zero-dependency
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/srcset-parse
- Size: 14.6 KB
- Stars: 16
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# srcset-parse
An extra small [`srcset`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-srcset)
attribute parser compliant with [the latest spec](https://html.spec.whatwg.org/multipage/images.html#srcset-attributes).
It's is inspired by the [**srcset** package](https://github.com/sindresorhus/srcset) and has following features:
- Extra tiny, only ~150B;
- Supports URLs that contain commas;
- Zero or one descriptors per image definitions are supported (like `2x` or `100w`, but not both!);
Example usage:
```js
import parse from "srcset-parse";
/**
* [
* { url: "hifi-cat.jpeg", density: 3 },
* { url: "lowfi-cat.jpeg", width: 128 },
* ]
*/
parse("hifi-cat.jpeg 3x, lowfi-cat.jpeg 128w");
```
### Using with TypeScript
The library is written in TypeScript, so you can import types if needed:
```js
import parse, { ImageCandidate } from "srcset-parse";
const result: ImageCandidate[] = parse("icon@2x.png 2x, icon.png 1x");
```
### Platform support
This library is written according to the _ES2015 standard_. Make sure your platform
supports it, or your project is configured to transpile external modules.