Distribute Expertise: Flash vs. Silverlight

Figure 1. If you glanced quickly at Entertainment Tonight's website, you might assume that it was designed in Flash, but it's a Silverlight site.

Since its introduction at NAB Show 2007, Microsoft Silverlight has achieved a number of high-profile design wins — including mlb.com, nba.com, and NBC's streaming technology for the broadcast of the upcoming Olympics. Although Adobe Flash is still far and away the mindshare leader, Silverlight has established itself as an alternative that many web professionals must at least consider when choosing a technology for web design or web video. In this article, I'll outline the various roles that each technology performs and discuss factors to consider when evaluating the two technologies.

Flash and Silverlight can play multiple roles within an organization, so let's start by identifying those. First is the video-player role. For example, if you want to add video to an existing website, you can choose either a Flash solution, which involves the Flash Player playing back either VP6 or H.264 video, or a Silverlight solution, with the Silverlight player playing back Windows Media Video or VC-1.

Just to be clear, Silverlight is an alternative to Microsoft's Windows Media Player, which could also be used in the video-player role. However, as a browser plug-in, Silverlight has a much smaller download profile (around 4MB) and superior cross-platform support. Like the Flash Player, the Silverlight player can only play media from a website, not content that's already on your hard drive. For this, you'll continue to need the Windows Media Player for Windows Media content and the Adobe Media Player for Flash content.

The second role these technologies play is as a development environment for websites — including a player for rich Internet applications (RIA), which I describe later. In this role, the development environments for Flash and Silverlight are alternatives to HTML for website creation, especially for the media-rich websites that Flash has become known for. For example, Figure 1 is a screenshot of Entertainment Tonight's website for the most recent Academy Awards. At first glance, you'd assume that it was designed in Flash, but it's actually a Silverlight site. You can see more sites designed in Silverlight by visiting silverlight.net/showcase.

Third is the streaming server/player role. To access features such as digital rights management (DRM), multicast, or live streaming, web producers need to pair a streaming server with the player. In this section, I'll evaluate the server-related functionality of the two technologies.

Let me start by describing the approach I took to researching and writing this article. First, I had lengthy conversations with product managers from both Adobe and Microsoft. Both companies supplied technology references who I spoke with while writing this story. For broader perspective of more strategic issues, I spoke with colleague Tim Siglin from streamingmedia.com, whose article “More Flash Brings More Light” is a great overview of Adobe's and Microsoft's battle for ownership of rich-media applications.

Figure 2. The Seattle SuperSonics' website is an all-Flash site.

In 2006, I wrote several codec-related case studies focusing on why companies chose different streaming technologies. One of the more fun case studies involved ESPN, a site that uses Flash as a player/codec because it was ubiquitous and customizable. It also allowed the company to design an easy-to-use player that integrated its branding and provided optimal presentation of other content.

Back then, Flash was the only technology that offered more than the bare minimum of player customization. Probably the most fundamental feature of Silverlight is the easy ability to select and customize a player, much like you can do in Flash. Specifically, when producing your video in Microsoft Expression Encoder 2, you can choose among a variety of player templates and also insert chapter points and captions into your videos (see Figure 3). After producing the template, you can use it as is or customize it further in Expression Blend 2.

Figure 3. The Silverlight player has chapter points and captions. Playback controls appear when you move the mouse over the video playback window.

Throw in the currently free Silverlight Streaming Service, and Silverlight presents a very strong product offering for casual producers without programming resources or budget for same. While you can customize the Flash player and add chapter points and captions, you can't perform these functions in the Flash encoder; you have to use Flash itself, which is much more challenging. Currently, Adobe offers nothing that competes with the Silverlight Streaming Service.

In addition, Silverlight's customizability should be of great interest to all current Windows Media producers, because it lets them create a more attractive, easier-to-use player than the Windows Media Player they're currently using. A good example is the beta version of the Silverlight player, which will be used to broadcast the summer Olympics.

Table 1. Player-related features of Flash and Silverlight.
Click here for a larger image

There are many factors beyond customizability to consider when choosing a player (see Table 1). Supported platforms is critical, and both Silverlight and Flash support Windows, Mac, and Linux platforms — Silverlight via an agreement with Novell. Flash adds Solaris support, which is important for those targeting highly technical viewers, but that's obviously not a critical consideration for Entertainment Tonight's website.

As mentioned above, one of the advantages of Silverlight over the Windows Media Player is that it's a much smaller download. Although it is still almost three times larger than the Flash Player, at 4.3MB, it's a short download for the broadband customers that most rich-media sites are targeting.

Penetration measures the percentage of viewers on the available platforms that have downloaded the respective player, and Flash shines here with an overall penetration rate of 98 percent — 62 percent of which were H.264-capable. Not surprisingly, in March 2008, research firm comScore reported that 75 percent of online videos are viewed with Flash technology, making Flash the number-one format for video on the Web.

In contrast, Microsoft hasn't released Silverlight's penetration rate, but the company claims downloads of 1.5 million plug-ins a day. Irrespective of download size, forcing a visitor to download a plug-in to view your site's content involves a risk, however slight, that they'll decline and surf away. Today, this makes Silverlight a riskier solution.

Another important factor is the quality of the codecs available on the respective platforms. As you can see in Table 1, Flash supports both the On2 Technologies VP6 codec and the H.264 codec (as well as older codecs such as Sorenson Spark). Silverlight supports Microsoft's Windows Media Video codec, which is the same as VC-1. It's important to note that Silverlight introduced no improvement in VC-1 compression quality.

One developer that I spoke with — Kyle Snarr of Struck Creative, an award-winning web-design firm in Salt Lake City — felt that H.264 support was a big asset for Flash, because it allowed the company's clients to deliver higher-quality video at a lower data rate. Snarr wasn't concerned that only 62 percent of the Flash-installed base could play H.264 video, because Struck's clients — including DeBeers and GM — assume that users will have fairly robust, up-to-date systems, and because the websites that Struck Creative designs always make it easy for visitors to update to the necessary plug-ins.

Regarding codec quality, in May 2008, I compared VC-1's quality to H.264 and two versions of On2's VP6 — the currently shipping version and a newly introduced beta version that On2 claimed improved compressed quality by about 40 percent. For my tests, I produced SD and HD test clips using the old and new versions of VP6, H.264 video using Rhozet's Carbon Coder, and VC-1 video produced by Microsoft's Expression Encoder 2.

Figure 4. VC-1 just can't compete in quality with the H.264 or VP6 codecs.

Overall, VC-1 placed last in nearly every quality test, including the HD video from The Nutcracker ballet shown in Figure 4. While the differences were certainly less noticeable in the SD test clip, codec quality is a definite plus for Flash and a negative for Silverlight.

For the record, these findings are not new; Microsoft has trailed others in compression quality in the last several comparisons that I've performed. Interestingly, now that Flash can play H.264 videos — supplementing Adobe's proprietary codecs — Microsoft would seem to have less incentive to continue promoting its proprietary codec and more incentive to adopt H.264. This is especially true as the target market for streaming video inevitably shifts toward cell-phone display, because H.264 will be the codec of choice on these low-powered devices.

One of the more fun rumors floating around the floor at Streaming Media East in New York last month was that Microsoft would include H.264 playback in the final release of Silverlight 2.0 — in part to support NBC's Olympic broadcast, which could enjoy lots of cell-phone-based viewers. As much sense as this would make, I checked with my Microsoft contacts, who denied that Silverlight would play H.264 files before the release of Silverlight 2.0, which is scheduled for after the Olympic Games this summer. That's Microsoft's story, and as the saying goes, the company is sticking to it.

Beyond simple audio/video playback, both Flash and Silverlight can serve as players for rich Internet applications, an alternative to HTML design. Before starting the comparisons, let's survey the battleground — which is much more complicated than Silverlight vs. Flash in the simple media-player role.

In essence, both Silverlight and Flash are competing to become the platform of choice for rich Internet applications, which Wikipedia defines as “web applications that have the features and functionality of traditional desktop applications. RIAs typically transfer the processing necessary for the user interface to the web client, but keep the bulk of the data (i.e., maintaining the state of the program, the data, etc.) back on the application server.”

In essence, RIAs are browser-based programs that provide similar functionality to desktop applications. A great example is Adobe's Photoshop Express, a browser-based RIA that enables a very good range of image-editing features in a very easy-to-use interface.

Not convinced that Adobe and Microsoft are targeting RIAs with Flash and Silverlight? Here's a quote from Adobe's website: “Use Adobe tools, clients, frameworks, servers, and services as a complete solution for building RIAs, or use them in combination with other familiar web technologies.”

Here's a bit from Microsoft's Silverlight FAQ: “Microsoft Silverlight is a cross-browser, cross-platform, and cross-device plug-in for delivering the next generation of .NET-based media experiences and rich interactive applications for the Web.”

Why are RIAs so strategically important? Primarily because from a development tools' perspective, RIAs sit at the intersection of Adobe and Microsoft's past and future. Although they are less well-known than the Windows operating system and Office Suite, Microsoft development tools such as Visual Basic (VB), C#, and .NET are very widely used to primarily develop desktop applications. Now the Silverlight browser plug-in is the vehicle to port these applications to the Web in the form of RIAs. With Flash, Adobe was primarily focused on Internet functionality, but with the new Adobe Integrated Runtime (AIR), the company is porting these RIAs to the desktop.

In short, Microsoft traditionally dominated the desktop, and it is moving to the Web. While Adobe has dominated the Web, it is moving to the desktop — with RIAs in the middle of the two strategic moves. The approach that ultimately wins will sell the dominant share of development tools for creating RIAs and perhaps both web and desktop applications.

In the words of Silverlight developer Scott Stanfield, CEO of Vertigo — the company that designed the Hard Rock Café Memorabilia website using Silverlight: “Adobe has the hearts and minds of the design community, while Microsoft has the hearts and minds of the developer community. You need both to create RIAs.”

Along these lines, Stanfield reports that while the designers on his staff currently use Adobe Illustrator and Photoshop, he's trying to wean them off these tools and migrate them to Expression Studio — Microsoft's key Silverlight design tool — because it simplifies the Silverlight workflow. Obviously, ActionScript 3 programmers don't purchase VB, C#, or other Microsoft programming tools. Overall, Expression Studio threatens Adobe's Creative Suite 3 franchise, while Flash threatens sales of Microsoft's programming tools.

Table 2. Comparing Flash and Silverlight as development environments.
Click here for a larger image

With this as background, let's discuss some of the differences and similarities between the two technologies as described in Table 2. First, neither approach requires a special server; both should work with your existing web server, which is probably already obvious to most readers.

Adobe's chief design program, Flash, is available on both the Windows and Mac platforms, while Expression Studio is available only on Windows. This fact alone will be sufficient for many readers to mutter, “Microsoft still doesn't get it.” It's hard to disagree. That said, Microsoft packs a lot of functionality into Expression Studio — including Expression Web, a website-authoring program that replaces FrontPage and Design for image editing and creating vector graphics; Blend, for creating graphical interfaces for web and desktop applications; and Media, a digital asset-management program.

In terms of complementary design tools, Adobe has all the programs in Creative Suite 3, while Microsoft has nada. Because the vast majority of those developing content for the Web use Photoshop and Illustrator, the ability to import these formats into Flash — while preserving layers and other native characteristics — is a real strength that Adobe will work to enhance in future versions.

Finally, as you can see in the Table 2, you can create Silverlight applications in more programming languages than you can with Flash, which is limited to ActionScript 3 and Ajax. Undeniably, VB, C#, and .NET are all very popular languages with lots of experienced programmers. However, very few of these programmers have ever done web-design work, while all ActionScript 3 programmers have been almost exclusively involved with web design.

Snarr reports that when Struck Creative hires a web designer, the company is really seeking a “part designer, part programmer; and that candidates who fit that profile have all been using Flash.” He also reported that in a recent project, his firm had to produce some .NET functionality. The company searched extensively for a programmer who knew .NET and rich-media web design, but ultimately they couldn't find any qualified candidates so an internal staffer had to learn .NET to complete the work.

Turning that around, however, if you have lots of experienced developers who know the .NET framework or languages such as Visual Basic or C#, Silverlight is a great vehicle for expanding their skills into rich Internet applications. This is especially true if you're porting an existing desktop application written in one of those languages to the Web.

For example, Stanfield reports that when Vertigo received access to Silverlight's Deep Zoom technology, he immediately convinced the Hard Rock Café client that it was a must-have addition to the site. To meet their deadlines, he added several .NET developers to the team — none with Silverlight experience — and they were instantly productive because they were using the “same toolset, the same source control system, and the same language,” he says. “If you have .NET resources available, it's much easier to teach them web design or how to work with web designers, than to have them learn ActionScript 3.”

That said, Flash's biggest advantage as a development environment is that it's proven for rich-media websites, and Silverlight is the newcomer. For example, Ron Matthews, digital-media director for the Seattle SuperSonics, recently switched over from the NBA's HTML-based content-management system to produce the league's first all-Flash site (Figure 2). His vision was to deliver an immersive experience with exclusive behind-the-scenes video, audio, and photo content, including game coverage, player interviews, and dance team videos.

However, Matthews also wanted to monetize site content with provisions for video advertising and offer others the ability to embed the new integrated media player into their websites or blogs. Although he considered Silverlight before ultimately choosing Flash, Matthews ultimately decided that the project itself “involved enough unknowns” that he wanted to stay with a technology that they did know. The other factor that Matthews cited in his decision to choose Flash was the installed base, airing his concern that a certain percentage of visitors forced to install a plug-in to view content will decline and walk away.

Table 3. Server/player functionality of Flash, Silverlight, and Windows Media.
Click here for a larger image

The final relevant comparison of Flash and Silverlight is as a combination of server- and player-related functions as shown in Table 3. To access these features, you'll need to install one of Adobe's Flash Media Servers or a streaming server from Microsoft. Note that I've included Windows Media and Silverlight under separate columns because many organizations would consider both alternatives and their functionality differs.

Starting at the top, note that Silverlight streams via the HTTP (hypertext transfer protocol), while Flash uses RTMP (realtime messaging protocol) and Windows Media RTSP (realtime streaming protocol). Briefly, HTTP is the generic protocol used to push all information from a web server out to the viewer; RTSP is the industry-standard streaming protocol supported by most streaming servers; and RTMP is a proprietary protocol developed by Adobe for Flash.

Using HTTP for Silverlight has several implications that may or may not be important depending upon the application. Unlike both RTSP and RTMP — which enable true streaming — distributing via HTTP typically means that the file must be cached on the hard drive before playback, where it's easier to capture and pirate. However, if you create a custom Silverlight Player, you can include an option in the player that reads the stream directly without caching — preventing problems associated caching.

In most instances, communicating via HTTP usually prevents bandwidth negotiation, which is why the first version of Silverlight didn't support multiple-bit-rate (MBR) technology. Briefly, MBR lets a streaming server dynamically adjust the bit rate transmitted to the player to match varying throughput conditions, dropping the data rate when packets are lost and increasing the data rate as throughput improves.

However, MBR requires bandwidth negotiation between server and client, which wasn't possible with Silverlight 1.0. It will be available when version 2.0 ships later in 2008, enabling MBR. In March 2008, Microsoft also announced an agreement with Move Networks that will allow adoptive streaming for Silverlight content viewed with the Move Media Player.

Although bandwidth negotiation is available using the RTMP server protocol, Flash previously didn't support MBR functionality. However, with the release of the beta version of Flash Player 10, Adobe announced “dynamic streaming,” which similarly adapts the delivered bitstream to changing line conditions. Note that you'll need a future update for the current versions of the Flash Media Servers to access this feature.

Digital rights management (DRM) is another area where Flash has made significant recent strides. There was no DRM available at all until the launch of Flash Media Streaming Server 3.0. The new family of servers — which shipped in early 2008 — provides multiple options for digital rights management, including SSL encryption, RTMPE realtime encryption, and user authentication.

Although Windows Media has long offered a wide variety of DRM alternatives, including encryption and authentication, the first version of Silverlight shipped without this functionality. At NAB Show 2008, Microsoft announced that Silverlight DRM will be powered by PlayReady — a Microsoft DRM technology that will be backwards compatible with Windows Media DRM. PlayReady will be fully implemented by the time the Silverlight 2.0 player ships later in 2008.

As shown in Table 3, you can stream live to all three players — another relatively new innovation for Flash. However, streaming to the Windows Media Player is the only option for multicast, which is a highly efficient distribution method that allows multiple viewers on a network read the same stream.

The final item on the table reflects Microsoft Silverlight Streaming by Windows Live, which is a free hosting and streaming solution for Silverlight content. Today, users can store up to 10GB on the site and stream up to 5TB of aggregated bandwidth per user account per year. In the future, Microsoft will offer unlimited streaming with advertising, or with payment of a nominal fee for use of the service without advertising. Adobe doesn't currently offer a similar service.

The net

Overall, Flash vs. Silverlight is not a zero-sum game. Organizations faced with a wide variety of programming initiatives will likely find Flash right for some and Silverlight optimal for others. That said, the web-development community is largely composed of Flash fanatics, who harbor a great deal of natural skepticism regarding Silverlight. Microsoft needs to continue to add functionality to its offering, and then the company could do a much better job distinguishing clear usage cases where Silverlight is a better option.

To comment on this article, email the Digital Content Producer editorial staff at feedback@digitalcontentproducer.com.