Icon, SeriesIndexFooter -> PureComponent

frontend/src/Components/Icon.js

@@ -1,11 +1,16 @@
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { PureComponent } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { kinds } from 'Helpers/Props';
 import classNames from 'classnames';
 import styles from './Icon.css';
 
-function Icon(props) {
+class Icon extends PureComponent {
+
+  //
+  // Render
+
+  render() {
     const {
       containerClassName,
       className,
@@ -15,7 +20,7 @@ function Icon(props) {
       title,
       isSpinning,
       ...otherProps
-  } = props;
+    } = this.props;
 
     const icon = (
       <FontAwesomeIcon
@@ -44,6 +49,7 @@ function Icon(props) {
     }
 
     return icon;
+  }
 }
 
 Icon.propTypes = {

frontend/src/Components/Page/PageJumpBar.js

@@ -26,6 +26,13 @@ class PageJumpBar extends Component {
     this.computeVisibleItems();
   }
 
+  shouldComponentUpdate(nextProps, nextState) {
+    return (
+      nextProps.items !== this.props.items ||
+      nextState.height !== this.state.height
+    );
+  }
+
   componentDidUpdate(prevProps, prevState) {
     if (
       prevProps.items !== this.props.items ||

frontend/src/Series/Index/SeriesIndexFooter.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { PureComponent } from 'react';
 import classNames from 'classnames';
 import formatBytes from 'Utilities/Number/formatBytes';
 import { ColorImpairedConsumer } from 'App/ColorImpairedContext';
@@ -7,7 +7,13 @@ import DescriptionList from 'Components/DescriptionList/DescriptionList';
 import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
 import styles from './SeriesIndexFooter.css';
 
-function SeriesIndexFooter({ series }) {
+class SeriesIndexFooter extends PureComponent {
+
+  //
+  // Render
+
+  render() {
+    const { series } = this.props;
     const count = series.length;
     let episodes = 0;
     let episodeFiles = 0;
@@ -142,6 +148,7 @@ function SeriesIndexFooter({ series }) {
         }}
       </ColorImpairedConsumer>
     );
+  }
 }
 
 SeriesIndexFooter.propTypes = {