Why does preact stop rerender cascades when signal is present?

[MicahZoltu]

In the following code, if you click the button you will see all 4 components rerender. However, if you uncomment the reference to the static signal apple in Child, clicking the button will now only rerender GrandParent and Parent.

Why is preact rendering Parent, Child, and GrandChild unnecessarily?

Why does adding a reference to a static signal change this behavior?

Should I be adding references to static signals to all of my components to prevent unnecessary rerender cascades?

const apple = new Signal('apple')
apple // stop typescript from complaining about unused locals

function GrandParent() {
	console.log('----')
	console.log('grandparent')
	const fruit = useSignal(-1)
	fruit.value // access the signal here to trigger a rerender of GrandParent
	return <div>
		<Parent/>
		<button onClick={() => fruit.value = fruit.peek() + 1}>add 1</button>
	</div>
}

function Parent() {
	console.log('parent')
	return <div>
		<Child/>
	</div>
}

function Child() {
	console.log('child')
	// apple.value // trigger re-render of this component when apple changes
	return <div>
		<GrandChild/>
	</div>
}

function GrandChild() {
	console.log('grandchild')
	return <div>Hello</div>
}