Prepended elements are always placed on top.

[thetarnav]

Element prepended will be displayed above it's siblings, instead of below, unlike how it would happen if rendered initially alongside it's siblings.

const [condition, setCondition] = s.createSignal(true);

document.addEventListener("keydown", (e) => {
  if (e.key === "Enter") {
    setCondition(!condition());
  }
});

return <>
  <view>
    {condition() && <view color={0xff0000ff} width={100} height={100} x={100} y={10}/>}
    <view color={0x00ff00ff} width={100} height={100} x={150} y={30}/>
  </view>
</>

before:

after:

When prepending elements, the order is correctly maintained in ElementNode.insertChild by using an anchor.
So ElementNode.children is correct, but the order of ElementNode.lng.children is not.

Not sure how to fix that when the lightning renderer doesn't support passing an anchor element.
The only way would be to manually correct parent.lng.children after lightning node is created.

[chiefcll]

Yes.. Lightning Renderer will sort children based on zIndex. Adding an element after moves it to top of the stack.

But probably should open an issue at https://github.com/lightning-js/renderer.

[chiefcll]

Need Renderer to fix: lightning-js/renderer#587