# defineRenderLayer

```ts
import { defineRenderLayer } from "@pibbl/core";
```

`defineRenderLayer()` creates a Pibbl component from a
[`PibblRenderLayerDefinition`](/reference/types/canvas-runtime/#pibblrenderlayerdefinition)
that owns one external
`OffscreenCanvas` lifecycle for each mounted component identity. Its callbacks
create resources, receive updates and size changes, render synchronously, and
dispose resources on unmount. The returned component accepts
[`PibblRenderLayerComponentProps`](/reference/types/canvas-runtime/#pibblrenderlayercomponentprops)
alongside its custom props.

## API details from source

<span id="api-defineRenderLayer"></span>

Defines a Pibbl component backed by a persistent external-renderer surface and resource lifetime.
Pibbl schedules frames and commits the bitmap and interaction snapshot together; the definition
owns application-resource cleanup.

```ts
defineRenderLayer: <Props, Resources, Target extends object = object>(definition: PibblRenderLayerDefinition<Props, Resources, Target>) => PibblComponent<PibblRenderLayerProps<Props>>
```

Related API: [defineRenderLayer](/reference/functions/define-render-layer/), [PibblRenderLayerDefinition](/reference/types/canvas-runtime/#pibblrenderlayerdefinition), [PibblComponent](/reference/types/elements-components/#pibblcomponent), [PibblRenderLayerProps](/reference/types/canvas-runtime/#pibblrenderlayerprops).

### Parameters

- **`definition`** — Synchronous resource lifecycle, rendering, and interaction implementation.
See [PibblRenderLayerDefinition](/reference/types/canvas-runtime/#pibblrenderlayerdefinition) .

### Returns

A Pibbl component that owns one external-renderer boundary per mounted identity. See
[PibblComponent](/reference/types/elements-components/#pibblcomponent) , [PibblRenderLayerProps](/reference/types/canvas-runtime/#pibblrenderlayerprops) .

### See also

[PibblRenderLayerDefinition](/reference/types/canvas-runtime/#pibblrenderlayerdefinition)

[PibblComponent](/reference/types/elements-components/#pibblcomponent)

[PibblRenderLayerProps](/reference/types/canvas-runtime/#pibblrenderlayerprops)

[View source — packages/core/src/lib/render-layer/define-render-layer.ts:42](/source/packages/core/src/lib/render-layer/define-render-layer-ts/#L42)

## Implementation guidance for agents

Read the [External renderers and Three.js companion](/agents/topics/external-renderers/) for ownership, adaptation, failure modes, and verification. [Agent start](/agents/) provides the version-selection workflow.

## Complete minimal examples

- [Interactive bitmap layer](/minimal-examples/render-layers/bitmap-layer/): Draw a dot into an OffscreenCanvas and route clicks through Pibbl's event boundary. [Plain source](/minimal/render-layers/bitmap-layer.tsx)
## Interactive examples

- [Growing Reveal](/examples/growing-reveal/) · [Full page](/experience/growing-reveal/)
## Documentation version

Documentation built with @pibbl/core 0.0.2, revision 272a94a. ALPHA — NOT FOR PRODUCTION USE.