Add-On Support for Chrome

Google Chrome Plugins

Google Chrome has been my favourite browser for plain old web surfing since it came out but one of the few downsides to this fast loading and stable browser is the lack of support for add-ons. This is one of the reasons FireFox has claimed such a major stake in the browser market because there are literally hundreds if not thousands of add-ons available to extend the browsers functionality.

Now Chrome has finally caught up and if you are subscribing to Googles dev channel you will be pleased to know that there are already a hundred or so add-ons waiting to be installed on your favorite browser. I have already installed Flashblock and Adblock and they seem to be working well. There does exist a web developer toolbar but its functionality is so cut down and basic at the moment its probably not worth getting.

Now if you are like me and have been working around the lack of plugins for Chrome by using bookmarklets then you will be pleased with this news. However if you are still interested in using bookmarklets which will work cross browser then here is another good one. It allows you to download Flash videos from YouTube at a click of a button so that you can watch them later on.

All you need to do is right click on the bookmarks bar (which should always be made visible) and then click "Add". Then in the Name you should put "YouTube Flash Downloader" or something similar and then for the URL you should paste in the following code:

javascript:window.location.href = 'http://youtube.com/get_video?video_id=' + yt.getConfig("SWF_ARGS")['video_id'] + "&sk=" + yt.getConfig("SWF_ARGS")['sk'] + '&t=' + yt.getConfig("SWF_ARGS")['t'];

This code has been updated to work with the recent changes in YouTubes API so don't worry as I know there is an old version of this bookmarklet floating around the web that doesn't work since November this year.

Now when you are on YouTube and a video starts playing you can just click on that bookmark link and the video should start downloading to your computer.

If you don't have a Flash player installed on your computer and want to play the FLV files in Windows Media Player then you can download an extension from the following location:

www.playflv.com

If you are interested in other cool bookmarklets then check out my previous article which contained one for viewing the generated source code of a page and one for dynamic DOM inspection.

Remember the cool thing about bookmarklets as apposed to add-ons is that they should work in all modern browsers as they are pure JavaScript. That even means IE 6!!

Also before everyone gets carried away installing lots of add-ons for Chrome just take a step back and remember why you're using Chrome in the first place. For me its because FireFox, which I use for all my web development, has so many add-ons installed that its become very slow to load and many of the add-ons can cause slow page loads e.g Firebug or errors. Therefore if you're like me and use many browsers keep the add-ons to a minimum and keep your web browsing fast.

I will shortly be writing an article about increasing speed and performance for all the major browsers but as a teaser I would give these pointers to quicker browsing.

• Remove all add-ons that you never use anymore and disable those you rarely use.
• Add-ons that will make your web surfing quicker such as FlashBlock, AdBlockPlus and NoScript are all good. Only enable those Flash movies and adverts if you really need to.
• Turn off inbuilt RSS readers and use a special app if you require it.
• Turn off all 3rd party cookies but keep Session cookies enabled.
• Trawl through those preference settings and disable anything you do not use.
• Disable link pre-fetching.
• Regularly clear your cache, history and auto-complete data.

Those are some very simple tips for increasing speed. I will go into more detail about the user preferences, http.pipelining, max-connections and TCP/IP settings another day.

Useful Bookmarks to overcome IE 8 / Firebug

Two useful bookmarks to aid web development

Over the last month I have been moaning a lot about IE 8 and Firebug and have started working without these two developer tools that have had started causing me problems such as:

-Very slow load times on certain sites or pages (IE 8 dev toolbar / Firebug)
-Hanging of the browser and maxing out CPU (50% on a dual core) (IE 8 / Firebug)
-Errors related to other scripts or add-ons (Firebug)

I have just found another issue to add to the list which is that when Firebug is enabled my Google Adverts are not loading on the following site: www.hattrickheaven.com with the following errors being reported (copied from firebugs console)

cannot access optimized closure

gadgets is undefined

IG_EmbedCachedFlash is not a function

Which are coming from a file that is referenced by Googles Adsense http://ads.gmodules.com/gadgets/ifr.

I do know that there have been bugs in Googles Adsense code latley as I regularly get errors from ads.modules.com/gadgets/ifr. There were some errors the other day that prevented adverts from showing as well as any content loaded through Googles AJAX API in IE. If I view the same page in IE I do get a Invalid argument error (line 603, char 7) however the google adsense advert loads correctly.

However if I disable Firebug the adverts appear correctly in Firefox so I can only assume its a clash between Firebug and Googles code just like the error I reported the other month with the highlighter code I use on my blog.

The problems with both of these add-ons has meant that I have disabled both the IE developer toolbar and Firebug from appearing automatically on all pages. With Firebug I know that if I need it I can turn it on with ease and deal with the errors knowing that they are most likely caused by the tool itself rather than any other script. However with IE's developer toolbar its not so easy due to it causing my PC to hang the majority of the time its used.

I have found that going to Control Panel > Internet Options > Advanced > Reset does resolve the issue for a while until the problems slowly build up again over time and the browser with the developer toolbar becomes unusable.

Until IE resolve this issue I have resorted to using the following two bookmarklets to accomplish the two main tasks I use the developer toolbar and Firebug for.

The first is a bookmarklet that allows me to view the generated source code for a particular page:

javascript:(function()%7b%20function%20htmlEscape(s)%7bs=s.replace(/&/g,'&');s=s.replace(/%3e/g,'>');s=s.replace(/%3c/g,'<');return%20s;%7d%20x=window.open();%20x.document.write('%3cpre%3e'%20+%20htmlEscape('%3chtml%3e\n'%20+%20document.documentElement.innerHTML%20+%20'\n%3c/html%3e'));%20x.document.close();%20%7d)();

Which if you unpack it breaks down as the following code:

javascript: (function () {
function htmlEscape(s) {
s = s.replace(/&/g, '&');
s = s.replace(/>/g, '>');
s = s.replace(/</g, '&lt;');
return s;
}
x = window.open();
x.document.write('<pre>' + htmlEscape('<html>\n' + document.documentElement.innerHTML + '\n</html>'));
x.document.close();
})();

And the following code which will generate a DOM inspector allowing you to highlight elements on your page and view its properties and child elements.

javascript:prefFile='';void(z=document.body.appendChild(document.createElement('script')));void(z.language='javascript');void(z.type='text/javascript');void(z.src='http://slayeroffice.com/tools/modi/v2.0/modi_v2.0.js');void(z.id='modi');

You can get these and other bookmarklets from the following site which is tailored for adding missing functionality to Google Chrome: http://www.nogeekyname.com/blog/google-chrome/extensions-for-google-chrome-bookmarklet-for-chrome/