Why does the component take a long time to render when changing the route?

Question

React

The essence of the problem is as follows. The first time the application is opened, a List component is created that sends a request to the server to load data. At this point, the preloader is displayed. As soon as the data is loaded, the table is drawn. Everything happens smoothly, but until we start changing the route. If we navigate to a different route and then return to the main page where the List component is located, we will notice a delay of about a second before changing the route, which is not very pleasant. It turns out that there is data, there is no need to show the preloader, but the actual dom of 100 lines is rendered for a second. This would not bother me at all, but I was making the same application on vue and there the exact same list is rendered many times faster, absolutely imperceptibly to the user. What could be the problem?

class ListOfCoins extends React.Component {

  componentDidMount(){
    if (this.props.isLoading){
        this.props.fetchCoinData();
    }
  }

  renderTable = () => {
    const { currency, coins } = this.props;
    return (
      coins.map((coin) => (
        <Link key={coin.id} to={'/coins/' + coin.symbol}>
          <CoinItem
            coin={coin}
            currency={currency}
          />
        </Link>
      ))
    )
  }

  render(){
    const { isLoading } = this.props;
    if (isLoading) return <Preloader height='75vh'/>
    return (
      <Segment.Group stacked>
        {this.renderTable()}
      </Segment.Group>
    )
  }
}

const mapStateToProps = state => {
  const firstItem = state.pagination.page * state.pagination.perPage - state.pagination.perPage;
  const secondItem = state.pagination.page * state.pagination.perPage;

  return {
    coins: state.coins.slice(firstItem, secondItem),
    isLoading: state.isLoading.coins,
    pagination: state.pagination,
    currency: state.currency,
  }
}

const mapDispatchToProps = (dispatch) => ({
    fetchCoinData: () => dispatch(fetchCoinData()),
    nextPage: () => dispatch(nextPage()),
    prevPage: () => dispatch(prevPage()),
    viewAll: () => dispatch(viewAll()),
    backTo100: () => dispatch(backTo100()),
    dispatch: dispatch,
})

ListOfCoins.propTypes = {
  coins: PropTypes.array.isRequired,
  isLoading: PropTypes.bool.isRequired,
  pagination: PropTypes.object.isRequired,
  currency: PropTypes.string.isRequired,
}

export default connect(mapStateToProps, mapDispatchToProps)(ListOfCoins);