Skip to content

Commit 889bce1

Browse files
committed
Tweaks README issues, bumps package.
1 parent d118cc6 commit 889bce1

File tree

3 files changed

+8
-437
lines changed

3 files changed

+8
-437
lines changed

README.md

+4-11
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,13 @@
11
# yall.js (Yet Another Lazy Loader)
22

33
<p align="center">
4-
<strong>ES5 (.js) version</strong>
5-
</p>
6-
<p align="center">
7-
<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.js?label=Uncompressed" alt="Uncompressed size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.js?compression=gzip&label=gzip" alt="gzip size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.js?compression=brotli&label=brotli" alt="Brotli size.">
8-
</p>
9-
<p align="center">
10-
<strong>ES6 (.mjs) version</strong>
11-
</p>
12-
<p align="center">
13-
<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.mjs?label=Uncompressed" alt="Uncompressed size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.mjs?compression=gzip&label=gzip" alt="gzip size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.min.mjs?compression=brotli&label=brotli" alt="Brotli size.">
4+
<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.js?label=Uncompressed" alt="Uncompressed size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.js?compression=gzip&label=gzip" alt="gzip size.">&nbsp;<img src="https://img.badgesize.io/malchata/yall.js/main/dist/yall.js?compression=brotli&label=brotli" alt="Brotli size.">
145
</p>
156

167
yall.js is a SEO-friendly lazy loader for `<video>` elements as well as CSS background images. It works in all modern browsers. It uses [Intersection Observer](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API) where available. yall.js can also monitor the DOM for changes using [Mutation Observer](https://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/) to lazy load elements that have been appended to the DOM after initial load, which may be desirable for single page applications.
178

9+
yall.js 4 removes lazy loading for `<img>`, `<picture>`, and `<iframe>` elements, as [native lazy loading](https://web.dev/browser-level-image-lazy-loading/) covers these use cases. However, yall.js 4 retains the ability to lazy load autoplaying `<video>` (ala animated GIFs), lazy loading `<video>` element `poster` images, as well as CSS background images.
10+
1811
To use yall, grab `yall.min.js` (or `yall.min.mjs` if you're the modern sort) from the `dist` directory and slap it on your page. You can also install it with npm:
1912

2013
```shell
@@ -23,7 +16,7 @@ npm install yall-js
2316

2417
## Usage
2518

26-
This is version 3 of yall.js, and introduces breaking changes over all prior versions. This is simplest way to initialize yall.js:
19+
This is version 4 of yall.js, and introduces a named export named `yall` rather than a single default export:
2720

2821
```javascript
2922
// Import y'all

0 commit comments

Comments
 (0)