Untitled

function ListBad({ rows }) {
  const expensive = rows.sort((a, b) => a.title.localeCompare(b.title)); // muta y es costoso

  return (
    <ul>
      {expensive.map((row) => (
        <li key={row.id}>
          <label>
            <input
              type="checkbox"
              checked={row.selected}
              onChange={() => { /* handler inline: referencia nueva */ }}
            />
            {row.title}
          </label>
        </li>
      ))}
    </ul>
  );
}