React Native project runs slower using a simplified boolean expression

I've been playing around with Cellular Automata in React Native. I use an array of objects containing the view for one row of cells (the CellRow Component below), and return every CellRow from that array using the map function in the parent component.

const CellRow = (props) => {
  const arr = props.arr
  const yOffset = props.count

  let mappedRow = arr.map((cell, index) => {
    if ((index > arrayOffset - 1 && index < arraySize - arrayOffset) && cell === 1) { // OG expression
      // if (cell && index < arraySize + (-1 && arrayOffset) && index > -1 + arrayOffset) {

        return (
        <View key={index} style={{ width: cellSize, height: cellSize, backgroundColor: "black", position: 'absolute', top: yOffset * cellSize, left: (index * cellSize) - (arrayOffset * cellSize) }} />
      )
    }
  })

  return (
    <View >
      {mappedRow}
    </View>
  )

}

Here is a screenshot: Rule 30 shown

Everything works as expected so I've been cleaning my code, and thought I should try simplifying any boolean expressions. I took the if statement in my CellRow component

if ((index > arrayOffset - 1 && index < arraySize - arrayOffset) && cell === 1)

put it into a boolean algebra calculator, and it returned this:

if (cell && index < arraySize + (-1 && arrayOffset) && index > -1 + arrayOffset)

The new expression seemed to work just as well. But, after a few pages of generating cells, the app begins to slow down drastically. Rows appear slower and slower even at the start of a new page when the array being mapped is empty.

I fixed this by switching back to my old expression, but am very confused why the new expression worked but performed much worse. Does react have some preference for the way boolean logic should be expressed?


This expression does not need to be simplified, and the version the "calculator" gave you is wrong.

  1. Your version is readable, correct, and already simplified.
  2. Unless you are running this test millions of times per second, computers are VERY fast at simple math so this isn't the cause of your performance issue.
  3. The simplified version you got doesn't make any sense and probably causing other issues like going out of range.
  4. Never trust some random tool to generate optimized code for you. The interpreter and the engine are already doing a good job of that.