Scott Hanselman

Should I use HTML5 or Silverlight? One man's opinion.

May 4, '11 Comments [75] Posted in ASP.NET | Musings | Silverlight
Sponsored By

I was in Belgium and The Netherlands this last week presenting and talking to folks in the community. After I presented on ASP.NET MVC 3, HTML5 and jQuery, one fellow came up after and said, "Should I use Silverlight or HTML5. I don't understand what Microsoft's strategy is or what to use in my app."

Since I work for the Web Platform and Tools team (ASP.NET, IIS, etc) I spend a lot of time working, coding, and thinking about the web. However, I'm not an official strategist, or marketing guy.  But I do have an opinion; one that is mine and no one else's.

That said, I don't think it's that hard and I'm surprised there's so much confusion about this (both outside and inside Microsoft.)  Companies have their official positions but then there's the realities of the web. Here's what the young man asked me and what I told him.

NOTE: I'm talking only about Silverlight in web browsers, not Silverlight for Phone, Games, Out of Browser, High Trust, and other environments that are uniquely Silverlighty.

Should I use HTML5 or Silverlight in my Applications? If you're embracing jQuery, where does Silverlight fit in?

Even though browsers like Chrome release and update very often, not every company is going to upgrade all their browsers every week or even twice a year. Some enterprises will be on Firefox 3.6 for a while longer, or (hopefully not) IE6. Browser plugins like Silverlight and Flash can add new functionality faster. They are called plugins for a reason. They plug-in and add something.

HTML5 isn't 100% done, but today it's already a collection of things that can be used now. Your web apps should use techniques like progressive enhancement to detect available features. As newer browsers include useful features like geolocation and video that used to require plugins, then older plugins become unnecessary. Plugins rev and add new more advanced features like DVR-like video and hardware-accelerated 3D. Those features will eventually find their way into browsers in a few years and the cycle will continue.

Silverlight 5 will become Silverlight 6, Flash 10 will become Flash 11 and HTML5 will become HTML6. Each new spec will add new features, innovating, and pushing the others forward . The web will be pushed forward by all these and more.

There's no question that advanced media apps, 3d, DVR video scenarios shine on Silverlight. Silverlight CAN do some things that HTML5 can't.

If you are creating an application for the web that needs images, links and text boxes, some animations and interactivity, there's no reason you shouldn't use HTML. With new JavaScript libraries like Modernizr, jQuery along with Polyfills, you can even use many HTML5 features and still have good functionality on ALL major browsers - not just the most recent generation.

If your application is internal or a line of business app and is what I call a basic "text boxes over data" application, you have a few choices. You can certainly use Silverlight and its databinding features, or you can use JavaScript libraries like KnockoutJS and write it in HTML. It depends on where you and your company's core skillset lies. Both are good choices and both aren't going anywhere.

If Silverlight has a feature that you need that isn't a part of mainstream browsers, consider a web app that is both HTML/JavaScript and Silverlight. I'm consistently surprised that people feel the need to make Silverlight apps that fill the entire browser but consist of mostly text, images, links, etc. Don't try to make Silverlight act like it's HTML. It's not. Plugins are complimentary to the web, they are not the web. Use them in complementary ways to make the best experiences you can.

If you need basic video like YouTube, use <video> tags if your browser supports the codecs you need, and a plugin if not. However, if you need live video, adaptive smooth streaming, DVR functionality, H.264, or other features that aren't part of HTML5, then again, use a plugin.

Also consider your own productivity and happiness and the tools you want to use. Think about your users, your dev team and their overall happiness.

Apps in C and C++ have their place in games and uniquely native scenarios. Apps using managed languages and XAML balance easy development and deployment flexibility. Apps in HTML and JavaScript work everywhere on the web. Perhaps one day we'll be able to easily mix and match these styles in the best of all worlds.

Until then, it's simple. Use HTML when it makes sense to your solution. Use a plugin when it provides unique functionality. Rinse, repeat. Apply common sense, and a little hair gel.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web

NuGet Package of the Week #3 - PhoneyTools for Windows Phone 7

March 21, '11 Comments [0] Posted in NuGet | NuGetPOW | Silverlight | WinPhone
Sponsored By

image Have you implemented the NuGet Action Plan? Get on it, it'll take only 5 minutes: NuGet Action Plan - Upgrade to 1.1, Setup Automatic Updates, Get NuGet Package Explorer.

The Backstory: I was thinking since the NuGet .NET package management site is starting to fill up that I should start looking for gems (no pun intended) in there. You know, really useful stuff that folks might otherwise not find. I'll look for mostly open source projects, ones I think are really useful. I'll look at how they built their NuGet packages, if there's anything interesting about the way the designed the out of the box experience (and anything they could do to make it better) as well as what the package itself does.

PhoneyTools includes new controls, classes and techniques for Windows Phone 7

I've heard that since NuGet is bundled with ASP.NET MVC that some folks think it's just for Web Development. This weeks package is one for Windows Phone 7. You can make packages for pretty much whatever you like. Looks like there are already 26 libraries that are tagged with "phone" on the NuGet site.

These tools are by Shawn Wildermuth and include a bunch of useful classes and controls that make Windows Phone application creation easier.

image

I'll fire up Visual Studio with Windows Phone Tools that I downloaded from http://create.msdn.com. (See how clean my Visual Studio looks? Yours can be tidy as well.)

My Totally Nothing Windows Phone 7 App

You can see that I created a totally basic do-nothing Windows Phone 7 application and that the NuGet Package Manager Console is docked at the bottom.

I type:

PM> Install-Package PhoneyTools
'SilverlightToolkitWP (≥ 4.2011.2.1)' not installed. Attempting to retrieve dependency from source...
Done.
Successfully installed 'SilverlightToolkitWP 4.2011.2.1'.
Successfully installed 'PhoneyTools 0.5'.
Successfully added 'SilverlightToolkitWP 4.2011.2.1' to WindowsPhoneApplication2.
Successfully added 'PhoneyTools 0.5' to WindowsPhoneApplication2.

Looks like PhoneyTools brought in the SilverlightToolkitWP as a dependency. If I want to poke around, I can double click on the NuPkg (which is associated with the NuGet Package Explorer you can get here with ClickOnce) and see what's going on.

NuGet Package Explorer - PhoneyTools.0.5 (11)

Looks like he's got his project's assembly as well as an install.ps1 and uninstall.ps1 in the tools folder. What's in there?

References to assemblies are added by convention automatically

The install.ps1 and uninstall.ps1 run automatically when you, ahem, install and uninstall. He's got a check for the version of NuGet in there (that looks like it was copy/pasted from one of my packages) as well as a manual stop to add a reference. That extra line for adding References is not needed. I know Shawn so I'm sure he'll be fine with me using this as a teaching moment as it's not 100% obvious how this new stuff works.

param($installPath, $toolsPath, $package, $project) 

if ($host.Version.Major -eq 1 -and $host.Version.Minor -lt 1)
{
"NOTICE: This package only works with NuGet 1.1 or above. Please update your NuGet install at http://nuget.codeplex.com. Sorry, but you're now in a weird state. Please 'uninstall-package PhoneyTools' now."
}
else
{
$project.Object.References.Add("AgiliTrain.PhoneyTools"); #don't need this
}

It might seem intuitive to add the reference manually, but assemblies that are in the lib folder will actually be added and removed automatically as references just because they are in the lib folder! There's no need to do it manually.

In fact, you can have one package that includes versions of assemblies for many different Framework Versions. From the NuGet documentation on Supporting Multiple .NET Framework Versions and Profiles:

\lib
\MyAssembly.dll
\MyAssembly.Core.dll
\Net40
\MyAssembly.dll

In projects that target the .NET Framework 2.0 and the .NET Framework 3.5, NuGet copies both MyAssembly.dll and MyAssembly.Core.dll. But in projects that target the .NET Framework 4, only MyAssembly.dll from the Net40 folder will be copied. If you want MyAssembly.Core.dll to be installed in a project that targets the .NET Framework 4, you must include it in the Net40 folder

For Silverlight, he should do:

lib    
\sl4
\AgiliTrain.PhoneyTools.dll

And when NuGet 1.2, he can use \sl4-wp. That way someone can release a package that includes a different payload for Silverlight 4 vs. Silverlight on the Windows Phone 7.

Playing with PhoneyTools

Now that I've got the PhoneyTools installed, what can I do? According to the PhoneyTools CodePlex project, this is a project that contains several classes and controls for use with Windows Phone 7 applications. There are plans for:

And the word is that he's targeting Mix for the first release. This release is in beta. There's nice simple utility stuff like automatically fading "toast" style messages...

FadingMessage.Show("Doing something important...");

That do what you'd expect (you can make them look like whatever)...

image

To more sophisticated controls like an alternative SelectSwitch:

SelectSwitch

And a SimpleLongListSelector Control that handles a lot of boring work for you and makes creating a giant long list with categories easy so that this XAML:

<my:SimpleLongListSelector x:Name="longList">
<my:SimpleLongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding ImageUrl}"
Height="75" />
<TextBlock Style="{StaticResource PhoneTextNormalStyle}"
Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</my:SimpleLongListSelector.ItemTemplate>
</my:SimpleLongListSelector>

Along with this LINQ query against a data source:

// For Complex Object and ItemTemplate
var qry = from g in games
orderby g.Genre, g.Name
group g by g.Genre into genre
select genre;

longList.SetGroupingItemsSource<Game>(qry.ToList());

Gives you a nice clean result, and you can click on the category headers to quickly jump to another category.

ItemTemplate

There's lots more, and remember that we noticed the Silverlight Toolkit for Windows Phone "'SilverlightToolkitWP" was a NuGet package as well? There's lot of info on that Toolkit at Tim Heuer's blog as it contains useful controls and classes as well. Between Phoney and the Silverlight Toolkit I think I'm ready to write my app.

Please continue to insist on NuGet packages for useful stuff. Put pressure on the groups you work with and convince them this is a useful thing.

Also, please join me at TechEd 2011 in Atlanta as I present DEV338 NuGet: Microsoft .NET Package Management for the Enterprise!

I'm glad folks are using NuGet for more than just Web Apps. I hope you do to, Dear Reader.

Related Links

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web

Hanselminutes Podcast 252 - ReactiveUI extensions to the Reactive Framework (Rx) with Paul Betts

February 8, '11 Comments [3] Posted in Learning .NET | Open Source | Podcast | Silverlight
Sponsored By

image "Scott sits down with Paul Betts and talks about extending the Reactive Framework. We currently manage our UI events as they are pushed to us. How does programming - and asynchronous programming - change if we change the way UI events are consumed? The Rx Reactive Framework extends .NET, and Paul's extended that with his Open Source Reactive UI framework. Let's see if Paul can teach Scott a new trick."

Download: MP3 Full Show

Links from the Show

NOTE: If you want to download our complete archives as a feed - that's all 252 shows, subscribe to the Complete MP3 Feed here.

Also, please do take a moment and review the show on iTunes.

Subscribe: Subscribe to Hanselminutes or Subscribe to my Podcast in iTunes or Zune

Do also remember the complete archives are always up and they have PDF Transcripts, a little known feature that show up a few weeks after each show.

Telerik is our sponsor for this show.

Building quality software is never easy. It requires skills and imagination. We cannot promise to improve your skills, but when it comes to User Interface and developer tools, we can provide the building blocks to take your application a step closer to your imagination. Explore the leading UI suites for ASP.NET AJAX,MVC,Silverlight,Windows Forms and WPF. Enjoy developer tools like .NET Reporting, ORM, Automated Testing Tools, Agile Project Management Tools, and Content Management Solution. And now you can increase your productivity with JustCode, Telerik’s new productivity tool for code analysis and refactoring. Visit www.telerik.com.

As I've said before this show comes to you with the audio expertise and stewardship of Carl Franklin. The name comes from Travis Illig, but the goal of the show is simple. Avoid wasting the listener's time. (and make the commute less boring)

Enjoy. Who knows what'll happen in the next show?

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web

Hanselminutes Podcast 241 - The MVVM Pattern with Laurent Bugnion

November 19, '10 Comments [2] Posted in Open Source | Podcast | Silverlight | WPF
Sponsored By

Scott talks to Laurent Bugnion about the often misunderstood Model-View-ViewModel (MVVM) pattern. What's the different between this pattern and MVC? Can I use this pattern for Silverlight, WPF and Windows Phone 7, and what Open Source projects can support this pattern?

Links from the Show

NOTE: If you want to download our complete archives as a feed - that's all 241 shows, subscribe to the Complete MP3 Feed here.

Also, please do take a moment and review the show on iTunes.

Subscribe: Subscribe to Hanselminutes Subscribe to my Podcast in iTunes

Download: MP3 Full Show

Do also remember the complete archives are always up and they have PDF Transcripts, a little known feature that show up a few weeks after each show.

Telerik is our sponsor for this show.

Building quality software is never easy. It requires skills and imagination. We cannot promise to improve your skills, but when it comes to User Interface and developer tools, we can provide the building blocks to take your application a step closer to your imagination. Explore the leading UI suites for ASP.NET AJAX,MVC,Silverlight,Windows Forms and WPF. Enjoy developer tools like .NET Reporting, ORM, Automated Testing Tools, Agile Project Management Tools, and Content Management Solution. And now you can increase your productivity with JustCode, Telerik’s new productivity tool for code analysis and refactoring. Visit www.telerik.com.

As I've said before this show comes to you with the audio expertise and stewardship of Carl Franklin. The name comes from Travis Illig, but the goal of the show is simple. Avoid wasting the listener's time. (and make the commute less boring)

Enjoy. Who knows what'll happen in the next show?

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web

Streaming Live or On-Demand Video from IIS7 to iOS Devices (iPhone/iPad) and Silverlight Clients

November 9, '10 Comments [20] Posted in IIS | Silverlight
Sponsored By

DSC_0001 Earlier this year I posted on Installing and Setting Up and Encoding for IIS 7 Smooth Streaming and Silverlight. The general idea was to show folks that it's actually pretty easy to setup Smooth Streaming for Silverlight. Of course, not everyone uses Silverlight, and lots of folks (myself included) have iPhones and iPads.

I've long been singing the praises of IIS7. If you're on IIS6, get off it. IIS7 is the #1 reason to get on Windows Server 2008R2, IMHO. Mostly because of the crapload of awesome (CoA) that keeps coming out of the IIS team. Many of these modules aren't on the radar of the average developer. I think that Web Platform Installer helps some, but still, I'd like to get the word about some of this free stuff like the Web Farm Framework, the all new FTP 7.5, Bit Rate Throttling, and my favorite, Application Request Routing (which I use in my robot).

Anyway, last week IIS released IIS Media Services 4.0 that you can download now. It's free if you have IIS on your machine. They also released a number of things this summer like the Transform Manager 1.0 Alpha.

Getting existing Video from IIS7 to iOS devices elegantly

Why do I care? Well, I'm sitting here looking at an IPhone 3G, an iPhone 4 and an iPad on my desk. Many of your customers have these devices. How do you get video to them, cleanly, quickly, easily and from a single source file?

Turns out there's features in IIS7 and Media Services that target iOS directly. Yes, it's true. Cats and dogs, living together, mass hysteria. Get your snowballs out, hell has frozen over and the slopes look sweet.

On-Demand Encoded Video for iOS and Silverlight

First, I've got this file on my hard drive called ScottGuHDTest1. It's a picture in picture (PIP) test that ScottGu and I did a while ago while looking into new ways to deliver educational video content. Consider this my stock video for this example.

Windows Media Player - ScottGuTest Video Frame

If I want to deliver this content to the web over Silverlight Adaptive Smooth Streaming PLUS I want it to look great on an iPhone or iPad regardless of bandwidth, and I want it all done automatically, I'll need these things.

imageFor existing videos or videos you're making on a regular basis, the idea is that you'll just drop them in a folder and a task will automatically kick off. You have total control over everything, to be clear, but for the out of the box example, I'm going to drop my ScottGu WMV into a folder and two things will pop out:

  • A folder with HTML page with a Silverlight media player that supports Smooth Streaming. The ScottGu video will be encoded in various bit rates and be all set for adaptive Smooth Streaming
  • A folder with MPEG-2 TS format files with .m3u8 manifests that conform to the Apple Live Streaming Protocol.

Here's what you do. Once you've installed the Transform Manager, it'll show up in your IIS Manager as a node. You'll setup account credentials (an account with some power, as it'll need to run stuff and copy files into IIS folders. I used my own. Naughty.)

Now, go to Job Templates and notice there are a bunch of built-in templates. You can create whatever you want to encode video in whatever way makes you happy.

I double-clicked on them and checked all the paths and stuff. You'll need to change the templatePath property to decide on your input and output directories.

 Edit Job Template

I have my input folder here, in c:\inetpub\media\Transform Manager, and there's sub-folders beneath that as seen in this screenshot. Notice that tasks can do multiple things, so mine takes an input file and "fans out" into multiple tasks.

 Transform Manager

If I drop my ScottGu file in, a task immediately starts up (it's watching the folder) and I can see the progress from the IIS manager. Here it is in the middle of encoding.

Internet Information Services (IIS) Manager

The Transforms Manager has lots of interesting parameters that you can set, basically using simple template expansion. It'll make a folder with the Date and Time and a Unique Number, but again, you control all this.

Now I have two folders, one for the Silverlight format...

20101108231223_22BCFBBAA9864545A8864DEDC41E6A87

...and one for the Apple format:

 TS

I'll add a HTML page for an iOS device to hit. NOTE: You'll be pointing the iPhone/iPad to this m3u8.ism file and it'll decide what streams to watch:

<html>
<head>
<title>iPhone page</title>
</head>
<body>
<h1>Encoded stream</h1>
<video width="640"
height="480"
src="ScottGu720pTest1-m3u8-aapl.ism/manifest(format=m3u8-aapl).m3u8"
poster="ScottGuSplashPage.png"
autoplay="true"
controls="true" >Live</video>
</body>
</html>

I've also added splashscreen "poster" that's just a PNG frame from the video. Here's a photograph of my iPhone 3G, iPad and iPhone 4 with the video...

DSC_0001

...and here it is in Silverlight. Note the chart showing the smooth streaming bandwidth adjusting.

ScottGu720pTest1 - Windows Internet Explorer

Cool, that was easy. How about LIVE video streaming to both iPhone/iPad clients and Web Browsers?

Live Streaming Video from IIS7 to iOS devices and Silverlight

Doing LIVE Streaming video is pretty easy also. You start with IIS Media Services 4 and Expression Encoder 4 Pro. The encoder will dynamically transcode the incoming video into the right format for outputting to Apple Devices as well as Silverlight clients. It'll also archive the video for later.

Start by selecting Live Smooth Streaming, and create a Publishing Point.

image

Make sure to select "Enable Output to Apple Mobile Digital Devices" and also Enable iOS 3.0 Compatibility for older phones.

 Add Publishing Point

In the Encoder I can also add multiple live sources (multiple cameras, USB, Firewire, whatever) as well as recorded sources (we'll be right back, advertisements, whatever) and then cue them up appropriately.

Fire up Encoder 4 and select Live Broadcasting Project.

Load a new project

Add a Live Source (I used my Webcam, although Firewire and other video sources work great), then select the H.264 Encoding you want. I chose "H.264 IIS Smooth Streaming iPad Wifi"

image

Under Output, enter in your Publishing Point. This is a file on your IIS server. Mine was http://hexpower7/livestreaming/magicalgoodness.isml because that's the folder I started the Publishing Point in.

Click Cue and cue your live source, then Start the broadcasting.

Create an HTML page like before, this time using the ISML file.

<html>
<head>
<title>iPhone Live Baby!</title>
</head>
<body>
<h1>Live Stream</h1>

<video width="640"
height="360"
src="magicalGoodness.isml/manifest(format=m3u8-aapl).m3u8"
autoplay="true"
controls="true" >Live</video>
</body>
</html>

That's it! Here's a shot of me Encoding while streaming to an iPhone 4.

Me streaming LIVE locally to myself on my iPhone

Plus, just for fun (and to make a point) I can take the Silverlight Player from the first step at the beginning of the blog post (or make my own with the Silverlight Media Framework 2.2) and just point its source to my live streaming endpoint: "<MediaSource>MagicalGoodness.isml%5CManifest</MediaSource>" and I'm using the same live video feed to serve video to my Silverlight client, my iPhone and iPad. Also, the new Silverlight Media Framework 2.2 supports Windows Phone 7 as well. ;)

 ScottGu720pTest1 - Windows Internet Explorer (2)

And, it's not just a LIVE stream, but it's a live stream with DVR support, so folks can pause, back up, etc and it's all being archived to my server.

image

All this about a half an hour of setup. I was pretty impressed at how easy it was and with a little planning, I think I could this up for a local User Group with multiple lives streams and broad client support with some hardware a few hours. You might think about trying it for your local event as a practice, Dear Reader.

Related Links

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web
Page 1 of 10 in the Silverlight category Next Page

Disclaimer: The opinions expressed herein are my own personal opinions and do not represent my employer's view in any way.