Çözmek istediğim problem
Basit bir ses veya video kesme işlemi için büyük bir dosyayı önce sunucuya yüklemek, işlenmesini beklemek ve tekrar indirmek gereksiz bir dolaşım oluşturuyor. Ayrıca kişisel videoların üçüncü bir sunucuya gönderilmesi gizlilik açısından rahatsız edici. Kes Birleştir'i bu iki sorunu ortadan kaldırmak için hazırladım.
Neden FFmpeg.wasm?
FFmpeg medya işleme konusunda olgun ve güvenilir bir araç. WebAssembly sürümü olan FFmpeg.wasm, aynı işleme motorunu tarayıcının izole ortamında çalıştırıyor. Node.js sunucusu yalnızca statik HTML, CSS ve JavaScript dosyalarını servis ediyor; seçilen medya dosyası sunucuya gönderilmiyor.
FFmpeg çekirdeğini ilk ihtiyaç anında yüklüyorum. ffmpeg-core.js ve ffmpeg-core.wasm dosyaları Blob URL'lerine çevriliyor. Yükleme tamamlandıktan sonra aynı FFmpeg örneği sonraki işlemlerde tekrar kullanılıyor.
Kesme akışı
- Kullanıcı MP3 veya MP4 dosyasını seçiyor.
- Başlangıç ve bitiş zamanı doğrulanıyor.
- Dosya FFmpeg'in sanal dosya sistemine yazılıyor.
- Format için uygun FFmpeg komutu çalıştırılıyor.
- Çıktı okunup Blob olarak indirme bağlantısına dönüştürülüyor.
İşlem sırasında FFmpeg'in progress olayını dinleyerek yüzde bilgisini ekrana yansıtıyorum. Büyük dosyalarda kullanıcıya yalnızca dönen bir simge göstermek yeterli değil; işlemin gerçekten ilerlediğini bilmesi gerekiyor.
Birleştirme ve format farkları
Birden fazla dosya seçildiğinde her dosyayı sanal dosya sistemine yazıp bir files.txt listesi oluşturuyorum. FFmpeg'in concat demuxer'ı bu listeyi sırayla okuyor. Uyumlu dosyalarda -c copy kullanmak yeniden kodlama yapmadığı için hızlı ve kalite kayıpsız. Codec veya çözünürlük farklarında ise yeniden kodlama gerekebiliyor.
Dosya cihazdan çıkmadığı için sunucu depolama maliyeti, yükleme süresi ve geçici dosya temizleme problemi oluşmuyor.
Sınırlar ve öğrendiklerim
WebAssembly güçlü olsa da tarayıcının bellek sınırlarına bağlı. Çok büyük videolarda düşük özellikli cihazlar zorlanabilir. Bu yüzden dosya boyutunu, bekleme durumunu ve hata mesajlarını açık göstermek gerekiyor. Bu proje bana, doğru mimari seçimin bazen backend'i büyütmek değil tamamen devreden çıkarmak olduğunu gösterdi.
SONRAKİ YAZINe Kadar İyi Tanıyorsun: canlı oda akışı