During a phone screen recently, the CTO of the company was going through my portfolio site. He checked the browser’s network console and noticed that the site — a page built with React components — was sending multiple requests a second for data from a JSON object [the object serves as the page’s datastore because spinning up a database in this instance would be overkill]. A learning moment!
I revisited the React docs and the code for the components. With a better understanding of React, the issue was quickly apparent: every time the Dealer component was rendered, an AJAX request for data.json fired. Which, just to get static data, was a lot.
My fix involved changing the AJAX request to fire only once the Dealer component loaded. Luckily, React has a built-in event componentDidMount for such an occasion. Just swapped out the names, added an extra check for mounting, and then I deleted the call to the AJAX function in the render portion of the component. Problem solved!
earlier write-up on my first impressions using React is here