Debounce volume and muted state update.

## Ticket
189: Overall React Lag or Extra Re-renders / Volume slider laggy since v0.48

## The problem
Every redux update results in each mounted component's prop mapping function (the `select` and `perform` stuff) to be recalculated. This is normal per redux, but we do lots of heavy stuff there.

The slider was sending tons of redux update for the Volume and Muted setting.

## Changes
The redux volume/muted setting is just used to restore vjs to the user's setting on the next video, so it doesn't need to be updated immediately/constantly -- vjs keeps it's own video settings.  Debounced that action.

ui/component/viewers/videoViewer/view.jsx

@@ -25,6 +25,7 @@ import I18nMessage from 'component/i18nMessage';
 import { useHistory } from 'react-router';
 import { getAllIds } from 'util/buildHomepage';
 import type { HomepageCat } from 'util/buildHomepage';
+import debounce from 'util/debounce';
 import { formatLbryUrlForWeb, generateListSearchUrlParams } from 'util/url';
 
 const PLAY_TIMEOUT_ERROR = 'play_timeout_error';
@@ -135,6 +136,14 @@ function VideoViewer(props: Props) {
   const [replay, setReplay] = useState(false);
   const [videoNode, setVideoNode] = useState();
 
+  const updateVolumeState = React.useCallback(
+    debounce((volume, muted) => {
+      changeVolume(volume);
+      changeMute(muted);
+    }, 500),
+    []
+  );
+
   // force everything to recent when URI changes, can cause weird corner cases otherwise (e.g. navigate while autoplay is true)
   useEffect(() => {
     if (uri && previousUri && uri !== previousUri) {
@@ -387,8 +396,7 @@ function VideoViewer(props: Props) {
     });
     player.on('volumechange', () => {
       if (player) {
-        changeVolume(player.volume());
+        updateVolumeState(player.volume(), player.muted());
-        changeMute(player.muted());
       }
     });
     player.on('ratechange', () => {