Steve Souders has another insightful post where he discusses splitting the initial payload for the JavaScript in your page / application.
Steve first outlines how JavaScript can affect how the browser renders a page:
The growing adoption of Ajax and DHTML means today’s web pages have more JavaScript than ever before. The average top ten U.S. web site[1] contains 252K of JavaScript. JavaScript slows pages down. When the browser starts downloading or executing JavaScript it won’t start any other parallel downloads. Also, anything below an external script is not rendered until the script is completely downloaded and executed. Even in the case where external scripts are cached the execution time can still slow down the user experience and thwart progressive rendering.
He then took the Alexa top ten websites and tracked how much of the code was executed before the onload event, based on functions called. The results are below:
Now, it is easy to understand why this is the case. There are factors such as the simplicity in putting the code in one file, and feeling like the cache effects will make the point moot (which Steve argues against). Steve gets this:
The task of finding where to split a large set of JavaScript code is not trivial. Doloto, a project from Microsoft Research, attempts to automate this work. Doloto is not publicly available, but the paper provides a good description of their system. (You can here the creators talk about Doloto at the upcoming Velocity conference.) The approach taken by Doloto uses stub functions that download additional JavaScript on demand. This might result in users having to wait when they trigger an action that requires additional functionality. Downloading the additional JavaScript immediately after the page has rendered might result in an even faster page.
Eric Miraglia has posted a great tutorial on how to build your first YUI application. He runs you through the steps of creating a simple application that leverages YUI’s AutoComplete Control to create a site-search form powered by the Yahoo!’s Search web service.
The tutorial is a great walkthrough of both how to build the application and also leverage YUI’s extensive documentation. It also touches on some great points such as:
Doctype is an exciting beast, and for many reasons. Having a place to collect this data is key, and as I said yesterday, I can’t wait to see it grow as an open resource.
The other cool part of Doctype is that there are tests to backup claims. This seems like a “no brainer” as some of my ’sherman’ friends would put it, as it is the corner stone of science.
The tests are shown through the corpus itself, but you can also go directly to the tests as they live in the Google Code project.
Take a peak at say the document tests and you will start to see how much work Mark has put into this, to give us a solid base to go on from.
You will also see that the tests use a goog.* set of JavaScript libraries that are interesting in their own right.
Simon Willison has already found some interesting things such as:
The Goog library includes code to detect the user’s installed version of iPhoto, based on reverse engineering the Mac.com Gallery RSS feeds.
There is a lot of great code in there, so do some archeology if you have a spare cycle or two. And, let us know what you find!
With Silverlight 2 aimed square at Flash, many of us were interested to see what Flash 10 would have in store for us. We get our first glimpse with the Flash 10 prerelease, code named “Astro”.
I installed the prerelease and recorded the demos so you can take a quick peak:
The biggest feature in my mind, is true 3D:
3D Effects - Easily transform and animate any display object through 3D space while retaining full interactivity. Fast, lightweight, and native 3D effects make motion that was previously reserved for expert users available to everyone. Complex effects are simple with APIs that extend what you already know.
There are other new features too. At a high level:
Custom Filters and Effects - Create your own portable filters, blend modes, and fills using Adobe Pixel Bender, the same technology used for many After Effects CS3 filters. Shaders in Flash Player are about 1KB and can be scripted and animated at runtime.
Advanced Text Layout - A new, highly flexible text layout engine, co-existing with TextField, enables innovation in creating new text controls by providing low-level access to text offering right-to-left and vertical text layout, plus support for typographic elements like ligatures.
Enhanced Drawing API - Runtime drawing is easier and more powerful with re-styleable properties, 3D APIs, and a new way of drawing sophisticated shapes without having to code them line by line.
Visual Performance Improvements – Applications and videos will run smoother and faster with expanded use of hardware acceleration. By moving several visual processing tasks to the video card, the CPU is free to do more.
If you delve into the release notes you see features such as:
It is also interesting to put this into context with JavaFX, which was hyped last week at JavaOne (without a release yet). There were some nice demos, such as 3D video globes, and a few people said “Flash couldn’t do that. No decent 3D or hardware acceleration.” The bar keeps rising for all.