Watch the recording and learn what’s new in THEOplayer 6.0.

Willem: Good morning, good afternoon, good evening to all the listeners worldwide listening to this webinar on THEOplayer 6.0. Already the sixth version of our beloved THEOplayer. I still remember when we had version one and wow, we now at version six. That's a huge milestone. We'll wait a few more minutes. And while we're waiting for others to join, let's do some quick introductions. I'm representing the North American site, VP sales in North America. Andrea and Peter-Jan, I will let you do the introductions of yourselves.

Andrea: Hello everybody, Andrea Cani here. I'm working at THEO as technical delivery manager, and I'm really happy and excited to be here today.

Pieter-Jan: I'm PJ. Some people may know me, some people might not know me. I remember the THEOplayer version 1.0 very well, given that well, when we started the company, it was one of the first things that we built. Representing the technical side here, happy to discuss all of the cool new stuff that the team has been building.

Willem: Thank you, Andrea and Peter-Jan. And while we're waiting a few more public service announcements, we're doing this webinar on THEOplayer 6.0, a new version we will be releasing of THEOplayer next week, right before IBC. We will talk about it a lot today, the highlights, answering questions as well. But if you're coming to IBC in Amsterdam, definitely let us know in the question sections to set up a meeting with us because there we can show it in real life. We have some live demos there and talk it through even more and even more customized to your needs. We do have some Belgian beer drinks at the show as well, which is typically a big thing for our customers as well. I'm seeing everybody's loving that, so that's good!

Without further ado, let's move to some practicalities about this webinar. This screenshot is a screenshot of the screen you're looking at right now. So as some of you have already done, you can react. Let us know how you feel. If you feel a feature is cool, we would love to see it. We like to make these things as interactive as possible. We will also do a poll to get some insights from the market as well on what your priorities are. You will get a pop-up screen and be able to answer there and you will see the results in the poll section. There is a question button as well where you can ask questions at any moment. We will either, if it's very custom, answer them in the chat so you get the answer, or we will answer it during the webinar in the moment if it fits right or at the end during the Q&A section. A question that we typically get pretty quickly is like, will this be recorded? And yes, it is being recorded and we will send the slides and the recording right after this webinar. So, no need to record it yourself in any way. You will get that later from us.

And as I see that we're now four minutes in, I think most of the people should have joined and to be respectful of everybody's time that have already joined, let's get started.

Poll time: what are your priorities for cross platform video playback? We have noted down five options that we see from our customers and from discussions with them are important in the market. Now, I personally like the 'other' option as well. So, if your main priority is not on the list yet, please write it down in the question section, like maybe you should add this or whatever, because I'm always interested in what are the things that we are not seeing ourselves, but I do think the first five give a good overview of the trends in video streaming and video playback. So, fill it in. I will give you a minute and then we will start the webinar for real. So, in the poll section, you can see the answers being filled in. It's dynamically updating. So right now, improving viewer experiences is getting the edge on ad insertion. Then the third is latency. And then new platforms, new video playback features and others. Okay, well we will talk this a bit true when everybody has filled this in. But these are, as you can imagine, always key focus areas for us being a video player company. So, it's good to see that you find them also so important. And as I see that the other one is a very far lost one, I think we're doing a good job on not missing any outliers.

So, let's get started. The agenda of today is mainly focused around three of our core areas, which we also find back in THEOplayer 6.0. It's money, developer experience, and viewer experience. So as most of our customers, or all of them, have a streaming service which needs to generate revenue, we're always, even as a technology company, supporting their streaming service, looking at how can we increase the revenues for our customers. So that is topic number one - money, always important in business, especially in these times. The second topic being a technology company, we want to make our customers implementing our players or the developers, their lives as easy as possible. And then of course, the third one, we want to make the viewers of our customers as happy as possible. So, everything on performance, faster startup times, better ad insertions, better performance, better viewer experience overall for our viewers, we want to make that the best. So those are the three main topics of today.

Willem: Without further ado, I give the floor to Pieter-Jan to talk about the first topic, monetization.

Pieter-Jan: Yes, I mean, it's as you mentioned, it is actually a topic which is very important for a lot of our customers. I saw it in the poll initially, it was actually first and it lost a little bit of ground on the viewer experience. But this is probably not a surprise. A lot of our customers are monetizing through advertisements. And it makes a lot of sense. Historically, a lot of broadcasters were used to doing it. A lot of publishers had the ads in the newspapers. But also, we're seeing today that more and more streaming services are starting to do advertisements in order to basically monetize on top of the subscriptions. And a very difficult thing with advertisements is if you have a bad user experience, you can really annoy your viewers, and you don't want that. You want to offer a good viewer experience, but still be able to monetize, to be able to have smooth transitions for the ads, but also, and that's something that a lot of people forget, in my opinion, is - you also want to be able to measure exactly which advertisements have been viewed, how much of it has been viewed, and all of the other data that you need to do a decent beaconing or a decent tracking. Why? Because our customers are getting paid based on this information. So that's why we actually see this critical as well. And that's why we want to make this as easy as possible for them to track this and to track this all correctly.

Advertisements, they impact revenue significantly for most of the customers. But one of the things where we see that it is also very difficult to make this work, and I'm actually quite excited about the change that we made, it's about the user experience. And what we actually did with THEOplayer 6.0, is we actually released a new way to show this in our UI. So, some people may notice, some people might not notice. But we released a while back our Open Video UI, which is basically an open-source framework built based on different components, built in all kinds of different technologies. So, you have one for web, for example, you have one for Android, there's React Native, there's all kinds of platforms. And we developed these things individually for the technology that our customers are used to work with. So, for example, for web, what we did here was we built a web components-based library, which you can style using CSS even. Very easy to toggle on and off. And what the team added now is support for advertisements. For advertisements, there's a few components that are critical in my opinion. There’re things like skip buttons, there's the duration of the advertisements, there's click-throughs because you can monetize those even better, and all of this has been added. So, there's even a demo available online where you can see all of this in action. And that works straight out of the box. You have all of the standard components already. But because this is a component-based framework, you can, of course, enable or disable all of the components that you would want. There’re things like markers on the time bar. If you're not playing an advertisement, you can see how many ads are in a certain ad break. It basically holds all of the basic components that somebody would need to build a really powerful UI with advertisements now as well.

Andrea: Yes, and thanks, PJ. This allows me now to talk about the incredible work that was done in terms of integration. So, the team put actually a ton of effort in the integration with some of our analytics connectors. And it's really important to mention that right now, connectors play a key role in the THEOplayer architecture. They are open source, so you can easily get them from GitHub. And this empowers our customer to build very strong integration with our player without actually the need of blindly relying on dependency from our side.

So based on this approach, our developer prepared brand new connectors that will allow you to benefit from all the powerful features that server-side ad insertion can offer, for example  two new connectors were made available for Google DAI across our core SDK, iOS and Android. And we all know that integrating advertisement sometimes can be challenging. Integrating server-side ad insertion, yeah, can be very challenging. And this is where our approach development friendly, I want to say, kicks in. So, by doing that, we just want to help you out by benefiting of all the features that server side can offer at ease. So basically, you can load, with one line of code, these new connectors and just let our SDK to do the work for you. So, it's quite cool stuff that we have been working on, so I'm really looking forward to hearing some feedback.

Willem: Andrea, you mentioned Android. The listeners who have been following us for a while know that React Native is a big part of our player as well since the last two updates. Do we have the feature as well supported on React Native?

Andrea: Yeah, that's indeed an important point that we need to highlight during this webinar, because React Native covers actually a crucial place in the THEOplayer offer, right? So, we as a company strongly believe in the approach of building once and deploying many times anywhere. And so do our customers. So, this is something really important for us and we want to keep on enriching our React Native package with multiple features. And so, every time we bring up new feature on our core SDK, this is normally bridged as soon as possible on React Native. So, everything that I've mentioned related to Google DAI has been of course ported and available in the React Native as well. Not only Google DAI and Google IMA, I sorry forgot to mention, but has been fine-tuned during the previous quarter and ready to be used. So, not only Google IMA and Google DAI Connectors have been made available, but also tons of other advertisement service - MediaTailor, for example, which is, I think right now, one of the most powerful tools for server-side ad insertion available also for our iOS SDK, core SDK, and of course has been ported in React Native as well.

So right now, using MediaTailor will give you a lot of cool stuff available, automated beaconing and all the other capabilities that you expect from this kind of tool. So, I think again, in terms of advertisement, connector availability, the team did a great job. And as I said, I'm looking forward to your feedback.

Willem: Thank you, Andrea, that sounds great. I think all of our customers will be happy, but also the React Native customers will be very happy to hear your last comments. It was nice to hear that we're helping our customers monetize better, but it also seems that a lot of these improvements were done to simplify things and making developers' lives easier, which is a second core focus area of THEO.

Willem: Pieter-Jan, I know you're very excited talking about some of the work that our team has been doing there. So, what happened there?

Pieter-Jan: Well, a lot has happened there actually. I mean, doing video, it's not the easiest thing in the world. I think it's fair to say that there's a lot of moving parts. There's a lot of complexity. So, when we can take away this complexity, help our customers bring things to the market faster or just reduce the hassle of maintaining and versioning and all that kind of stuff. I mean, that’s something that we pride ourselves in. And from that perspective, it's also a continuous topic for our team to really work on because this really brings a lot of value for our customers in the end. And I already mentioned about the open-source UI framework that we've done, and Andrea has already mentioned a bit about the connectors, which are actually also open-source components that we are publishing to make sure that our customers have control over what they're doing or what they don't want to do.

But something that I'm actually personally very excited about, something that has finally been released or that we finally found time for within THEOplayer 6.0, is a rather technical thing. It's called ECMAScript modules. For those people who don't know it, ECMAScript modules are basically, the official standard for loading code in JavaScript. JavaScript being the main language for web, of course, allows you to basically load more easily the player that we have and the different parts of the player. What we've done is we already exposed THEOplayer in different flavors. So, it's already a modular SDK, but now you can import them with ESM modules. And that also allows us to distribute a new, a specialized flavor, which uses the latest ECMAScript or the latest JavaScript capabilities. And there you have to think about things like async await, I know very technical. But what it boils down to, if I don't look at the technical side, is that this allows us to output a more optimized SDK, which contains less of the, let's say, compensation code that we need to write to support the very old browsers or about very old web environments, which basically only means some of the oldest smart TVs out there. So, for all of the other platforms, what you can do is you can now choose to import new library for new platforms, the old library for the old platforms, and you get basically the best of both worlds having a massive speed improvement.

For example, if we just look at the ECMAScript modules, the impact of loading one of the new JavaScript libraries compared to the old ones, it actually reduces the size of the library with between 15 to 25%. And that is time that you just save in terms of time to first frame. So, I mean, this is a new library that massively speeds up nearly every platform. And Andrea, I think you're trying to say something, but you're muted.

Andrea: Indeed. But I just wanted to follow up on this, because indeed, reducing the size of our libraries was a point where we put some focus. And yeah, together with the modular approach and the ESM that you just described, PJ, this is a point that we kept on improving, right? So, one of the major things that we have done in this context was for example, removing our legacy HLS pipeline. So, from 6.0, the legacy HLS won't be part of our bundle anymore. And this will of course contribute to having smaller library size, and smaller library sites means also better performance that our customer will benefit.

In terms of HLS pipeline, I want to mention that our customers, some of our customers were already using the new HLS pipeline. The new HLS pipeline was delivered a while ago already, and it was mainly built with the purpose of bringing the low latency HLS. But since then, we kept on working on that pipeline and we brought a lot of improvement in terms of performance. Starting from 6.0, this new HLS pipeline will become actually the default one. And yeah, not only for HLS, not only for low latency HLS, but also for normal HLS streams. So also here again, I think we are bringing up some cool stuff for all our customers.

On top of that, there were a lot of other improvement done again in the context of enriching features, our React Native package. For example, we brought up support for picture-in-picture, background audio, and quite unique for React Native, we have fine-tuned our offline caching API. So now also on React Native, our customer will be able to use offline playback capability. What else? Media session, notification center integration will be part of a core SDKs as well on React Native. So quite some good stuff. What do you think?

Willem: Thank you, Andrea. And I see we just got a question from the audience. Pieter-Jan, I think this one will be for you:

“How does the 15 to 25% reduced bundle size for HTML5 impact platforms that do not support ESM modules?”

Pieter-Jan: Well, the nice thing is actually that, well, you don't need ESM modules on that platform in order to make use of ESM modules. So, our customers can still make use of ESM modules when they are bundling the player themselves. So that's a good thing. Of course, if the platform is really old, then you will need to load some of the polyfills that we use, where you cannot use the latest and greatest ECMAScript features. But even there, we're working towards allowing you to pick and choose which of these modules you really want to use, so that also on the old platforms, you might not need certain features. Something that we see is, for example, on very old smart TVs, sometimes our customers choose to not offer a certain SSI or they go to client-side ad insertion or something else, or you know that you're only going to do Dash and you're not going to do HLS, well then you can pick and choose and load just one of these pipelines, one of these modules, and that also can give you an optimization of your stuff.

Willem: Okay, thank you, Pieter-Jan. I believe that answered the question, but if it didn't feel free to add more questions in the thread, we like to keep these things as interactive as possible.

Willem: All right let's continue. Shall we move to the next slide, Andrea?

Andrea: Yeah, let's do that. I mentioned all the work that was done in terms of advertisement connectors. But we did quite some stuff in terms of analytics as well. So, all the analytics system that you see now in this slide, Youbora, Conviva, Mux, Agama, Nielsen, Comscore, those have been fine tuned to assure our customer the most accurate reports possible.

So, analytics is a very important tool for our customer and to be honest, for THEOplayer as well. So, we need to understand how we behave out there, right? So, we use frequently the connector, the same setup, within the same setup our customer use just to have a real feeling of, about the experiences that our customers have. So, in this sense, we got contacted by customers asking to help them to understand better the reports that they were observing. Sometimes was not so easy for them to decode the data they could gather out of those reports. So, we started looking into it and we found quite some interesting deviation. So, we, we dug into it and a lot of improvement has been brought in those connectors. And yeah, a lot of cool stuff.

Willem: I remember vividly Andrea that we were working together on some projects where customers were actually evaluating our player versus others using these analytics services. But we actually saw some inconsistencies between different analytics services and them reporting stuff differently. Can you elaborate a bit about that and how we improved stuff there?

Andrea: Yeah, well, actually it's quite simple. I'm working in the service desk, so I'm in contact every day with the customer. And it happened that some customer contacted us, raising question about the report that they were observing. And again, we started digging into it. We fine-tuned our testing system, and basically, we started running the same test against the same platform using the same stream. And we just integrated the different analytics. And yeah, surprisingly, those reports were showing a difference that we couldn't really understand.

So, for example, very basic use case of quite a simple playback session where a customer just hits the play button, waits for 500 milliseconds, then plays some stream. We were observing this and the user experience was just fine. And in this scenario, some analytics dashboards were showing that we were stalling. And this was actually incorrect. So, we asked our partner to help us out to decode what we were seeing in this report, right? So, we did quite of an extensive exercise together to fine tune the connectors in order to have accurate report. But let me explain this better. With accurate, I mean, report that were based on the same data and that both us customer, and analytic provider could interpret it the same way. So, we just try to unify the way of reading those reports. So, there was some work to be done and it was a very nice cooperation, I need to say, with the providers and we did some great stuff. So now those connectors have been fine-tuned, are open source. So, it's the good time to try them out. By doing that, we also find some stuff that we fine-tuned, for example, micro-stutters that sometimes were reporting stutters, but those stutters were invisible to the user. So, there was not really any impact, visible impact in the user experience. So, we just did the kind of cleanup exercise together with our partners in order to bring better reports.

And a lot of other stuff has been done by fine tuning those connectors and allowed us of course to improve also performance in the players. So now, I mean, by doing this exercise, we were able to bring up even better performance, fine tuning our ABR strategy, lots of improvement. I don't know, PJ, if it was clear or you want to further comment on this part. You were directly involved in this exercise.

Pieter-Jan: For me, it's obviously clear, but I've indeed been directly involved.  It's true what you mentioned, once we really had data for all of these connectors correct, so that we make sure that whatever the analytics partner is expecting that they get, that we are actually sending it. Because what we noticed is not just with our player, but also with other players, is that there is a lot of misalignments. We were expecting that the API of some of these analytics services had to be interpreted in one way. And when they were extending code, then they were expecting that our API, or the API of a different player, was working in some other way. And sometimes there was a misalignment. But after this work, as you said, we had all of the data being sent through correctly. And that allowed us to really start harvesting large quantities of data and see where there were still problems in the player. And I think with this new version, with THEOplayer 6.0, we were able to tackle a lot of these problems. And we are really setting out a new benchmark in terms of performance.

If I look at the results that our team has been able to achieve, then you can see that even in worst case kind of scenarios, we are still pushing a way better performance. There’re better startup times. There is even less stalling than there was before. ABR switches are working in an even better way. And I mean, this is just amazing work that our team has been able to do. It was a lot of work, I mean, cleaning up all of the data first. But right now, I mean, this gives us a really powerful framework to push this even further than we have been doing in the past.

Another thing that I actually found very interesting that the team has been working on, and that's not really related to this, but partially related to this, is actually the capabilities to set different decoders on the Android SDK. So, for those people who don’t know, well, you have a lot of different devices. I think everybody knows that there's a lot of different vendors and a lot of different phones. And in a lot of cases, there are different decoders for video on these devices. And something that our team has been working on is they actually added an API so that our customers can choose which decoder has to be used on a specific device. Now with that, combined with data from analytics, what you can now do, is you can now dynamically update which decoder to use without even the need to update your application. So that's helping our customers in the field already today to improve the way how their applications are working on Android. And I mean, this is really something which I find very, very interesting as well.

Willem: Thank you, Pieter-Jan. And this was the work that Daniel wrote a blog post on, right? Even as a non-technical person, that was an interesting read. So, I would recommend it. I would recommend everybody on this call to read through it. Very interesting read, very in-depth.

Willem: While we were talking, we got one other question, Pieter-Jan and Andrea:

“Does this mean we might see higher video stream analytics once we update to THEOplayer 6.0?”

I think more accurate is what I would say.

Pieter-Jan: It depends on what you mean with higher. You will not see a higher video startup because we've also reduced, well, we've improved THEOplayer itself to reduce the startup time. But what you can actually do, and that's an interesting side effect of all of these functionalities being connectors, so being around the player actually. If you update to THEOplayer 6.0, you will see an improvement in startup time, you will see improvements in stalling and all those kinds of things. But even if you would stay on a 5.x version or on a 4.x version even, you could update those connectors. And I highly recommend everybody to do so because when you do that, then you will actually start seeing more, well, more truth in your analytics. As Andrea said there, there were some surprising use cases where, for example, one specific analytics vendor was marking the video startup time as a stall as well. So, if you had a higher startup time, then it looked as if you had been stalling during the video, a very, very weird scenario. So that kind of anomalies, yes, they will go away if you update the analytics connectors.

Willem: OK, thank you, Pieter-Jan. Let's move on.

Willem: A very interesting, exciting project that we haven't talked about today is our early access program for a Flutter SDK, because it won't be released yet in 6.0, which, by the way, because there was a question that came in as well, will be released next week right before IBC. So, I think next week, Tuesday, Wednesday, Thursday, some of that ballpark. For those that have been following us for a while, almost two years ago, we started exploring React Native as an application framework to have more dedicated video player modules that you can integrate directly in your application framework. It's been afterwards, we did an early access program as well. We had a lot of interest. We now have React Native SDKs, which a lot of our customers are using. Now we've seen the same move with Flutter, so, we said - OK, let's also dive into it, let's make the lives of our customers easier, let's start building a Flutter SDK. Same principle. So, we are opening up an early access program. If you are using Flutter in your applications or you are considering it, please, take a screenshot or use your camera to scan the QR code on screen, and then you can register. We have already been getting a lot of interest, so you will be part of something very new. We're the first commercial video player to do this, as we were with React Native. So, you can be really on the cutting edge of video playback and Flutter.

Willem: And that means we're almost wrapping up our webinar before we will dive into Q&A. So key takeaways, like I mentioned in the beginning, THEOplayer always focuses on three items, monetization, viewer experience/performance and developer experience.

So that means in five bullet points, we did further improvements to accelerate monetization of your FAST/AVOD service, including new ad connectors and advertisement capabilities in our Open Video UI. Performance, a smaller and more efficient web player thanks to ESM modules. Better developer experience through the more updated analytics connectors. So, you see better what's happening. Increased performance through new features, optimizations of our analytics connectors and further reductions in startup time, which I think is a very key item for a video player. And then also the Android decoder selection extension, which makes it easy to select the right decoders without having to republish your app. Pieter-Jan, Andrea, I don't know if you want to add something to that.

Pieter-Jan: I think there's already a lot of questions coming in, so that's good.

Willem: Okay. Very good, let's dive into them.

Willem: Let's see here. I just mentioned Open Video UI. So, let's take that one:

“With Open Video UI, can we use our own UI components for the video player?”

Pieter-Jan: The answer is yes. So, as I mentioned a bit earlier, the Open Video UI is actually based on whatever the native component framework is of the language that you are developing in. So be it web, be it Android, be it React Native, whatever. So, for example, if you look at web, then it's built on web components. So yes, you can write your own web components and use them in combination with the Open Video UI and because the Open Video UI is actually open source. You can write your own components, you can modify existing ones. And of course, we are very open for any contributions. So, we're happy to merge those into the code repositories so that everybody can use them.

Willem: Very cool! Another one that was where we ended the key takeaways with:

“Decoder selection allows to blacklist specific decoders for specific devices?”

Pieter-Jan: Yes, so it allows you to select the preferred decoder, but it also allows you to just disable some decoders for some devices. So how this really works internally inside the player is that we always have like a preference - this is the one that we believe is the best one, which is also based on blacklisting and whitelisting on our side. But of course, if customers meet new platforms or new specific devices, or if they have a preference for another decoder or a blacklist for a specific decoder, because for example, they have an HDR stream and there's something wonky going on this one device, yes, then they can just as well blacklist if they would want to.

Willem: Okay, thank you, Pieter-Jan. Then a practical one, somebody mentioned the QR code is not working for them. We will send a link in the follow-up email to the page where you can register for the Flutter early access program.

Pieter-Jan: I see on the decoder selection, by the way, that somebody is posting that a specific decoder is failing on some specific Xiaomi or Sony devices with the question that - 'is this also going to come to React Native?' And the answer is yes. We will bring this capability to React Native as well. Actually, our React Native SDK is also fully open source. So, while it's not in there yet, you could just as well access it directly from the underlying Native SDK as well. But I believe that it's planned to add this in as well.

Willem: Okay, very cool. I'm loving the interactivity and all the questions coming in. Another one is:

“The 6.0 update also affecting the Tizen and WebOS SDKs?''

Pieter-Jan: Yes, it's going to affect all of the SDKs. We actually have only one HTML5 technology-based SDK, which is called our HTML5 Tizen WebOS SDK. So yes, everybody is getting an upgrade. So that's good news, I guess.

Willem: Cool! All right, I think that we've answered all the questions that I'm seeing here in the question section, in case anybody still has a burning question write it down now. In the meantime, I will be closing off.

Willem: So, you heard a lot of stuff about THEOplayer, the biggest show in our industry in Europe - IBC in Amsterdam next week in the hall five, booth B39. You can book a meeting through our website or reach out to us on LinkedIn if you want to set something up. If you have any questions about the webinar, THEOplayer 6.0, any improvements, reach out to your account manager if you're an existing customer, reach out to us on LinkedIn if you have any questions. We have our emails here.

So, before I say thank you for joining, a question came in. 

Pieter-Jan: So. I'm already answering it in the chat. The question was: 'are we open for contributions on open source?' The answer is obviously yes. So, we're absolutely open for contributions there.

Willem: Which that's maybe a good thing to end with, which I've been seeing at least that our customers really enjoy it, that the core of THEOplayer we obviously keep closed source, but everything which connects to your services, analytics, advertising, DRM, we keep open source so you can contribute yourself and it makes it a much more dynamic environment and less of like box. So very cool stuff! Actively used by some of our biggest customers actually. I think if you look at the React Native SDK, there's been quite a lot of input from customers and partners as well. All right, and with that being said, I think we're at the last slide. And I want to thank you all for joining today. Visit us at IBC or other shows later in the year, I think we're doing a gaming expo in Vegas, we're also in Barcelona. And then I wish to see you back during the next webinar. Will it be on React Native or 7.0 or Flutter? We will definitely let you know. Have a good day. Bye everyone.