I was on a panel at OSBC with Dave Mcallister of Adobe and Brian Goldfarb of Microsoft. I wanted to talk to Brian about canvas in IE9 but held off until later where I even offered the community up to write the IE code ;)
Someone off the record told me last week “it is coming… don’t worry” but that is rumor. And then Russell Leggett sent me a link to a piece by AMD on IE9 and GPU usage that had two interesting quotes:
The <canvas> element will be accelerated on the GPU via Direct2D and will enable hardware accelerated rendering contexts for application development, improving visual display, reducing CPU usage, and improving power usage.
…
AMD is working with multiple teams at Microsoft to ensure that technologies such as IE and Silverlight continue to move the PC platform forward.
Put us out of our misery Microsoft. Don’t make us create a http://petitionforie9tohavecanvas.com website ;)
Michael Hanson and a team at Mozilla Labs have been doing some really interesting work with Identity in the browser (and taking ownership back from services).
They just released an alpha add-on for Firefox that begins to integrate contacts from services (right now: “Gmail, Twitter, and, on MacOS-based machines, the local Address Book” but growing).
Imagine getting auto-complete across all of your forms… like this:
Here is a list of features:
A browser-based Contacts database that stays in sync with your address books (so far, it supports GMail, Twitter and Mac OS Address book)
A generic importer system for Contacts from desktop or web-based address books (so you can implement missing ones)
An email autocompletion feature, which demonstrates how the browser can auto-complete email addresses on any website. The autocompletion is performed entirely in the browser, without sharing the your list of contacts with the website.
A Javascript API that websites can use to access the Contacts database, with explicit user permission and filtering
This is very cool and you should also note the open technology being used:
We’re indebted to our friends and colleagues at Mozilla Messaging, who have been working on address book integration in Thunderbird for years, and have the exciting new Raindrop messaging application in experimental development now. We are working on integrating the Raindrop project with the Contacts API!
The Portable Contacts initiative is an important effort to define a common data definition for contact data. We use the Portable Contacts definition internally for Contacts.
The W3C Contacts initiative is defining an industry-standard, cross-platform API for access to contact data in the browser. The spec is new and evolving, and now is the time to experiment and provide feedback!
The Jetpack project over at Mozilla Labs has been rethinking what it is to extend the browser (as has Chrome Extensions). They both move us to using Web technologies and skills rather than having to digg into XUL or C++. The project has gone through a reboot, and shed the original experiment as Jetpack Prototype.
We now have Jetpack SDK with a brand new architecture.
Two videos really show off the thinking.
Firstly, Atul Varma, tech lead for the project, talks through the update and how you go about using Jetpack SDK. There are some cool new tools revolving around developer ergonomics. These tools help with the packaging of code, developing of code, documenting code, and the management of code. The screencast below shows you how to create a module, using CommonJS at the heart of it.
The next video is from Aza and is typical Aza. It is creative. He walks through the architecture…. why the reboot happened, and what has changed, but instead of a talking head, we get Aza’s hands and pencil drawings. Oh, and he has some glasses on the top right, showing us that he has thought hard about this. :)
It was St. Patricks Day last night, and I have a funny feeling that some green beer and Guiness lead to Brian LeRoux and Rob Ellis creating Crockford Facts. It isn’t Friday yet…. well it is in Australia right?
A certain someone was talking to me about how they find it interesting that node.js, the JavaScript server framework du jour which loves all things async, starts life with a bunch of synchronous require() calls. Now, this is actually quite fine since the startup of the server is not the issue at hand.
However, if you are running require()-esque loader code in the browser you want to avoid blocking calls else Steve Souders will come over and beat you up.
I have seen a couple of interesting items in this area:
RequireJS
James Burke of Mozilla Messaging has spent a lot of time in the depths of dojo.require(). He has taken another look at the problem and RequireJS a solution that offers:
some sort of #include/import/require
ability to load nested dependencies
ease of use for developer but then backed by an optimization tool that helps deployment
He walks through the problem and why other solutions like LABjs, CommonJS require, and Dojo itself don't cover all of his bases.
Part of the asynchronous API is that you, the developer create an array, and use the push() method to put commands on a queue. This means that you can start pushing commands immediately.
Then, when the GA code loads asynchronously, it takes over that array and wraps those standard methods. Now it can take the commands and fire them back to GA and push() can do more. Freaking brilliant.
Each character is wrapped in a <span> and then depending on the complexity of that character, more empty <span> elements are added to the markup to render each shape. Here's the markup for R:
The Curtis CSS font wasn’t conceived of any practical application. I was more interested in seeing if it could be pulled off, and if so, what the final result would look like.
Disclaimer: Ben and I work for Palm and created this program. I wanted to make sure that you were aware of it over here, since Web developers have a great chance of getting some $ :)
At Palm we wanted to reward the mobile Web developers who build great applications that our users can enjoy. We didn't want to do an "Mobile App Idol". For one, I didn't want to play the role of Simon (being the token Brit and all), and for two we find it hard to judge correctly.
So, we came up with the Hot Apps program that rewards based on the market (which while not perfect, takes out emotion from the judging system).
We put in 1 million dollars, and wanted to be sure to reward two sets of developers... those that created paid apps, and those that generously offered up their code for free. It is kinda fun to be able to say "oh, thanks for giving this away for free, but here is a reward for your hard work."
We also didn't want to just give money to the top couple of developers, but wanted to spread the love (whilst still having prize amounts that are meaningful). If you take a look at Project Appetite you can do some math on how you still have a great chance to make some $ if you get a great app into the competition.
So, if you fancy flexing some Web skills in mobile.... consider giving a run for Hot Apps.
Want to see some of the tools and a quick app build? Here is a screencast walkthrough that shows building a simple webOS app taken from a look at a helper script that I wrote:
Rey Bango (Ajaxian and now Microsoft employee) will do a post that rounds up the news from MIX today where the IE9 team shared a first preview release of IE9 that comes with new features from HTML5+ (video, SVG, CSS3, addEventListener, JavaScript compilation spread across multicore, and more). All of this is hardware accelerated. Yum. Missing was news on canvas and I didn't see deets on CSS transforms and the like (which would be awesome with hardware acceleration too).
John Resig just got on stage to talk about the collaboration between jQuery and Microsoft and how Microsoft is now contribution resources and code. For example, templates (all on GitHub which gives you:
As part of Microsoft’s broad engagement with open source communities, Corporate Vice President Scott Guthrie today announced that Microsoft is investing resources to contribute to the development of the jQuery JavaScript Library to help improve the development process of standards-based Web applications. Microsoft will also work to provide better interoperability between ASP.NET and the jQuery JavaScript Library by enhancing ASP.NET so .NET developers can better incorporate jQuery capabilities. In addition, Microsoft will actively promote and distribute versions of the jQuery JavaScript Library by packaging it with popular products such as Microsoft Visual Studio 2010 and ASP.NET MVC 2. As a first step, Microsoft will contribute a templating engine to the jQuery JavaScript Library Team to simplify Web applications.
It is early days (preview release) but great to see a solid go at it here. I *really* want the IE9 team to help us put the Silverlight team out of business :)
Sputnik touches all aspects of the JavaScript language defined in the 3rd edition of the ECMA-262 spec. In many ways it can be seen as a continuation of and a complement to existing browser conformance testing tools, such as the Acid3 test. While we are always focused on improving speed, Sputnik is not about testing how fast your browser executes JavaScript, but rather whether it does so correctly.
Since we released the Sputnik tests as an open source project, the most requested feature has been the ability to run the tests in a browser, and we are excited to launch that functionality today. The new test runner lets you run the tests from a single URL and quickly see the results in your browser. This makes it easier both for users to see how well their browser conforms to the JavaScript spec, as well as for browser makers to find bugs and incompatibilities.
The dart board shows relative conformance based on the number of tests that hit or miss. Of course, in the real world, all tests are not equal. This has been an issue with Acid tests. The race to 100 is socially interesting, but if you miss a few core tests that could be worse than meeting 10 corner cases in SVG :)
Cedric Dugas feels so passionate about fixed positioning in WebKit that he created A Better Mobile Web to talk about it:
The Problem
It is impossible to have an element fixed in CSS on the page in the mobile Webkit browser. When you are surfing the web on your phone, webkit opens the page completely and acts as a viewport.
"Imagine a book in front of you. Take a piece of paper, cut a 320*416 square in it, and lay it over the book. To read the book, move the paper around and position the hole over the words you want to see." -Richard Herrera
Why it is important
To create better mobile applications and websites, we need fixed positionning to give the user better tools to browse the web on handled devices. Like a real mobile app, we could have a fixed toolbar when scrolling on a site, it is critical to not take the user in hostage in very long list or on long content pages. This is something we can't really emulate in javascript as mobile devices are not really powerful.
The solution
The Webkit team could give us a proprietary CSS property that would overwrite the viewport behavior, and this is the proposition here. Give us a CSS property like position: -webkit-viewport-fixed that we can apply on a div so it can be fixed to the viewport.
That is one feature request, but surely there we can add to that? The broad domain of "abettermobileweb.com" deserves more!
What would you like to see for mobile specifically that isn't covered in the current Web and device API standard work?
He starts with the simple pattern that Crock-y documented back in the day..... and then goes on to discuss augmentation (loose and strict) and then deeper into some cool patterns:
// override method on the clone, access to super through super_moduleMethod
};
return my;
}(MODULE));
This pattern is perhaps the least flexible option. It does allow some neat compositions, but that comes at the expense of flexibility. As I've written it, properties which are objects or functions will not be duplicated, they will exist as one object with two references. Changing one will change the other. This could be fixed for objects with a recursive cloning process, but probably cannot be fixed for functions, except perhaps with eval. Nevertheless, I've included it for completeness.
Cross-File Private State
One severe limitation of splitting a module across multiple files is that each file maintains its own private state, and does not get access to the private state of the other files. This can be fixed. Here is an example of a loosely augmented module that will maintain private state across all augmentations:
// permanent access to _private, _seal, and _unseal
return my;
}(MODULE || {}));
Any file can set properties on their local variable _private, and it will be immediately available to the others. Once this module has loaded completely, the application should call MODULE._seal(), which will prevent external access to the internal _private. If this module were to be augmented again, further in the application's lifetime, one of the internal methods, in any file, can call _unseal() before loading the new file, and call _seal() again after it has been executed.
This pattern occurred to me today while I was at work, I have not seen this elsewhere. I think this is a very useful pattern, and would have been worth writing about all on its own.
Sub-modules
Our final advanced pattern is actually the simplest. There are many good cases for creating sub-modules. It is just like creating regular modules:
While this may have been obvious, I thought it worth including. Sub-modules have all the advanced capabilities of normal modules, including augmentation and private state.
I just finished doing some talks on geo hacking (slides are available here) and how to use some of the Geo technologies Yahoo and Google provide as part of a University gig in Atlanta.
As a lot of the students liked the idea of APIs like GeoPlanet and Placemaker but had a hard time getting their head around them I thought it a good idea to build a small JavaScript library that does the job for them.
This finds the visitor's location (on W3C geo API enabled browsers it asks them to share it - otherwise it detects the IP and locates this one on the planet)
