Google Chrome, Rendering Glitch

 

I noticed the other day at the office, after installing Google Chrome, that the browser had a slightly obnoxious rendering glitch.  It’s apparent when viewing the jQuery Growl demo page.

Basically, it boils down to this … Chrome renders PNG’s exactly as one would expect it too, the same way that Safari and Firefox handle them … transparencies are … you got it, transparent!

Do you remember the ugly IE PNG bug where it doesn’t know how to handle the transparency layer and treats the alpha pixels ‘oddly’, almost randomly picking a color of choice and replacing your alpha pixel with a 100% opaque color? Well, looks like Chrome has a similar bug, at least … visually.

When jQuery Growl appends a new notification element to the DOM, and then fades it in … Chrome goofs the rendering up and makes the transparent pixels … non-transparent.  It appears to only do this on pixels that are not 100% transparent (opacity = 0). See the screenshot below for an example:

 

 

As you can see, the corners are 100% transparent … but everything else is not … since the background image has a weird glow/drop shadow effect on it … and you can see the notifications above it that have there CSS opacity set to 100, the PNG renders perfectly.

This bug appears to be present when the DOM Element’s opacity is set to anything other then 100, such as a jQuery fadeIn or fadeOut animation that is executing.

Nice, eh?

Hopefully, they fix this bug in the next beta …

Google Chrome, what’s missing?

I’ve been playing with Google Chrome lately, and … after reading the rather lengthy comic that describes the ‘ins and outs’ of the browsers architecture and actually sitting down and surfing with it, I’m quite impressed.

However, as with all things that are new … the number one issue I had was with it’s lack of support for Plugins.  Firefox is an open-source browser, and to my knowledge, so is the API that powers plugins for Firefox.  With a little bit of crafting, I’m sure Google Chrome could support Firefox plugins in no time flat.

Just imagine, the full power of WebKit, with the extensibility of Firefox and the stability of Chrome’s architecture.  The web looks like it’s going to be getting quite a face lift in the near future, with the way that Chrome handles rendering and how it isolate’s javascript and to that affect, optimizes it as well… we’re looking at a whole new ‘big picture’ for the web in the near future.  I don’t think anyone will adopt the technology ‘right away’ and require it for ‘stability’, but I do see it being looked at very seriously for all future web ventures … just picture, if Facebook was designed to work exclusively with Chrome’s architecture, how much more they could do with the ‘web app’ without affecting the user’s experience by slowing down other pages, etc?

One thumb up for Google so far … two if they integrate Firefox plugins, none if they go the route of developing their own Plugin API… cause we all know, we don’t need yet another browser plugin API…. geez, can’t we all just get along, and share the brilliant power of freely downloable browser plugins without needing to have Browser X or Y installed to utilize them?  We all know, Microsoft will never jump on that band wagon, but Google … they just might.

I also see a future release of Firefox taking advantage of the Chrome architecture as well … in the near future.

jQuery Growl 1.0.0-b3 Released

I just released the latest beta of jQuery Growl, adding in the new noticeDisplay/noticeRemove features.  I updated the jQuery Plugin Project page and uploaded the latest ‘beta 3′ to release it to the general public.

This release is rather minor, and only really provides a small bug fix and introduces the ability to override noticeDisplay() so that you can have your own custom animations and effects to display your notice.

Enjoy and let me know if you experience any problems with it, or have any updates that are within the ‘growl scope’ (I’ve been asked by a few people to make updates/changes to the Growl Plugin which I decided not to implement due to the lack of ‘Growlness’ in the requests.  Please refer to the official Growl homepage and experiment with the actual application before asking for feature updates, thanks.).

CakePHP 1.2 and JSON

While working on BartenderDB.com I decided to try to make the ‘data entry’ as ‘fluid’ as possible, meaning … lots and lots and LOTS of AJAX.  Using jQuery of course.

While looking for some nice Cake 1.2 JSON information, I ran across an interesting post on Pagebakers called Using JSON in CakePHP 1.2.  I gave it a quick read (actually, I skimmed it for code snippets and just rolled my own from the ‘general idea’) and it helped out tremendously.  I was up and running with JSON in under 5 minutes.  Great resource, and kudo’s to the poster.

After setting up my JSON Views, I realized that Cake was still in ‘debug’ mode — so I modified my views/layouts/json/default.ctp and simply added a Configure::write(‘debug’,0); to it … and viola, problem solved, all my JSON requests were free of Cake’s added dev/staging information.

Website Experiment – Bartender’s Database

I’ve decided that I wanted to work on something rather simple, that had the potential to bring in some (not a lot, just some) Ad revenue.  I use the AdBrite ad system, as opposed to Google, largely because they pay per impression and not just clicks.  I don’t expect very many people to click the ads found on any of my sites — the adwords are poorly targetted due to the scattered content found on my sites, and the various topics I discuss.  So, I just go for the ‘pay by impression’ model of ad revenue.  If it helps pay for the hosting, thats good enough.

So, onto my experiment … I’ve decided to build a Recipe Database system using CakePHP 1.2, and am targetting Alcoholic beverages as my first set of targetted content.  The recipe database framework is built on CakePHP and is being built in such a way as to allow me to extend it or derive from it later to include things such as Foods, and even Arts and Crafts instructions (Arts and Crafts really are just recipes, with quite a bit of instruction — a list of ‘ingredients’ and amounts of each, followed by instructions).

So, without furher ado (did I really just type that?) … I would like to announce the creation of BartenderDB.com.  So far, it’s fairly simple and straight forward and has almost no recipes in it — I’ll get to that in a bit.  It does have the ability to list the recipes by Name, list ingredients and show recipes containing those ingredients and even includes the custom ‘color tag’ so you can search for your drinks based on the end resulting color of the liquid in the glass (Hrm, that sounds a lot like a uhm … oh, nevermind, it’s a holiday).