Persistent Images
Register and reuse in-memory images by keys.
This is particularly useful for avoiding redundant image decoding and preload before rendering.
Usage
It's recommended to declare images in global scope so Takumi can identify and cache them with WeakSet reference to the image object.
The image can be used in image's src field or background-image, mask-image CSS property.
import { } from "@takumi-rs/image-response";
import type { PersistentImage } from "@takumi-rs/core";
const [, ] = await .([
("/logo.png").(() => .()),
("/background.png").(() => .()),
]);
const : PersistentImage[] = [
{
: "my-logo",
: ,
},
{
: "background",
: ,
},
];
export function () {
return new (< />, {
,
});
}
function () {
return (
<
={{
: "url(background)",
}}
>
< ="my-logo" />
</>
);
}Edit on GitHub
Last updated on