साइड-बाय-साइड वीडियो निर्माता एक ही फ्रेम में दो वीडियोज को साथ रखें।

साइड-बाय-साइड टूल दो वीडियोज़ को HTML5 वीडियो तत्वों में लोड करता है। एक कैनवास संयुक्त आयामों पर बनाया जाता है - क्षैतिज लेआउट के लिए, चौड़ाई दोगुनी होती है, और ऊर्ध्वाधर के लिए, ऊंचाई दोगुनी होती है। प्रसंस्करण के दौरान, requestAnimationFrame हर फ्रेम पर कैनवास पर दोनों वीडियो फ़्रेम्स को एक साथ आकर्षित करता है। बाएं/ऊपरी वीडियो (0,0) और दाएं/नीचे के वीडियो (चौड़ाई,0) या (0,ऊंचाई) पर आकर्षित किए जाते हैं। दोनों वीडियोज़ अपने आधे कैनवास में फिट होने के लिए drawImage() के साथ गंतव्य आकार का उपयोग करके समायोजित किए जाते हैं। दोनों वीडियोज़ से ऑडियो Web Audio API createMediaElementSource() नोड्स के माध्यम से कब्जा कर लिया जाता है, एक चैनल मर्जर या GainNodes के माध्यम से मिलाया जाता है और MediaRecorder आउटपुट के लिए कैनवास स्ट्रीम के साथ जोड़ा जाता है। आउटपुट अवधि दोनों वीडियोज़ में से छोटी अवधि के अनुसार मेल खाती है।