Unexpected behaviour on a shuffled hardcoded list with Solid Start

import { type JSXElement, For, createSignal } from 'solid-js';

export function shuffle<T extends unknown[]>(array: T): T {
  let currentIndex = array.length,
    randomIndex;

  // While there remain elements to shuffle.
  while (currentIndex > 0) {
    // Pick a remaining element.
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex--;

    // And swap it with the current element.
    [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];
  }

  return array;
}

export default function BeautifulPlaces(): JSXElement {
  const [places] = createSignal(
    shuffle([
      {
        name: 'Chengdu',
        image: '/images/chengdu.webp',
      },
      {
        name: 'Beijin',
        image: '/images/beijin.webp',
      },
      {
        name: 'Bamboo Forest',
        image: '/images/bamboo-forest.webp',
      },
      {
        name: 'Datong',
        image: '/images/datong.webp',
      },
    ]),
  );

  return (
    <div class="w-full overflow-x-auto xl:container mx-auto">
      <For each={places()}>
        {(place) => (
          <div
            style={{ 'background-image': `url('${place.image}')` }}
            class="min-w-[200px] h-64 flex items-end justify-center text-center text-text-light font-bold text-lg rounded-xl bg-cover bg-center"
          >
            <span class="block w-full bg-background-dark bg-opacity-70 rounded-b-xl">
              {place.name}
            </span>
          </div>
        )}
      </For>
    </div>
  );

import { type JSXElement, For, createSignal } from 'solid-js';

export function shuffle<T extends unknown[]>(array: T): T {
  let currentIndex = array.length,
    randomIndex;

  // While there remain elements to shuffle.
  while (currentIndex > 0) {
    // Pick a remaining element.
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex--;

    // And swap it with the current element.
    [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];
  }

  return array;
}

export default function BeautifulPlaces(): JSXElement {
  const [places] = createSignal(
    shuffle([
      {
        name: 'Chengdu',
        image: '/images/chengdu.webp',
      },
      {
        name: 'Beijin',
        image: '/images/beijin.webp',
      },
      {
        name: 'Bamboo Forest',
        image: '/images/bamboo-forest.webp',
      },
      {
        name: 'Datong',
        image: '/images/datong.webp',
      },
    ]),
  );

  return (
    <div class="w-full overflow-x-auto xl:container mx-auto">
      <For each={places()}>
        {(place) => (
          <div
            style={{ 'background-image': `url('${place.image}')` }}
            class="min-w-[200px] h-64 flex items-end justify-center text-center text-text-light font-bold text-lg rounded-xl bg-cover bg-center"
          >
            <span class="block w-full bg-background-dark bg-opacity-70 rounded-b-xl">
              {place.name}
            </span>
          </div>
        )}
      </For>
    </div>
  );