Making do with Windows Phone, loving Metro

Every now and again you should go out of your comfort zone to get a new perspective on things. Or so they say. I love my comfort zone, it took me 43 years to build the damned thing after all, so please leave me be, will you?
But things break and in this particular case the screen of my trusty old Samsung Galaxy S2 went dark, literally. I brought the phone in for repairs and grabbed the only test-device left at work as a temporary replacement. It was a Samsung Omnia 7 with Windows Phone 7. Now look at this little droid-boy getting pushed out of his comfort zone!
I’ve been using it for 5 days now, so why not make a small list of what sucks and what’s great? Here goes:
What sucks:

  • The browser. It’s not I can’t live without Firefox Mobile, but boy does Mobile IE7 suck.
  • No Internet connection sharing (not over USB, not over Bluetooth, not over WiFi)
  • The fact that the phone doesn’t present itself as a USB storage device when I connect it over USB with my Ubuntu netbook
  • The lack of an SD card slot
  • I can’t login with my Live ID (my ancient Hotmail address) on my phone (but it does work in Zune), which means I can’t install applications from the Marketplace (I’m asked to call support! Seriously?)
  • The fact that after installing Zune on my work PC and then waiting until I got home because Zune doesn’t do proxies, I still wasn’t able to upgrade to Windows Phone 7.5 (which does have Internet connection sharing and a more decent browser)
  • There’s no way to reliably fetch information from the Exchange servers at work. Every once in a while mail gets downloaded, but in general there’s error code 8501001D ruining my Exchange experience

What’s great? Just one bullet point actually;

  • The UI!

Really, despite my grievances about how poorly the device integrates with the outside world, my general feeling about Windows Phone is positive, and that is because Metro really is that great! The screens are sober, with lots of space and a prominent place for content (text & typography). Applications scroll horizontally to display different views and it’s the typography that makes this pretty discoverable. The graphics effects and sound add to the great responsive “feel” of the UI. And tiles are a radical break form the icon-based approach that is typical of iOS (and Android, classic Mac OS, Windows 3.11 and …), you could compare them to widgets (as seen on Android), but without the anarchy and clutter.
So yeah, really, I Metro! I hope Google (Android), Mozilla (b2g) and Ubuntu (Unity) take clues from what is, in my view, a pretty radical break in graphical user interface design, because I would love the computing environments in my comfort zone to be more about content and less about chrome as well!

As found on the web (March 21st)

generic (feed #49)
generic (feed #49)
generic (feed #49)
blog (feed #46)
blog (feed #46)
frank published Het land is in rouw.
generic (feed #49)
generic (feed #49)
generic (feed #49)
frank posted GELUKKIG ZIJN ..
generic (feed #49)
generic (feed #49)
blog (feed #46)
frank published Going against the reflow.

Going against the reflow

You can do great things in JavaScript; accessing the DOM and adding, changing or removing nodes as you please. It is exactly that technology that WP YouTube Lyte is based upon; the PHP-part writes out an almost empty div’s with className “lyte” and with as id the YouTube ID, which the JS-part finds after the main document has loaded to render the “LYTE player”. Great for performance, so I was pretty surprised when DerTux, one of WP YouTube Lyte users wrote;

BTW, Google Page Speed dislikes Lyte:
“The following JavaScript call stack (executed 4 times) caused reflows that took 52 milliseconds: @wp-content/plugins/wp-youtube-lyte/lyte/lyte-min.:1:0

Although 52ms for a page with 3 “LYTE players” is minimal when compared to loading the same page with the full embedded YouTube player, the above statement bugged me enough to search the web for information about reflows and how to prevent them. Some of the more interesting articles:

And this video by Paul Irish does a great job explaining reflows:

HTML5, CSS3, and DOM Performance

Based on these pointers I started reworking lyte.js while testing on Google’s Page Speed Online (as far as I can tell the only tool that can detect reflows and then only as an experimental feature) to minimize reflows. I ended up:
  • adding the pL div, which contains the LYTE player UI (play-button, controls & YouTube thumbnail), only after all styles have been applied
  • adding the tC div, which contains the title, only after the tT div (with the title as received in the YouTUbe jsonp-call) has been added to it
  • replaced el.clientWidth (and el.clientHeight) with el.style.width.match(/\d+/g)[0]
  • some widths and heights did not have a unit specified in the dynamically generated CSS and this sloppy coding apparently also (indirectly) caused reflow

WP YouTube Lyte 1.1.1 will get pushed out in a couple of days (Thursday, probably) and will ship with these performance optimizations (and a fix for a regression which causes some styles not to be applied any more).

“Het land is in rouw”

Ik probeerde me de afgelopen dagen bewust af te sluiten van de niet aflatende stroom aan informatie over het verschrikkelijke busongeval in Zwitserland. Dat is niet makkelijk, want met elk toevallig meegepikt beeldfragment voel ik me opnieuw meegezogen in een emotionele draaikolk van onontkoombare betrokkenheid.
Het land is in rouw, maar moet dat? Brengen de media nieuws of emotie? In welke verhouding? Voor wie? Waarom? Niet voor de slachtoffers, niet voor de familie.
Tot daar de ratio. Maar een kind verliezen …


(Radiohead – Give up the Ghost)

WP YouTube Lyte: what is in 1.1.0 for you

Nope, 1.0.0 wasn’t WP YouTube Lytes final destination, the train has left that station to arrive at version 1.1.0 yesterday. Main new features include:

I’ll leave it to Avi Buffalo to show you how the new UI looks like:


And I changed the short description (which features prominently on the wordpress.org plugin page) to better match main features:

High performance YouTube video, playlist and audio-only embeds which don’t slow down your blog and offer optimal accessibility.

Next stop: 1.2.0. Any feature requests?

As found on the web (March 14th)

blog (feed #46)
generic (feed #49)
blog (feed #46)
frank published CDN to the Max.
youtube (feed #51)
generic (feed #49)
generic (feed #49)

CDN to the Max

It was time to put my money where my mouth is, or at least to give the use of a CDN a try. Based on previous tests MaxCDN seemed like a decent, dirt-cheap solution, so that’s what the js, css & images for this blog are served from now.
Setting this up was very easy:

  1. log into MaxCDN and set up a pull zone on static-cdn.blog.futtta.be with origin blog.futtta.be
  2. create static-cdn.blog.futtta.be in the web interface of my DNS-provider (as a CNAME to the domain-name provided)
  3. configure WP Super Cache to use static-cdn.blog.futtta.be instead of the non-cdn static.blog.futtta.be)

The speed difference can be huge, especially when routing to my origin VPS-server in Germany isn’t great. I’m sure my 2 overseas users and Google will approve!
Bandwidth-wise, with 10MB/day, I seem to be far from the 1TB/year I’m allowed, so if you’d like me to setup a (temporary) pull zone for your blog so you can check out if this would work for you then just drop me a line.

Bad Karma Blocks WP YouTube Lyte

On a blog that uses WP YouTube Lyte which I happened to stumble across, the following warning was displayed:

Hey! If you’re browsing in Firefox, there’s a very good chance that you won’t see youtube / video embeds.

As I really don’t like bugs but couldn’t reproduce any issue myself, I contacted the blog’s owner to find out what was happening. The description of the problem was pretty confusing:

The still shot/first frame of the video is there with the play icon, so things look hopeful, but when you click on the play icon the entire video disappears from the page. Page structure / layout does not change, but you are left staring at a blank white box where the embed should be.

A white div of death, really … Anyway, to cut a long story short, the misbehavior was caused by “Karma Blocker“. This Firefox addon “blocks resources based on their karma”, using a ruleset that scores behavior to blocks banners, trackers and also WP YouTube Lyte (or rather, the YouTube iFrame). Apparently the combination of the bad karma of JavaScript and the iFrame triggered the blocking mechanism.
I couldn’t code around Karma Blocker and chances are small the default configuration will give YouTube iFrames better karma, but the next version of WP YouTube Lyte (1.1.0, to be available soon) will display a simple message kindly letting users know they might want to adapt their Karma Blocker’s weightings.
But why is karma punishing me?

As found on the web (March 7th)

generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #49)