Business Challenges of Web Broadcasting

Whether it is local software streaming or web streaming, it is necessary to solve problems such as streaming jitter, high-visibility images, and audio freezes. In the current web technology environment, how to stably present high-quality audio and video streams to more users is the focus of our technical team. From a technical point of view, let's interpret a few key words here:

• Stability: The stability of the transmission protocol itself needs to be guaranteed. Reliable transmission is preferred to prevent problems such as blurred screen and noise caused by network loss. More importantly, it can be quickly switched when the service link is unavailable. service line. Therefore, it is necessary to provide multi-line backup capability in streaming scenarios.
• High quality: In some scenarios, such as medical and beauty marketing scenarios and delivery scenarios, it is necessary to display product details, which requires technical solutions to choose as much as possible with less loss of image details under the premise of bandwidth permitting. encoding scheme
• Large-scale users: To distribute to more users, the technical solution design will definitely introduce live CDN services, but whether the streaming protocol can be supported by live CDN is a point of consideration, and it is also a point that cannot be satisfied by private protocols.

The technical principle of WebTransport

First of all, let's briefly understand the basic technical principles of the transport protocol WebTransport. WebTransport is an application layer transport protocol based on HTTP3. The bottom layer of HTTP3 is based on the quic protocol. The quic protocol is a set of transport protocols based on the UDP protocol and supports reliable and unreliable transmission.

Technical Advantages of WebTransport

The significance of WebTransport to web applications is not limited to a better transport protocol, but it also brings a richer technology stack, which can achieve a better application experience by combining WebCodecs, WebAssembly and WebNN according to actual scenarios. . Compared with WebRTC's relatively centralized technology stack, this method is obviously more flexible, and it is easier to make more flexible technology combinations.

Another obvious advantage is that WebTransport can take advantage of multi-threading on the page. Using the WebRTC protocol, a large amount of logic can only be executed on the main thread, but using WebTransport can put the entire audio and video processing process in WebWorker, reducing the load on the main thread. Thread occupancy improves page fluency. Using multiple threads at the same time can improve the scalability of the application, and threads can be used for abstraction and isolation when facing more audio and video tasks.

Make full use of the multi-thread mechanism to reduce the burden on the main thread

Using multi-threading mechanism to improve application scalability

In terms of the characteristics of the transmission protocol, its establishment speed is faster, and only 1 RTT is required for the first establishment of the association. In contrast, TCP requires 2 to 3 RTTs. For the connection that has already been established, 0RTT can be achieved by re-establishing the connection within the timeout period. In the case of network congestion, the optimization of speed by reducing the number of RTTs is very obvious. It can reach tens of ms. The last feature is connection migration, if the WIFI network is not good during the live broadcast. Switching to the hotspot of the mobile phone can also achieve 0RTT. In contrast, both TCP and RTC need to re-establish the connection, and the recovery speed will be much slower.

The first connection is 1~2RTT faster than TCP 

Support 0RTT for cached connections

Based on these advantages, the live streaming team of Volcano Engine chose to use WebTransport to optimize live streaming. The design scheme is based on the stable transmission of one-way streams, and RTMP is standard in terms of transmission format, so that the support cost of live CDN will be relatively small, and it is better to reuse the current RTMP stream receiving logic. Since this technology stack is relatively new, some problems in the process need to be solved: Although W3C defines the encoding capability of AAC, Chrome does not provide the implementation of AAC encoding. It can be implemented by compiling libFaaC into a wasm library. In addition, browsers do not target flv containers. The encapsulation requires additional support for this part of the capability. So compared to WebRTC streaming, what is the actual application effect of WebTransport streaming?

Comparison between WebTransport streaming and WebRTC streaming

Why WebTransport can achieve better results than WebRTC streaming:

Network transmission (quality and stability):

WebRTC is a transport protocol for real-time communication and is sensitive to changes in network latency. When using the WebRTC protocol to push streams, it is greatly affected by network jitter. When the network delay jitter occurs, the RTC bandwidth estimation module will think that the current network is in a congested state, and it is necessary to reduce the sending bit rate to avoid congestion. The impact of reducing the video quality is very large, and the intuitive feeling will appear partial mosaics. When using WebTransport based on Quic reliable transmission, its congestion control algorithm is relatively less sensitive to network jitter, and can guarantee transmission reliability by sacrificing a certain delay, so it is not easy to greatly reduce the transmission bandwidth, and the image quality is relatively guaranteed .

Encoding optimization (quality):

WebTransport provides network transmission capabilities in Web specifications, and can be deeply integrated with existing Web-side multimedia capabilities, such as WebCodecs and WebGPU. It provides more room for encoding format and parameter selection for application optimization.

Easy integration to live CDN (distribution at scale):

WebTransport is based on the finalized HTTP3 specification, which is easy to be integrated and supported by live CDN. Compared with WebRTC, the application complexity is lower. At the same time, it saves the signaling link in the process of RTC push and connection establishment, which can speed up the speed of first frame push and is convenient. Deploy to more live CDNs

First of all, in the case of network jitter, if the delay jitter of 100ms is also added, the picture of WebTransport streaming will be obviously clearer than that of RTC streaming. In the scenario of network preemption, a lower bandwidth is fixed, and the data flow using the GCC congestion control algorithm, in the face of data transmission using the TCP protocol, the bandwidth resources it can allocate are very small.

WebTransport streaming + 100ms delay jitter

 WebRTC streaming + 100ms delay jitter

In addition, under a network with a fixed 3Mbps upstream bandwidth, WebTransport and RTC streaming are used at the same time, and the target bit rate is set to 1.5M. During the process, the bit rate of RTC streaming will be seriously affected, and the bit rate will drop sharply. Guaranteed picture quality. The fluency performance of WebTransport streaming under different network conditions can be basically equal to that of RTC streaming in other scenarios except for a large number of packet loss cases.

WebTransport streaming

 WebRTC streaming

Summary and Outlook

Different streaming protocols have their own advantages and disadvantages. Currently, there is no perfect solution. It needs to be selected according to the actual scenario. For example, WebRTC retweeting is generally required in the Lianmai scenario, which is more suitable for low-latency interactive scenarios. The WebTransport solution It is more suitable for scenes with high image quality requirements. In general, the WebTransport streaming solution solves the problem of "how to stably deliver high-quality audio and video to a large number of users", that is, it achieves reliable transmission, guarantees connection stability, and does not suffer from network loss. In some scenarios, audio and video quality can be guaranteed by sacrificing part of the delay, giving a relatively satisfactory answer. If you want to experience the broadcasting effect of WebTransport, you can enter the Volcano Engine Console for an online demo experience.