Takes some study, but you may find that study worth the time:
Developer Tools > Network
Mac OS keyboard: Command+Option+I (“Option” aka “Alt” key)
Windows OS keyboard: Control+Alt+I (Shift+F8 or F12 key may work, too, according to old info online)
On the first occasion of your using Developer Tools, its window may appear as the bottom half of your Brave Browser page’s window.
Depending upon the size of your computer display, that might be OK for you. But, you may want the Developer Tools window to appear otherwise, and you may choose other locations, as follows.
Over in the upper right area of the Developer Tools window, you should find a vertical 3-dot icon.
Mac 3-dot icon on the right:
Windows 3-dot icon on the right:
When you hover your mouse arrow tip over that 3-dot icon, you might get a small description: “Customize and Control DevTools”
Click on that vertical 3-dot icon. You will get a pop-up window showing how the Console window may be displayed on your computer.
The 4 locations are (left to right):
- Undock into separate window
- Dock to left
- Dock to bottom
- Dock to right
Next, along the top of the Developer Tools window, you will see a main toolbar of various, general categories of the tools:
Elements - Console - Sources - Network - Performance - Memory - etc . . .
At the very right end of that, you see an “X” — that, if you click on it, the Developer Tools window will close. And note, here, that the Developer Tools window you view, is associated with the webpage you are also currently viewing. If you close that current webpage, then its associated Developer Tools window will also close.
Now, select Network
A bit further down, in the Developer Tools window, is a section called a drawer. In the following [Mac] screenshot, you see the Console drawer. There is a 3-dot menu icon to the left of “Console” and a closing “X” off to the right.
If you click on that “X” then the Console drawer will close. But for exercise, let’s say you want that back:
Click on the 3-dot icon at the upper right of the Developer Tools window — the same 3-dot icon that you clicked on, in order to select the location for the Developer Tools window.
Scroll down to and select “Show console drawer” (you may also simply click on your keyboard Esc key).
Thus, you may easily view (keyboard Esc key), but also close (big “X”), the Console drawer.
For the moment, close the Console drawer. Select your webpage (I am viewing your recent reply):
“Video playback freezes - #23 by Ricon”
And reload that webpage.
Look at the Developer Tools > Network window result - scroll to the top of that list.
You will see in chronological order/sequence, almost everything that Brave Browser (including extensions/plug-ins) downloaded in order to render the webpage.
And, you will see what failed, or stalled, or was blocked . . . and what might have stumped or frozen the rendering process.
Here is an example, a [Mac] screenshot showing a few items that failed - because I blocked something:
The failed (RED) items, are dependent upon data/info from fonts.googleapis.com (fonts that I blocked, for this occasion).
So a wee bit of rendering was frustrated, but Brave Browser forged ahead, using substitute fonts.
YOUR specific interest, re “Video playback freezes”, might reward you by your monitoring this Developer Tools > Network window, and see what may be revealed, when your video playback does freeze (or seems to freeze).
Developer Tools is loaded with a lot of choices, switches, and tooling. Do not fret. Just make a start, if interested, and you will gain some ground with time.
For more (and probably better) guidance, you might visit:
How to Use Web Browser Developer Tools
(March 24, 2020)
This Lifewire article has several good illustrations.
August 14, 2021 EDIT / UPDATE
Chrome Developers [website] > Documentation > Chrome DevTools > Network > Network Features Reference (April 13, 2015 article by Kayce Basques):