Going Chrome

So today Google Launched Google Chrome, and like any good geek I got on it straight away.

Installation was quick and painless, and it fired up blistering quick. It was then the magic started. Now I won't focus on how nice the interface is to use, the new home page, etc I want to concentrate on the features I have used tonight whilst using it and whilst coding.

HTML & CSS Features

The first thing I did whilst playing was to view some page source, this as you would expect is on the context menu, nothing overly special here, however I did like the nice syntax highlighting, +1 to Google. However it doens't do any sort of nice reformat document, this would have been a really nice feature but we can't have it all.

Whilst looking for View Source I discovered that Chrome has a DOM Inspector built in, I got to it by "inspecting an element". This is far more than the DOM Inspector that you can get for FireFox, it gives you a nice DOM view, style information (computed, inherited, etc), Metrics, which shows the Box Model being applied to the element, and finally a properties tab giving you anything being applied to an element.

Next there's a funky search box, this allows you to search the DOM for anything, how many times have you needed to find the image with a class and you aren't sure where it renders? Now you could use inspect element, but if you are already in the inspector simply type "img" into the search box to find it lists all of the image tags within the document, now if it was really ace you could type image + class="photo" but this is not the case yet...

Resources and Debugging

All of that was only under the Elements section, there's another section... Resources This is similar to the net view tab in FireBug, it shows all of the "resources" requested by the page and shows them on a nice graph, showing how long they took to load and where in the process or you can compare the file sizes.
By clicking on the file the graph turns into a preview of the file, be it the image, JavaScript file etc.

I was slightly disapointed when I opened a JavaScript file to preview, I was expecting to be able to set breakpoints and watch's but alas no :( However there is a JavaScript Console, this is located at the bottom of the screen, the 2nd button from the left, this pops up the console.

Now this is really good, it has intelisense ;) So if you start typing document.getElementByID for example all you need to do is: do [tab].get[tab] and choose by ID. If you cant remember the name, for example getElementsByName you can just keep pressing [tab]

Now at the moment it only seems to do DOM but I'm hoping it may eventually pick up references and then you can do funky jQuery or something within the console...

Now there is soo much more I could talk about, however the final feature I used tonight was the JavaScript debugger, this is under Developer > Debug Javascript or you can use the keyboard shortcut.

Now I expected more than this, but maybe It does do more than I currently know, if you type help within the console you can see what you can do. You can attach breakpoints using the console, print variables, see what scripts are loaded, etc.

When attached to a tab the debugger will catch any errors and you can print out any variables that you need to inspect before typing continue to continue.

For me I still prefer firebug for JS debugging but I'm sure this will evolve further over time.

So that's it for tonight, I am loving Chrome, it's fast, it's slick but... there are still some bugs and glitches to iron out. For example I have seen quite a few pages where font-size is being inherited wrong within li's, so if I had 90% font size by the 5th li the text was unreadable :( There have been some other weird text issues but nothing that major.
I'm not going to make Chrome my default browser yet... but I'm not far off ;)