title: Reactjs material ui prevent re-render tabs on enter
body: <p>I have built a material-ui based UI containing tabs in reactJS. Anytime a tab is selected, the content under that tab reloads which is causing a major performance issue because I am displaying an iFrame under one those tabs. I tried to use React.memo to ensure that the screen does not re-render because there is no change in the props but it still does. </p>
  
  <p>Here is the code - </p>
  
  <p><a href="https://codesandbox.io/s/material-demo-nxsfv?file=/video.js" rel="nofollow noreferrer">Code sandbox link</a></p>
  
  <p>Is there a way, that once the iFrame is loaded for the first time and I switch between tabs, the iframe does not get re-rendered again?</p>