Real-Time Streaming at Scale Under the Hood

Hello everyone. This is Barry Owen from Wowza Media Systems. And today I’d like to introduce you to a couple of new tools we have for the Wowza Real-Time Streaming feature. As you know, the Wowza Real-Time Streaming feature is a way for you to stream ultra-low-latency streams, to up to millions of viewers. This allows you to stream it as low as one to perhaps sub-one seconds of latency. And we’ve created a few tools here that allow you to get up and running very quickly with some real professional-quality streams. So, the first thing I’m going to do here is I’m going to launch a version of OBS we’ve created. Now, this version of OBS is special in that it is preconfigured to stream directly into Wowza Real-Time Streaming. So we’re going to look here. I already have a video loaded up and I have a little clock overlay down here so we can actually show the latency as I’m demonstrating this.

The important thing to note here is if you go to settings you go to the stream tab where you would typically see destinations and things like that when you’re using OBS. And what we have here is the ability to stream to Wowza Real-Time Streaming. And that could be either WebRTC directly, which is what you’re going to want to use for super low latency. Or you can use RTMP perhaps if your network isn’t in that great of shape, you need a little more robust transport that can leverage TCP. It’ll cost you some latency though. So what you see here is I’ve already precreated a stream name and a publishing token that I’ve got from the Wowza Real-Time Streaming UI. You can also retrieve these via the API. I’m just going to go ahead and use those. They’re preset up. So what I’m going to do now is I’m going to start streaming.

So this is connecting instantly as you can see you start streaming. I’m just going to get this out of the way. Now, what I have here is a super simple page. And as you can see, this page will play back our live stream. And if I can get the control out of the way, you can see crazy little latency. Very effective. And what I want to show you is how simple this page was to create. So, as you can see over on this side of the screen, we have some sample code. This is all it takes right here is these 32 lines of HTML, which is really about 10 lines of HTML because I have comments and spaces in there. That’s all it takes to get this up and running for you to be able to embed this and have your player up and ready to go.

You could literally get up and running with Wowza Real-Time Streaming at scale in, I don’t know, what have we got here? Five minutes, less. So, really powerful. Now, the secret to all this is we’ve built a JavaScript SDK. This SDK is served up off the Wowza CDN, free for you to embed into any of your applications. And then all you really need… You could literally steal this exact same code I have here, change your stream ID and you’d be off and running. So super simple, really easy. You could really easily just embed this as an IFrame or you could just copy and paste this code into your own page. Crazy. Super easy to do. Now, if you want to get a little more conflated, there’s some cool features in the SDK that allow you to do things like show statistics and data along the bottom. Hey, what is the source video? Look at that, it’s 1080P. How am I doing stream-wise? Have I lost any packets? What’s my jitter. That’s important when you’re looking at low latency. What’s my bitrate for both audio and the video.

And then it also could tell you… Some statistics down here which are basically on your connection. So again, we’ll show you the code for this one, not a whole lot more complicated. Now this one is separated out into a couple of pieces of JavaScript that I loaded just to make it separate, but this is basically the same thing. It’s a video tag and a table. The video tag accomplishes all the playback here, which is kind of the beauty of WebRTC. You really don’t do anything there. And then if we go ahead and look at the JavaScript that underlies this here. It’s a little more complicated. The bulk of this JavaScript is updating the data in this table. So obviously this is something that’s more for a producer view or potentially a support technician, not usually things you would want to show your end users.

Lastly, what I’d like to show you is obviously these are very plain pages. If you want to wrap this and really make it your own, make it look like it’s part of your web presence. You certainly can. I’ve just prettied this up. This is basically the same page you just saw just styled a little bit, right? We have little background, we have a logo, I framed the video and tidied up the table. Same data. And again, this one if you look at, obviously begins to get a little more complicated. There’s a little more stuff in there as far as the layout goes and things like that. But again, super simple, crazy easy to use. This SDK is completely free and available when you’re using the Real-Time Streaming feature. And as a bonus, it’s fully documented. So here’s the basic things I was just using. I was just showing you. I mean, this is basically the first page I showed you.

Hey, if you want to go and modify things and do things a little differently, set up audio-only streaming there’s complete documentation in here for you to do that and tells you all of the things that are under the hood of the SDK. So you can go as crazy as you want, getting it dialed in just for your use case. So I really look forward to these being released. I look forward to getting them in your hands and as always, we’re happy to help. You can contact us and our Wowza Professional Services team. We’ll get you up and running in no time. So that’s all for today. Happy streaming and we’ll see you next time.

About Traci Ruether

As a Colorado-based B2B tech writer, Traci Ruether serves as Wowza's content marketing manager. Her background is in streaming and network infrastructure. Aside from writing, Traci enjoys cooking, gardening, and spending quality time with her kith and kin. Follow her… View more