Akshay

Posted on May 13

How I Built a Native Video Compressor for 30 GB+ Files Using FFmpeg and Electron

#ffmpeg #opensource #javascript #windows

Online video compressors are great — until you hit a 35 GB file and watch the upload bar crawl to 1% before timing out.

I needed a tool that could handle raw production footage without ever sending it over the network.

So I built VideoSquash Pro — a free, open-source desktop app that runs FFmpeg natively on your Windows machine.

In this post, I’ll walk through the architecture, the tech stack, and how you can use or contribute to the project.

Architecture at a Glance

The app consists of three main layers:

1. Electron

Electron hosts the UI using HTML, CSS, and JavaScript.

It also manages the native child process that runs FFmpeg in the background.

2. FFmpeg Binary

FFmpeg is the real compression engine.

Instead of relying on browser-based encoding, VideoSquash Pro spawns a native FFmpeg binary with precise arguments based on the selected settings.

3. IPC Bridge

The IPC bridge streams real-time progress from FFmpeg to the renderer using Electron’s ipcMain, ipcRenderer, and preload setup.

This allows the UI to stay responsive while FFmpeg works in the background.

All processing happens offline.

No internet connection is needed after the initial download.

What You Can Control

The UI provides an industry-standard preset system plus full manual control over every FFmpeg parameter.

Developers will appreciate that it does not hide the complexity.

// Example of the FFmpeg spawn process, simplified

const args = [
  "-y",
  "-i",
  inputPath,

  "-c:v",
  "libx264",

  "-crf",
  "30",

  "-vf",
  "scale='min(1920,iw)':'min(1920,ih)':force_original_aspect_ratio=decrease",

  "-c:a",
  "aac",

  "-b:a",
  "128k",

  "-movflags",
  "+faststart",

  outputPath,
];

const proc = spawn(ffmpegPath, args);

proc.stdout.on("data", (data) => {
  // Parse progress data and send it to the renderer
});

The app supports control over:

Codec
CRF quality
Resolution
Output format
Audio settings
Compression presets

The goal is simple:

Give beginners easy presets, but still give developers real control.

Real-Time Progress Tracking

One thing I did not want was a fake progress bar.

So VideoSquash Pro uses ffprobe to get the exact duration of the input video.

Then, while FFmpeg is running, the app parses FFmpeg’s structured progress output and reads values like out_time_ms.

That value is compared against the total duration to calculate a real percentage from 0 to 100.

const progress = (currentTimeMs / totalDurationMs) * 100;

This gives users a progress bar that actually represents the compression process.

Why Not FFmpeg.wasm?

FFmpeg.wasm is amazing for browser-based video tools.

But for very large files, it has serious limitations.

Browser-based FFmpeg runs inside WebAssembly memory limits, which makes it unsuitable for huge files like 10 GB, 30 GB, or 50 GB videos.

Native FFmpeg is different.

It streams directly from disk.

It does not load the entire video into RAM.

That is the main reason VideoSquash Pro can handle very large files without crashing the browser or hitting memory limits.

How to Try It

You can download the pre-built Windows installer from the latest release:

https://github.com/TutorialsAndroid/video-squash-pro/releases/latest

Or you can clone the repo and run it locally.

git clone https://github.com/TutorialsAndroid/video-squash-pro.git
cd video-squash-pro
npm install
npm start

You will need to provide your own ffmpeg.exe and ffprobe.exe inside the assets/ folder if you are building it manually.

The entire source code is open source and MIT licensed.

Pull requests are welcome.

What’s Next?

I am planning to add:

Persistent preset saving
Hardware acceleration for Intel QSV and NVIDIA NVENC
Automatic file queuing
Multi-threaded compression
macOS and Linux builds

If any of these features interest you, or if you have other ideas, feel free to open an issue or drop a comment.

Links

Landing page:
https://tutorialsandroid.github.io/video-squash-pro/

GitHub Repo:
https://github.com/TutorialsAndroid/video-squash-pro

Download Installer:
https://github.com/TutorialsAndroid/video-squash-pro/releases/latest

If you have ever hit a wall with online video compressors, give VideoSquash Pro a try.

And if you are a developer, I would love to hear your thoughts on the architecture.

Drop a comment below.

Dev.to Tags

electron ffmpeg opensource javascript desktop windows productivity

DEV Community