Building MatchUps™ — A Custom Browser for Multi-View Sports Streaming
We built a Chromium-based desktop browser from scratch using Electron, purpose-built for sports fans who want to watch multiple live streams, track bets, and manage their viewing experience from a single window.
6
Multi-View Layouts
2
Platforms (Win + Mac)
6
Simultaneous Streams
0
Ads or Pop-Up Interruptions
The Challenge
Sports Fans Deserved a Better Viewing Setup
The client came to us with a clear vision: sports fans juggle multiple streaming tabs, betting sites, and score trackers — and every existing browser treats them like any other user. They wanted a browser that was built from the ground up specifically for multi-stream sports viewing.
The challenge wasn't just building a browser. It was building one that could handle up to 6 simultaneous video streams without lag, manage audio intelligently, block streaming-site pop-ups, and do it all through an interface that felt purpose-built for game day.
Multi-Stream Performance
Running 4-6 live video streams in a single window crushes CPU and RAM on standard browsers. We needed a solution that could handle it without buffering or crashing.
Audio Chaos
With multiple streams playing, audio from all tabs creates noise. The client needed smart audio management — only hear the stream you're focused on.
Pop-Up Hell
Sports streaming sites are notorious for aggressive pop-ups and redirects. A built-in blocker was essential for an uninterrupted viewing experience.
Cross-Platform Delivery
The browser needed to ship on both Windows and macOS with native performance and consistent behavior across both platforms.
Technical Decision
Why We Chose Electron
We evaluated multiple approaches — raw Chromium fork, CEF (Chromium Embedded Framework), and Electron. For this project, Electron was the right call. It gave us Chromium's full rendering engine with the flexibility to build custom UI layers, manage multiple BrowserViews for the multi-stream layout, and ship cross-platform from a single codebase.
Electron also let us iterate fast. The client had specific layout presets, audio switching logic, and sidebar interactions that would have been significantly harder to prototype in a raw Chromium build. With Electron, we could build, test, and ship features in tight cycles.
Application Architecture
Electron Shell
Main process, window management, IPC
BrowserViews (x6)
Independent Chromium renderers per stream
Layout Engine
Grid presets, resize logic, drag-and-drop
Audio Controller
Focus-based muting, hover detection, fade
Ad/Pop-Up Blocker
Custom filter lists, redirect prevention
UI Layer
Sidebars, address bar, settings, themes
Core Feature
Six Purpose-Built Viewing Layouts
Every layout was designed around a specific sports viewing scenario. Users switch between them with a single click from the left sidebar.
Full Court
2×2 Grid
PowerPlay
1 Main + 2 Below
Triple Threat
1 Main + 2 Side
Cover 6
3×2 Grid
Head-to-Head
2×1 Split
Mismatch
1 Large + 1 Side
Smart Feature
Intelligent Audio Switching
With multiple live streams playing at once, audio management was critical. We built a focus-based audio system that feels natural and stays out of the way.
How It Works
Active Tab
Audio plays from the currently focused stream
Hover 2+ Sec
Hovering over another stream starts a switch
Smooth Fade
Audio crossfades to the new stream
Scope of Work
What We Delivered
- Built a full custom browser on Electron with Chromium rendering — tab management, bookmarks, history, downloads, incognito mode
- Designed and implemented 6 multi-view layout presets optimized for sports streaming scenarios
- Each stream runs in an independent BrowserView for isolated performance — one stream buffering doesn't affect the others
- Built focus-based audio management with hover detection and smooth crossfade transitions
- Integrated a custom pop-up and ad blocker tuned for sports streaming sites
- Auto-hiding address bar that reappears on mouse movement for maximum screen real estate
- Left sidebar for layout presets, right sidebar for profile, settings, and browsing history
- Drag-and-drop tab rearrangement with adaptive resizing — adjusting one pane proportionally resizes the others
- Resource optimization for multi-stream playback — auto-adjusting video quality and minimized CPU/memory footprint
- Shipped cross-platform builds for Windows and macOS with native installers
- SSL/TLS encryption, minimal permissions model, and automatic security update delivery
Tech Stack
Tools & Technologies Used
Results
The Impact
6 Streams, Zero Lag
Independent BrowserViews and resource optimization let users run up to 6 live streams simultaneously without performance degradation.
Game-Day Ready UI
Purpose-built layouts, smart audio, and a distraction-free interface that feels like it was designed by someone who actually watches sports.
Clean Streaming Experience
The built-in ad and pop-up blocker eliminated the constant interruptions that sports streaming sites are known for.
Ship Once, Run Everywhere
Single Electron codebase produces native builds for both Windows and macOS — same features, same performance, consistent experience.