News roundup: Twitter onscroll performance, Ace editor, CSSOM, Modernizr 2.0 beta
Twitter, onscroll, and performance
You may have noticed Twitter slowing to a crawl earlier this week while trying to scroll down the page. The issue appears to be caused by upgrading to jQuery 1.4.4, as developer Dustin Diaz states on his blog.
John Resig responded with an explanation of the changes in jQuery. In particular, he explains that while most other functions are already using the native querySelectorAll, jQuery 1.4.3 brought another function .find(’.class’) up to speed by having it default to querySelectorAll. According to tests, there was a slight performance hit but it was negligible, and shouldn’t have brought any applications any noticeable slowdown. So what’s the deal with what happened on Twitter?
Resig points out that Twitter suffered badly as a result of two bad practices: 1) attaching an event handler on the window’s scroll event and 2) not caching the DOM queries. As it turns out, Twitter was re-querying the DOM EVERY time the scroll event fired. It’s amazing how this same mistake is made over and over, even in professional development. Hitting the DOM is expensive! Cache your selectors!
Mozilla Skywriter (Bespin) merged into Ace
You can see a live demo here, which is quite impressive. I remember first trying Bespin and finding it impressive, but it’s really been polished. It probably also has something to do with the speed of the browser getting faster. In any case, if TextMate is your favorite editor, you’ll find it hard to distinguish between this and the real thing!
CSSOM, variables, and mixins
They’re also implementing variables in CSS, definitely a controversial move, but one that definitely helps folks who maintain any CSS. An example of a reusable color variable might look something like the following:
@var header-color color #06c;
These slides also cover some more things we can expect to see, such as CSS mixins which promote reusable code, and which were pioneered by CSS preprocessors such as LESS.
Modernizr 2.0 beta
Modernizr 2.0 beta has been released. The team is now joined by Alex Sexton.
The biggest noticeable change is the ability to custom-tailor the download to suit your needs (very reminiscent of YUI3’s Configurator). Say you don’t care about detecting Touch events or any other features. No problem, just uncheck it and click the “Generate It!” button to get your custom download.
Paul Irish on HTML5 Boilerplate (January 27, 2011 in San Francisco, CA)
Mozilla/P2PU School of Webcraft (starts January 26, 2011 online)
JS Boot Camp (February 10-11, 2011 in Reston, Virginia, US)
High-Performance Mobile (SF Web Performance Group) (February 16, 2011 in San Francisco, CA) – a talk given by yours truly
Confoo.CA: Web Techno Conference (March 9-11, 2011 in Montreal, Canada)
MobileCampRDU (March 12, 2011 in Durham, North Carolina)
JSConf 2011 (May 2-3, 2011 in Portland, Oregon, US)
NodeConf 2011 (May 5, 2011 in Portland, Oregon, US)
jsday (May 12-14, 2011 in Italy)
Mobilism (May 12-13, 2011 in Amsterdam)
TXJS (June 11, 2011 in Texas)
HTML5 has a logo: you’ve probably heard about this by now…
What the Heck is Shadow DOM? is a look at parts of the DOM only accessible by the browser itself, but sometimes styleable. Case example is input type=”range”
Video: 11 More Things I Learned from the jQuery Source by Paul Irish is a followup to his previous video 10 Things I Learned from the jQuery Source
martial is a visual map that plots visitors’ ip addresses on a world map (live demo)
Building Reusable Widgets with YUI 3 – Ryan Grove has written a great guide on creating your own YUI3 widgets
iPad View Source Bookmarklet
Audio: Tim Caswell on Node.js – Node.js community leader explains it and what it has to offer
Audio: The Undetectables with Paul Irish (SitePoint Podcast #95) – chatting about features you can and can’t detect
Firefox 4 Beta 9 – a huge pile of awesome – Christopher Blizzard lays out the details on all the improvements in this iteration, performance included. Hardware acceleration! Woohoo!
When is Mobile Safari not Mobile Safari? – Jason Grigsby explains why the Mobile Safari user agent appears to be inconsistent during the course of a user session