CSS has always been the weakest link for me in terms of creating larger web apps. PHP, JS? Now manageable. But over the years, CSS has remained the most stubborn language to structure well. You can have dozens of CSS files, but any line in any one of them can affect any element in any page. The horror. It seems like no matter what decisions you make on how to organize the CSS, you end up running into problems. I think the relative absence of CSS design patterns relative to other languages hints at the problem – it’s just not something that developers have been able to properly address, due to the limitations of the language itself.

(On a related note, thank heavens for CSS pre-parsers).

This is why I’m so excited about the new scoped HTML5 attribute for the style tag, which just landed in Firefox 21 (out now!). It lets you scope your CSS based on the location in the DOM. Here’s a simple example:

If you’re running FF21 you can see an example here:
http://www.benjaminkeen.com/experiments/scoped.html

There’s still a long way to go, but this is tremendously encouraging. I have little doubt that Web Component shim developers (Polymer, anyone?) will be making use of this new feature in no time.

Hopefully the other browser vendors will implement this soon. As always, see caniuse.com to keep up to date:
http://caniuse.com/style-scoped

I’m extremely excited to say I’ll be starting a new position at CBC Music, here in Vancouver in mid-June. I’ll be in a similar role as web developer, doing what I can do to help out with cbcmusic.ca – mobile, desktop – as well as hanging out with the celebs, naturally.

I’ve been at Central1 Credit Union for a total of 3 years now (with a year break in the middle) and as much as I’ve enjoyed it, it’s definitely time for a change. This last year I’ve worked almost entirely on helping design and develop a large-scale JS framework built on requireJS. I learned a fair amount but it’s time for some new challenges.

So, in a little over a week I’ll be saying goodbye to my co-workers, then flying off to Florida for a couple of weeks to go to JSConf (a javascript conference) and for my honeymoon (did I mention I got married?) then back to Vancouver to start the new position.

Can’t sodding wait. CBC!

I just released the Data Generator 3.0.0 beta. You can find it here:
http://beta.generatedata.com

The host is PAINFULLY slow right now, but the code seems pretty solid at this point.

Over the new couple of weeks my focus is going to be on:
- speeding the whole thing up with requireJS optimizer.
- finishing the Developer Doc (80% there!)
- getting the JS and PHP Doc up to date.
- working on the new website.

All the best!

Ben

Nice! I secured a very-late ticket for this year’s JSConf. This’ll be the first time I’ve attended this conference – always meant to, but somehow it never happened.

Plus it’s being held in Florida, the land of great birds… this by no means influenced my decision to go. Not one bit.

Many javascript errors on production sites go unnoticed: they’re only ever visible to the visitor and never tracked – what a wasted opportunity!

This script catches any client-side errors that occur in any modern browser and pass the information – line number, URL, stack trace – to the server for logging. It can provide significant insight into problems occurring on your web sites and applications that otherwise would go missed.

https://github.com/benkeen/js-error-logs

Happy New Year! To start the new year off right, I’ve just released the first alpha of generatadata.com 3. It’s early days yet – lots of bugs to resolve, lots more hair to pull out, lots more yelling at the cat to stop scratching at the door because I’m working, damnit. But it’s coming together well and it’s time to “get it out there”.

I pared back a few items on the feature list so I could get it released and start getting some feedback. The following features didn’t make the initial cut, but will be appearing in later versions:
- Excel export type
- “Tree” data type
- Accounts. Right now everyone shares a single anonymous admin account.
- Translations (right now, English only).
- Developer Documentation
- IE support! Right now the script only supports Chrome + FF.

You can find the online demo here:
http://alpha.generatedata.com

The entire codebase is on github. You can download the alpha1 tag here:
https://github.com/benkeen/generatedata/tags

Bug reports would be most appreciated – and of course, feel free to fork the project and fix them too. ;)

Enjoy! :)

I came across this marvellous little script yesterday by Nick Stakenburg which creates a loading icon spinner using Canvas, letting you avoid having to use animated gifs. Very nice!
http://projects.nickstakenburg.com/spinners/

It was almost perfect for my needs, except I needed a few small tweaks. So here’s my fork of the script, with fadeOutSpeed, pauseColor and pauseOpacity options.
http://www.benjaminkeen.com/experiments/spinners/gui/

You can download it from github here:
https://github.com/benkeen/spinners

This afternoon I revisited some old code I wrote to address the problem where sometimes you want to do the following:

Even though that’s perfectly acceptable within JS, it takes time for the browser rendering engine to do the job of actually inserting the DOM, so it may not be ready for the second line to actually find the content it just inserted. I outlined the whole problem in an old post here.

Anyway, I updated the code in that post and rewrote it into a requireJS module. You can find it here:
https://gist.github.com/4242808. It’ll be included in the upcoming Data Generator rewrite.

Here’s a screenshot of the now-finally-relatively-stable new interface for 3.0.0 of the Data Generator. This will be the “classic” theme – very much just a continuation and improvement of the existing design. Once I’m a little further along, a friend (an actual designer) is going to design a new theme which I’ll probably end up using as the default. I’m personally quite happy with how it now looks, but I’m well aware my design abilities aren’t exactly “epic”.

That said, I do think it’s a substantially better UI than the existing version, aesthetically and functionally. The script now offers some useful new options:

• New export formats (JSON, programming languages)
• New data types (Company Names, Lat/Lng, GUID, Composite field, Tree)
• New country-specific data (Australia, Belgium)
• New ways to view/download the generated data: in-page, download + new tab/window.

But by far the biggest improvement is that the entire script is now modular. You can write your own Data Types, Export Types and provide new Country-specific data to generate data appropriate to your own country. Pretty frickin’ cool.

Coming soon! (I’m shooting for getting the alpha ready for Jan 1st).

Just got back from Kauai, Hawaii. Not the best place on earth for birds, but I added another 27 species to my life list – and cracked the 400 species bird count for the year! I just put up a gallery of the better shots I took. No real stunners but a couple aren’t too bad.
http://www.benjaminkeen.com/birding/hawaii-2012/

As always, I’ve uploaded the better pictures to Wikimedia Commons and updated the odd wikipedia page as well (e.g. the Kauai Amakihi).

Sadly, that’s the last trip I’ll be taking this year. The year’s highlights were definitely New Zealand and Costa Rica. Should be returning to Costa Rica next spring – pity NZ is so damn far away…!

Enjoy.