Forcing Reconciliation with `forceUpdate`

Provide an example where the `forceUpdate` method is used to manually trigger a re-render and reconciliation process in a React component.

class ForceUpdateExample extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      randomNum: Math.random()
    };
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    // Triggering the forceUpdate() will cause the component to skip shouldComponentUpdate, 
    // and force a re-render with the same state.
    this.forceUpdate();
  }

  render() {
    return (
      <div>
        <p>Random Number: {this.state.randomNum}</p>
        <button onClick={this.handleClick}>Force Re-render</button>
      </div>
    );
  }
}

This React component uses `this.forceUpdate()` within the `handleClick` method to force a re-render of the component. Clicking the button triggers a re-render, even though the state (with a random number) has not changed. Ideally, forceUpdate should be avoided unless absolutely necessary as it bypasses `shouldComponentUpdate` optimizations.