Braider
A custom user interface that merges videos from YouTube channels into a sortable and filterable table.
Problem
I want to browse videos from several YouTube channels in chronological order within a given date range. You would think that YouTube would make this easy but it is not. It is especially hard if the channels in question publish a lot of videos and the time in question is several years ago.
Using this prototype you can browse thousands of videos from multiple channels, including sorting videos on different values such as the number of views or length. If you tried to browse YouTube in your browser like this you would need multiple tabs each requiring 400+ MiB of memory.
Features & Limitations
The prototype features:
- a simple text search that matches titles and video descriptions.
- the ability to filter channels using mute and solo-pattern adapted from RemedyBG and DAWs.
- an interactive histogram that shows the number of videos released in year/month buckets. Click on a bar in the histogram to to show videos from that year/month Click-and-drag to highlight multiple months. Hold Shift to keep previous selection. Double click in histogram to clear selection. Note that the Year-Month widget above the histogram is a mirror of the histogram. Also note that the bar heights is dependent on the selection of channels.
- centering on videos: Use the sidebar to filter the videos. Select one of the shown videos and then reset or change the filter. The selected video is now shown in the context of the full braid.
- a JavaScript test suite using my own implementation of the describe-it-should test pattern.
- an incredibly fast interface compared to YouTube.
There are some limitations in the prototype:
- The braids are currently hardcoded and is currently not user friendly to
generate new ones. I made the mistake of creating a simple script in Bash
that scrapes data from YouTube using
curlandjqbut it grew and grew and grew. - The prototype does not support small resolutions. It will not look good or function well on mobile.
- YouTube might not like websites that scrapes their data, embed many videos and the iframes sometimes produces errors.
Questions
Examples of what questions you could answer using Braider.
- Which is Primeagen’s most viewed video in the first quarter of 2025?
- Limited Life was a sub-series that occurred during H9. How many videos were published in that series? Which video has the most views?
- Simon biked the Marcher Castles Way on GCN in 2025. Find the GCN Tech follow up video that was published the day after.
Some Closing Thoughts
This is mostly a proof of concept and an early prototype. I originally wanted the user to be able to input a list of channels and it would then scrape all videos using client-side JavaScript and display them. But it seems like that is not possible(?), or it is at least not straight forward due to security concerns.
The project is written in JavaScript (yuck) but I tried to make it better and more pleasant using:
- pure JavaScript without using any dependencies or npm-hell.
- ample use of JSDoc for type hints.
- an LSP (ts_ls) which catches errors and type checks.
- the Chrome debugger.
Check out YouTube Braider Prototype and its multiple hardcoded braids.