Conditional elements rendering out of order with only two siblings

[nicknisi]

Bug

If a sibling element is conditionally rendered, it is rendered out of order, unless there is a third node.

Package Version: 4.0.0

Code
A reproducible CodeSandbox: https://codesandbox.io/s/8n76x533y9 and
it's working in https://codesandbox.io/s/205y711wly because it has an extra sibling

class App extends WidgetBase {
  protected bigPredicate(contentRect: ContentRect) {
    return contentRect.width > 768;
  }
  protected render() {
    const { isBig } = this.meta(Resize).get("root", {
      isBig: this.bigPredicate
    });
    return (
      <div key="root">
        {isBig && <h1>First</h1>}
        <h2>Second</h2>
        {/* Adding a third node fixes it <h3>Third</h3> */}
      </div>
    );
  }
}

Expected behavior:

I would expect <h1>First</h1> to be rendered before <h2>Second</h2>.

Actual behavior:

<h2>Second</h2> is rendered before <h1>First</h1>.