webcodecs | flexible web API for encoding and decoding audio | Video Utils library

First of all, I was wondering if mixing video + subtitle and sending it to Youtube's rtmp url can be done from the client side, so it's simple and lightweight.

You can do the video compositing and audio mixing and what not, but browsers don't support RTMP. To get the data to an RTMP server, you need to send it to a server where it is proxied off to the final URL.

They will use their camera to record their video, and select from my app which text should be added to the video.

Yeah, that's no problem at all. Draw everything to a canvas every frame.

Second, should I encode the output being sent to Youtube?

Yes, you must. Check out the Media Recorder API.

Lastly, if I do need a server to process the video, where should the encoding happen (from the user's machine, or in the server, or both?)?

The video has to be encoded client-side to get to the server in the first place. The server can then hopefully just repackage with flv and send it along. If the browser doesn't support H.264 in its Media Recorder API, then you'll have an intermediary codec like VP8, and you'll have to transcode server-side.

A few years ago, I wrote a tutorial on how to do all of these steps here: https://github.com/fbsamples/Canvas-Streaming-Example Note that the tutorial is in the context of Facebook, but this should teach you the concepts.