Microsoft ReMixSEA07 (part 3)

I decided to join the developer track.

We talked about silverlight.js (contains all the “get silverlight” button) It’s only 16KB!!

He talks about instantiation (see pix above). It makes no difference if the backend / server is running JEE, since the instantiation is all handled by JavaScripts. The API expects fairly minimal info (e.g. width, height, version, and event handles). It can be generated by tools, or just coded by hand, as expected..

The rest of the actual presentation code is in the new language by Microsoft: XAML. You will need tools (e.g. Expressions) to generate them, otherwise you’ll be coding till you die due to the verbosity. Tweaking XAML code, which stands for eXtensible Application Markup Language, is still necessary if you want the details. My favourite application: British Museum’s Page Turning Application (actually it is still in flash, but kononnya they made a silverlight one, which is better). As the story goes, XAML was invented to bridge the crayon world with developer world. Now Expression Blend / Expression Designer generated XAML from designer’s activity that the developer can take over to tie the knots.

(I’m skipping the samples part, as lots of code was shown and not worth typing them down. Try the Internet for similar examples)

Some basic vocabulary: Canvas, Brushes (fill, stroke), Shapes (rec, ellipse), Textblocks, Images. Hierarchical structure. For the canvas, xmlns parameter is for basic syntax verification, xmlns:x is for extended vocabulary. Apart from the usual #123456 6-digit colour, there’s also an 8-digit colour (e.g. #FFCC9900) that gives the alpha channel (i.e. transparency).

LinearGradientBrush: Can use this to specify the start point and end points to apply the gradient (called gradient stops: it is a number between 0 and 1 for both x and y). The number can go beyond 0 and 1 for special effect (as if the gradient ends outside the object). This way of specifying gradients is important for the designers who needs the design to be perfect (e.g. brightest exactly at the mid point). A similar brush is the RadialGradientBrush for circular gradient. Both brushes can have many gradient stops.

ImageBrush is used to paint a shape with an Image (think rendering). Its default security model allows you to go out of your current domain to pull images (so you can cross domain to pull images) -> this might be one more incentive for content website owners to start thinking DRM (digital rights management, but will only work properly on the Windows stack).

Silverlight still haven’t got double byte support. We’ll have to wait for version 1.1 (sigh… when can a global company like MS start developing Using Double Byte Fonts from the ground up?)

RenderTransform: Transformation can be applied to any node in the XAML hierarchy. One can stretch, skew, rotate, translate, or provide a transformation matrix! Whoa! Linear Algebra is actually useful in real life! 🙂 One can then group transformations together.

MediaElement: Integrating media is so important as it has generated the most buzz for silverlight. However, it only support WMV at the moment 🙁 The war of video and other media formats will continue for sometime. Nevertheless, stuff like buffering, feedback to user, controls to play / pause is already there in the platform, saving lots of time in making your own media player.

The event handling model is the same with the .NET model. For example, you can fire a script after loading is done. The programming model is based on DOM, and can be retrieved using a simple findName method (think getElementByID). As it’s uniquely constrained by ‘x:Name’, findName works on that as the key instead of the typical ID (wow – now we got 2 keys in our DOM…) Some examples mentioned:

1. The cat food recall in US created a huge buzz online, companies scramble to update their websites claiming that they are not being recalled.
2. Wayne Rooney just scored a goal.

All these require quick updates to a website, but with the graphical elements in the way, tranditional HTML updates will take a long time (while people draw the web artifacts). Silverlight will allow the site to be updated programmatically with XAML, which is a much easier and a much open way to deal with dynamic graphical pieces.

Video: One now gets full control of the video content (e.g. start playing from 15 second etc.) DownloadProgressChanged, BufferingProcessChanged, and video.downloadProgress is sufficient to build your own mini buffering toolbar.

Sound: You can specify volume, balance, and muted or not. Similarly, their values are between 0 and 1. Interestingly, 0 is the left ear, 1 is right ear…

There is still no rich data binding in the current release. The official support for silverlight is IE and Firefox on Windows, and Firefox and Safari on the Mac. No form of Linux is supported or even mentioned (boo…..). That’s understandable, but this is even worse: Silverlight doesn’t support CSS directly – you just can’t use CSS to style. Is it because CSS is just a subset of XAML? Why can’t the two language syntax be compatible with each other? Internationalization is also not ready (boo…)

HTTP Progressive Download (not really streaming) is supported in v1.0. This is followed by a true streaming implementation in version 1.1 using MS’s favourittie MMS protocol. It’s hard to compare with ActionScript (a flash scripting language) because the design paradigm of both these languages are different from one another. It’s interesting to note that their performance is almost equivalent (and this comparison is done when Silverlight was still called WPF/E).

Overall: Start with Silverlight instead of WPF – this will shield yourself against future changes.

Some personal reflection: I’ve been doing quite a bit of “product evaluation” for a year now, starting from not really knowing what to look for at first, but later gravitating towards tracking feature maturity and finding “selling points” of the products. Here’s a point I found just by using eye-power (i.e. seeing without playing): it encourages mediocrity. When you make it “easy” to design, you’re opening the flood gates to really really bad designs. Remember the 90s? I predict it to be exactly like when the web just got started where one encounter numerous blinking titles and rotating GIFs. But now it will be at a much grander scale! Can you imagine? HUGE rotating earths with o-biang coloured and badly drawn shapes on corporate web pages…

At the same time, there is also going to be a tendency for people to ignore bandwidth considerations moving forward, since we’re dealing with bandwidth requirements that’s a magnitude larger than everything that we’ve been trained so far. For example, how do we make sure that only the part of the clip that matters gets loaded, only images that are required gets loaded, and so on and so forth.

Just compare this with what MS did last decade – they went around telling everybody that ASP(VBscript) is the easiest language and environment in the world to build websites in and invited a huge crowd of “Morts” to write crappy VBscript code that still dominates much of the business world today. With Silverlight and all these dragging and dropping, I’d say, welcome to a new world of crap design. Brace yourself, because this time you actually get to see and experience it (unlike the past where it is just the developers who have to shiver when taking over your code).

Lunch!