Coding for the New Year

Just a quickie before diving into 2011;

And this is how I feel about 2011:

Jon Hopkins - Light Through The Veins (Full 9 Minute HQ Version)

Have a great New Year!

Venus doesn’t love noscript

Damn, Venus doesn’t love noscript!
You’ve got no clue what I’m rambling about, do you? Well, allow me to explain;

So now you know the context, let me reiterate; Venus doesn’t treat noscript the way it should! It not only strips out javascript as it should (are you listening tt-rss?) but it replaces noscript-tags and all HTML inside with escaped HTML (with HTML-entities actually). And that, my beloved ones, means that the HTML that WP YouTube Lyte generates, doesn’t work properly on Venus-based planets.
So I started looking at the Venus source and mailed with Planet Grep’s Wouter Verhelst to solve this issue. At first sight the solution seemed pretty straightforward; Venus shouldn’t ‘escape’ noscript but should instead just strip the opening and closing noscript-tag. Wouter installed a small sed-filter I wrote and added noscript to the whitelist of Venus’s sanitizer (which is based on Universal Feed Parser) and … it did not work.
The problem apperantly is with another sanitizing component in Venus; html5lib. Sam Ruby, the developer of Venus, wrote on the mailinglist;

There are multiple sanitization passes involved here. […] The html5parser seems to think that noscript is to be parsed as text only, which would result in the behavior that you describe.  Looking at the current HTML5 spec, it appears that this does not match the expected behavior — so perhaps that changed too.

So I started looking at html5lib and … well, I’m stuck, html5lib is a pretty complex beast for a smalltime non-developer to dive into. So earlier today I turned to the html5lib discussion list to ask how sanitization can be configured not to escape noscript, let’s hope someone will enlighten me. Because until then those poor Planet Greppers won’t be able to see (a thumbnail of) Al Jarreau’s great version of Take Five way back in 1976:

Al Jarreau 1976 -Take Five

The bulleted WP YouTube Lyte bulletin

It’s been a while since my last “state of WP YouTube Lyte” post, so here are the most important tidbits since;

Feedback is welcome; see info in the FAQ for bug reports/ feature requests and feel free to rate and/or report on compatibility on wordpress.org.
And as befits a post about WP YouTube Lyte on a Friday afternoon, here’s a little YouTube from Gold Panda you can start your weekend with;

Snow And Taxis

The state of WP YouTube Lyte (now with fresh Pomplamoose)

Although it has been a few months since I last wrote about my baby WordPress plugin, time did not stand still between version 0.3.0 and 0.5.2; the player size can now be changed in the options-screen, I’ve replaced my newTube html5-hack with Google’s official (yet experimental) new html5-compatible embed code and I started migrating the CSS from the mess that had become the JavaScript-file. And I almost forgot what may be the most important change; I started searching for blogs that use WP-YouTube-Lyte to see how it behaves in the wild. Some of the bugs I discovered that way;

But with all those changes you might start to wonder if WP-YouTube-Lyte still reduces download size & rendering time substantially, no? So I ran a couple of new tests for this page on my blog (it has 3 embedded YouTube’s) on webpagetest.org (settings: 5 runs on IE7 via Amsterdam, excluding requests to stats.wordpress.com). The difference is … well, judge for yourself (or see below the tables for the summary)
With normal Flash-based embeds (full results here):

Document CompleteFully Loaded
Load TimeFirst ByteStart RenderTimeRequestsBytes InTimeRequestsBytes In
First View1.850s0.634s1.330s1.850s15343 KB5.350s22524 KB
Repeat View1.142s0.346s0.497s1.142s517 KB2.455s517 KB

And with WP YouTube Lyte (full results here):

Document CompleteFully Loaded
Load TimeFirst ByteStart RenderTimeRequestsBytes InTimeRequestsBytes In
First View1.201s0.355s0.974s1.201s1055 KB2.065s20103 KB
Repeat View0.605s0.352s0.473s0.605s212 KB1.447s514 KB

Did you see that? Less requests, less data and faster rendering for first and repeat views. Hurray for WP-YouTube-Lyte! But enough with that ego-tripping already, I’ve got an Opera-bug to look into! Or wait, I’ll watch this great new Pomplamoose+Ben Folds+Nick Hornby  videosong first:

Ben Folds, Nick Hornby, & Pomplamoose VideoSong!!!!

Over vanalles en nog wat

Een paar kleine ditjes en datjes, het moet hier niet altijd proper uitgewerkt zijn:

  • Dropbox is tof, maar niet perfect: op Android een file aan je Dropbox toevoegen doet pijn aan het gat en de Windows-versie wilt ook thuis de proxy van het werk gebruiken (auto-detect proxy werkt niet).
  • WP-YouTube-Lyte zit aan versie 0.4.1, de afmetingen van de player zijn nu configureerbaar. Het ding is al bijna 2300 keer gedownload (cumulatief voor alle versies) en op basis van de downloadcijfers na een release gok ik dat het op een site of 300 geïnstalleerd staat.
  • Van cijfers gesproken, afgelopen maandag met deze blog de 100.000 pageviews gepasseerd, dank daarvoor anonieme passant.
  • Ik draai al een week ofzo op Firefox 4 beta1 (zowel op Windows als op Ubuntu), lekker stabiel voor een eerste beta. Tabs on top is inderdaad logisch en html5 video (met WebM) op YouTube lukt nu ook, maar aan de nieuwe theme en add-on manager is nog “wat” werk. Beta2 zou eerstdaags uitkomen, maar het is nog wachten op de grote javascript snelheidswinst (waarmee FF terug dichter bij de concurrentie zou moeten komen).

En nog wat: als het gesprek even stilvalt, vragen mensen niet meer naar het weer, maar naar je mening over de slaagkansen van droomkoppel De Wever & Di Rupo. Ik zeg dan dat ze moeten slagen en dat ze dat zelf ook weten want dat het er anders niet goed uitziet voor onze portemonnee en dan verwijs ik naar een interessant artikel dat ik daarover op Apache las en het gesprek valt weer stil.

Embedding HTML5 YouTube video with WP YouTube Lyte

I re-implemented newTube.js, an earlier experiment to embed HTML5 YouTube video, into my WP YouTube Lyte plugin. This means that WP YouTube Lyte (for easy lite YouTube embeds, reducing download size & rendering time substantially) can now also use the HTML5-based YouTube video-player to play your embedded video.
If the -experimental- HTML5 option is enabled, WP YouTube Lyte will embed HTML5 YouTube video if:

  • Your visitor uses a browsers that supports the h264 (Safari, Chrome, IE9) or WebM (currently development versions of Chrome, Opera and Firefox) video codecs
  • Your visitor is enrolled in the YouTube html5 beta

If these requirements aren’t met, your visitors will see a Flash-based version of the YouTube video you specified.
As newTube.js is sort of a dirty hack which replaces the LYTE dummy player with an iframe with overflow:hidden, in which the full YouTube-page is carefully positioned to display only the player, there are some other caveats to take into account as well:

But apart from all this small print, is works rather nice if I may say so myself. Or better still, just look at this little They Might Be Giants gem embedded here;

They Might be Giants-Birdhouse In Your Soul

Lovin’ the WordPress plugin ecosystem

I’m a sucker for simple things and in my book, WordPress (the open source software) is a great example of a simple yet powerful solution for publishing on the web. The last few days I experienced their plugin-ecosystem to be just as simple and powerful.
If you have a plugin to share and you:

  1. register on wordpress.org
  2. fill out a form to submit your plugin for inclusion in their repository
  3. after confirmation upload your code (together with a structured readme-file) via svn

Then boom, automatically;

  • plugin pages (for description, installation, faq, changelog, …) are created and populated with information from the readme and base php-file
  • a zip-file is created containing your stable version
  • your plugin is listed on the “new plugins” page

Before you know it, you’ve got a bunch of real users (wp-youtube-lyte was downloaded 128 times in 2 days) who can rate your plugin and provide you with feedback. And every time you upload a new stable version via svn, a new zip-file is created and your users will get a notification in their wp-admin pages, allowing them to upgrade by simply clicking that upgrade link. Don’t you love it when a plan comes together?
But enough raving already, got to go create that admin-page for my plugin now, as requested by a user. I’m a sucker for real users!

Lite YouTube Embeds in WordPress

This 3rd episode in the “High performance YouTube embeds” series brings you yet another way to use LYTE instead of normal YouTube embeds: wp-youtube-lyte. This WordPress-plugin will automatically replace YouTube-links that start with “httpv://” with Lite YouTube Embeds, thereby significantly reducing download size & rendering time.
wp-youtube-lyte plays nice with the great “Smart Youtube” plugin, in which case it will take care of the default embeds (httpv), while Smart Youtube will parse the other types (httpvh, httpvhd, httpvp, …).
You can download the plugin from http://futtta.be/lyte/wp-youtube-lyte.zip.
A quick demo maybe, to finish things off? Owen Pallett performing “Lewis takes action” live in the KCRW studios:

Owen Pallett - Lewis Takes Action