SaimumIslam

import React, { useState, useCallback, useMemo } from "react";

function Number({ number, onClick }) {
  console.log("number render");
  return (
    <div>
      <p>Number:{number}</p>
      <button onClick={onClick}>Numbering</button>
    </div>
  );

SaimumIslam

import React, { useState, useMemo } from "react";

function Number({ number, onClick }) {
  console.log("number render");
  return (
    <div>
      <p>Number:{number}</p>
      <button onClick={onClick}>Numbering</button>
    </div>
  );

SaimumIslam

import React, { useState, useMemo } from "react";

const Number = React.memo(({ number }) => {
  console.log("number render");
  return (
    <div>
      <p>Number:{number}</p>
    </div>
  );
});

SaimumIslam

import React, { useState } from "react";

const Number = ({ number }) => {
  console.log("number render");
  return (
    <div>
      <p>Number:{number}</p>
    </div>
  );
};