CapCut gehört zu den zehn am häufigsten heruntergeladenen Android-Apps im Jahr 2023 und ist eine der beliebtesten Videobearbeitungs-Apps für Mobilgeräte. Außerdem ist es völlig kostenlos. Das All-in-one-Tool zur Videobearbeitung bietet zahlreiche Effekte und Bearbeitungsfunktionen wie die Umwandlung von Sprache in Text und das Upscaling von Bildern sowie eine umfangreiche Mediathek, mit der Nutzer schnell und einfach hochwertige Videos und Grafiken erstellen können. Wenn CapCut-Nutzer ihre Inhalte fertiggestellt haben, können sie sie mit nur einem Klick auf der Social-Media-Plattform ihrer Wahl veröffentlichen, darunter TikTok, YouTube, Instagram und Facebook.
CapCut möchte seinen Nutzern eine großartige Erfahrung bieten, indem es ihnen ermöglicht, Inhalte nach ihren eigenen Vorstellungen zu erstellen. Das CapCut-Team hat vor Kurzem eine fortschrittliche Webanwendung für Desktopnutzer entwickelt, die die Nutzerfreundlichkeit verbessert. CapCut Online bietet eine benutzerfreundliche Oberfläche mit praktischen Funktionen für private und geschäftliche Nutzer, die das Erstellen von Inhalten und die Zusammenarbeit im Team erleichtern. Mit diesem Update können Nutzer direkt über ihren bevorzugten Browser auf die leistungsstarke Videobearbeitungssoftware zugreifen. Das macht die Bearbeitung noch einfacher und flexibler.
Web-Apps senken die Einstiegshürde
CapCut hat eine Webanwendung eingeführt, um Nutzern neben den bestehenden Android- und iOS-Apps weitere Möglichkeiten für den Zugriff auf die Videobearbeitungsplattform zu bieten. Durch die Bereitstellung weiterer Einstiegspunkte können Nutzer die Plattform auswählen, die für sie am besten geeignet ist. Sie können die mobile App aus dem Google Play Store herunterladen, sie als Webanwendung über ihren bevorzugten Browser installieren oder sie direkt in einem Browser-Tab verwenden. Das Team war der Meinung, dass eine Desktop-App, die auch im Browser funktioniert, die Nutzerbindung steigern und die allgemeine Zufriedenheit der Nutzer verbessern könnte.
Dank der Entwicklern zur Verfügung stehenden Technologien war es für CapCut ganz einfach, die plattformspezifische mobile Anwendung in eine ebenso leistungsstarke Webversion zu übersetzen und zu übertragen. Webplattformtechnologien wie WebAssembly sind in den letzten Jahren bei Entwicklern immer beliebter geworden. Sie ermöglichen es ihnen, leistungsstarke Web-Apps schneller als zuvor zu erstellen. Da der Großteil der Bearbeitungs-Engine von CapCut in C++ geschrieben ist, konnten die Entwickler Emscripten verwenden, um die Anwendung in eine Desktop-Webversion zu portieren.
WebAssembly
Mit WebAssembly konnten die CapCut-Entwickler mehr als eine Million Video- und Grafikvorlagen in die neue Webanwendung übertragen. Die leistungsstarke Unterstützung von Emscripten für das Kompilieren von C- und C++-Code in WebAssembly ermöglichte es CapCut, Code effizient zwischen den plattformspezifischen und Web-Apps zu teilen. So konnten einige der wichtigsten Funktionen von CapCut auf die neue Plattform portiert werden, darunter benutzerdefinierte Videoeffekte und Videobearbeitung.
CapCut bietet viele Spezialeffekte, die Algorithmen im Browser ausführen. Das kann die Videowiedergabe bei der Echtzeitverarbeitung verlangsamen. Dank der parallelen Verarbeitung von WebAssembly, die als Single Instruction, Multiple Data (SIMD) bezeichnet wird, konnten die CapCut-Entwickler die Verarbeitungsleistung der App im Vergleich zu Nicht-SIMD-Lösungen um fast 300% verbessern und Engpässe besser vermeiden.
Die Ausnahmebehandlung (Exception Handling, EH) ist eine der grundlegenden Funktionen von C++, aber die Unterstützung für EH in Emscripten war unvollständig. Emscripten bietet eine Reihe von EH-Mechanismen auf JavaScript-Basis. Diese können sich jedoch negativ auf die Laufzeitleistung einer App auswirken und die Paketgröße erhöhen. Der EH-Standard von WebAssembly umgeht dieses Problem. Durch die Umstellung auf WebAssembly für EH konnte die Paketgröße der Web-App von CapCut um 15% reduziert werden. Gleichzeitig wurde der Code leistungsfähiger.
WebCodecs
Für die Videobearbeitung muss CapCut die von Nutzern eingegebenen Videos in Bilder decodieren und sie dann unter der Videovorschau auf der Bearbeitungsfläche anzeigen. Selbst mit einem SIMD-optimierten Decoder dauert das Decodieren eines 4K-Bildes auf einem leistungsstarken Computer mehrere zehn Millisekunden. Das gleichzeitige Decodieren mehrerer Videotracks erfordert also viel Leistung.
Durch die Verwendung von WebCodecs hat CapCut die hardwarebeschleunigte Codierung und Decodierung integriert, wodurch die Audio- und Videoverarbeitungsgeschwindigkeit um fast 300 % verbessert wurde. Dank der deutlich verbesserten Leistung unterstützt CapCut jetzt mehrere gleichzeitige 4K-Streams. Außerdem ermöglichten WebCodecs die Unterstützung weiterer Videoformate wie H264, HEVC, VP8, VP9 und AV1.
Das volle Potenzial einer Webanwendung nutzen
Anfang 2022 begann das CapCut-Team, die plattformspezifische Anwendung auf das Web zu portieren. Im August desselben Jahres wurde die erste webbasierte Version der App für den Desktop offiziell eingeführt. Durch die Verwendung von PWA-Technologien (Progressive Web App) kann CapCut über den Browser installiert werden. Nach der Einführung der neuen Web-App mit diesen Technologien verzeichnete das CapCut-Team eine Steigerung des SEO-Traffics um 83%.
Durch die Einführung von CapCut im Web konnten Entwickler die Nutzererfahrung optimieren, indem sie leistungsstarke Google-Funktionen mit der Anwendung kombinierten. Innerhalb eines Monats nach der Einführung konnten sich viele Nutzer mit der Funktion Mit Google anmelden anmelden. Dadurch wurde der Anmeldevorgang vereinfacht, da sie ihre vorhandenen Google-Anmeldedaten verwenden konnten, anstatt ihre Informationen manuell einzugeben.
Mehr Möglichkeiten mit dem Web
Durch die Verfügbarkeit von CapCut im Web haben sich für Millionen von Nutzern neue Möglichkeiten ergeben, auf die Software zuzugreifen. Dank WebAssembly, WebCodecs und anderer moderner Webtechnologien, die für die Entwicklung komplexer Web-Apps zur Verfügung stehen, konnten die CapCut-Entwickler eine 1:1-Portierung implementieren, die die volle Leistung der App beibehielt.
Weitere Informationen
Hier erfahren Sie, wie Sie Ihre Anwendungen mit WebAssembly und WebCodecs ins Web bringen können.