The last article covered some audio and video basics. This article briefly shares the history of the development of Web audio and video related technologies.

Early HTML

Web resources on the network are published by the Web server and have Uniform Resource Locator (Uniform Resource Locator). Users can enter the URL in the browser to view the resources. Web resources can be any type of download medium, and the Web page we look at is one of them, a hypertext document formatted with hypertext Markup Language (HTML). Early HTML, limited by bandwidth, technology and other factors, was mainly simple static content, only supported some text and image content and simple typography. . Online audio and video viewing is not supported.

The rise of the Flash

With the development of the Internet and the rise of Web applications, people are more and more eager to display more advanced media content on the Web page, such as animation, video and so on. And Flash came into view: Around 2000, dial-up Internet access was widely used for Internet access. Limited by network bandwidth conditions, it took several minutes to download a video. Flash, with its features of vector drawing, edge-down casting and less bandwidth occupation, was conducive to spreading and sharing in the network conditions at that time, so Flash became popular. Flash is now installed on many computers, and web pages are starting to feature flash-based animations and advertisements. In 2002, Flash Player version 6 added support for SWF file format video. Allows users to embed videos in Flash. In 2003, Flash Player 7 added direct support for FLV file format, which effectively solved the problem of large SWF files exported after the video files are imported into Flash and cannot be effectively transferred and used on the network. FLV files are small in size and therefore cost less bandwidth to transfer over the network, making them an ideal streaming format for online viewing. In 2005, Flash Player supported VP6 as a video codec. Around 2005, many video websites were established, such as YouTube in foreign countries, Tudou and Youku in China. They allow users to upload, view, rate and share videos. At that time, HTML did not have standards related to audio and video, and Flash had many characteristics described above. Therefore, most early video websites used Flash to play videos, that is, users were required to install Adobe Flash Player plug-in and embed it in HTML to play videos. Besides TV, people have a more novel and convenient channel to share and watch videos. The number of users keeps increasing. Many people start to try to shoot and make videos and upload them to video websites for sharing, and video websites begin to flourish.

The advent of HTML5 and the demise of Flash

HTML5 was released in 2008 and has been improving ever since. HTML5 introduces a number of new features and features, including the video and audio tags, which support audio and video. Using a web browser that supports the HTML5 standard to access HTML5 sites, users can watch videos online without having to install a Flash plug-in on their computer, freeing them from reliance on Flash.

<! -- A simple video tag -->
<video src="movie.mp4" poster="movie.jpg" controls></video>
Copy the code

With the advent of the smartphone era, people begin to watch videos on a variety of smart devices, which requires better compatibility of sites and better viewing experience. And because Flash itself has many security problems, ios does not support Flash and many other factors, leading to the major video websites have begun to eliminate the pace of Flash. Many video sites have been testing and using HTML5 for video services in the last 10-12 years, and slowly starting to use HTML5 as the default playback option. By 2017, Adobe had officially announced that it was abandoning Flash, and that it would stop supporting, distributing, and updating Flash Player in 2020. Today, almost every video site still in operation does not have Flash as an option and has abandoned Flash altogether.

Real-time communications and WebRTC

With the commercialization of 4G, we have ushered in the era of a hundred flowers blooming in audio and video applications. There is a growing demand for real-time audio and video communication in medical care, education, teamwork, live entertainment and other fields. Technologies such as WebRTC are also starting to make their mark. WebRTC stands for Web Real-Time Communications. It provides real-time communication between Web browsers and mobile applications through simple application programming interfaces (apis), and allows direct point-to-point communication without additional plug-in installation or application download. You can have audio and video communication running within a web page. WebRTC has the characteristics of low bandwidth consumption and low latency. Most major browsers already support WebRTC, and many live streaming and real-time communication applications now use WebRTC technology. In January of this year, both the W3C and THE IETF announced WebRTC as an official standard. WebRTC still has huge development potential in a long time to come. Attached here is the official website address of WebRTC. At the same time, they provide a Github repository, which contains weBRTC-related sample code for your reference. I will also share how to use WebRTC on the web.

At the end

When collecting relevant materials this time, I found a website, which shows the trend of website Design from 1991 to now in the form of pictures. You can have a look at it, and if you are interested, you can save it in Web Design Museum. Some pictures in the article are also taken from this website. The time span of this article is quite long, from the 1990s to the present year of 2021, I have selected four periods to briefly introduce, the level is limited, welcome everyone to put forward valuable suggestions. Get a thumbs up at the end! Thank you very much!

“This article was originally written by the Developer community of Sonnet.”

(Some content in this article comes from the network, if there is infringement, please contact to delete.)