@lottiefiles/dotlottie-web 0.77.0 → 0.78.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +26 -0
- package/dist/dotlottie-player.wasm +0 -0
- package/dist/index.cjs +2 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +18 -5
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +18 -5
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/webgl/dotlottie-player.wasm +0 -0
- package/dist/webgl/index.cjs +2 -2
- package/dist/webgl/index.cjs.map +1 -1
- package/dist/webgl/index.d.cts +13 -0
- package/dist/webgl/index.d.cts.map +1 -1
- package/dist/webgl/index.d.ts +13 -0
- package/dist/webgl/index.d.ts.map +1 -1
- package/dist/webgl/index.js +2 -2
- package/dist/webgl/index.js.map +1 -1
- package/dist/webgpu/dotlottie-player.wasm +0 -0
- package/dist/webgpu/index.cjs +2 -2
- package/dist/webgpu/index.cjs.map +1 -1
- package/dist/webgpu/index.d.cts +13 -0
- package/dist/webgpu/index.d.cts.map +1 -1
- package/dist/webgpu/index.d.ts +13 -0
- package/dist/webgpu/index.d.ts.map +1 -1
- package/dist/webgpu/index.js +2 -2
- package/dist/webgpu/index.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
* [Introduction](#introduction)
|
|
16
16
|
* [What is dotLottie?](#what-is-dotlottie)
|
|
17
17
|
* [Documentation](#documentation)
|
|
18
|
+
* [Faster First Frame](#faster-first-frame)
|
|
18
19
|
* [Supported Platforms](#supported-platforms)
|
|
19
20
|
* [Browser Requirements](#browser-requirements)
|
|
20
21
|
* [Live Examples](#live-examples)
|
|
@@ -35,6 +36,31 @@ dotLottie is an open-source file format that bundles one or more Lottie animatio
|
|
|
35
36
|
|
|
36
37
|
To get started with `@lottiefiles/dotlottie-web`, follow the [documentation here](https://developers.lottiefiles.com/docs/dotlottie-player/dotlottie-web/).
|
|
37
38
|
|
|
39
|
+
## Faster First Frame
|
|
40
|
+
|
|
41
|
+
The player's WASM engine (\~500 KB compressed) is fetched from a CDN when the first player is constructed. To take that download off your first animation's critical path:
|
|
42
|
+
|
|
43
|
+
```js
|
|
44
|
+
import { DotLottie } from '@lottiefiles/dotlottie-web';
|
|
45
|
+
|
|
46
|
+
// At app or route load, before any player is constructed:
|
|
47
|
+
DotLottie.preload();
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Or let the browser start the download even earlier (`crossorigin` is required — without it the preloaded response can't be reused and the file downloads twice):
|
|
51
|
+
|
|
52
|
+
```html
|
|
53
|
+
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
|
|
54
|
+
<link
|
|
55
|
+
rel="preload"
|
|
56
|
+
as="fetch"
|
|
57
|
+
crossorigin
|
|
58
|
+
href="https://cdn.jsdelivr.net/npm/@lottiefiles/dotlottie-web@0.77.1/dist/dotlottie-player.wasm"
|
|
59
|
+
/>
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
The version in the URL must match your installed package version — the player fetches a version-pinned URL, and a mismatch means the preload can't be reused. If you use `setWasmUrl()`, call it before `preload()` and point the preload tag at the same URL.
|
|
63
|
+
|
|
38
64
|
## Supported Platforms
|
|
39
65
|
|
|
40
66
|
`@lottiefiles/dotlottie-web` is an isomorphic library designed to work in both browser and Node.js environments. It supports Node.js version 18 and higher, as well as all major web browsers.
|
|
Binary file
|