Using metadata to optimize rendering

In this section, you'll learn how to use metadata that's part of the API response to determine whether or not the component should re-render itself. Here's a simple user details component:

import React, { Component } from "react";

export default class MyUser extends Component {
  state = {
    modified: new Date(),
    first: "First",
    last: "Last"
  };

  shouldComponentUpdate(props, state) {
    return Number(state.modified) > Number(this.state.modified);
  }

  render() {
    const { modified, first, last } = this.state;

    return (
      <section>
        <p>{modified.toLocaleString()}</p>
        <p>{first}</p>
        <p>{last}</p>
      </section>
    );
  }
}

The shouldComponentUpdate() method is comparing the new modified state with the old modified state. This code makes the assumption that the modified value is a date that reflects when the data that was returned...