markComponent

markComponent(fn) flags fn as a component — when the renderer sees a marked function as a child it invokes it untracked (signals read inside don't re-run the parent), which is the right semantic for components vs. reactive expressions. Hand-roll this when you build a component factory that bypasses JSX.

The flag can be read back with isComponent.

Arguments

name	type	description
fn	(...args) => T	the function to mark

Returns: the same fn, now tagged as a component.

Examples

Marked vs. plain function child

The same function body twice as a child: the plain one is a reactive expression that rebuilds its paragraph on every count change, the marked one runs once, untracked.

import { markComponent, render, signal } from 'pota'

function App() {
	const count = signal(0)

	const tracked = () => <p>rebuilt at count = {count.read()}</p>
	const marked = markComponent(() => (
		<p>created once at count = {count.read()}</p>
	))

	return (
		<div>
			<button on:click={() => count.update(n => n + 1)}>+1</button>
			{tracked}
			{marked}
		</div>
	)
}

render(App)