I'm a bit reluctant to use CSS3Pie as I'm not sure it is heading in the right direction. I have the following issues:

1. To use CSS3Pie currently I must include the behaviour on all rules which contain properties which I would like CSS3Pie to handle. This is a bit of issue as:
a. This would seem to be a huge headache with maintenance as when CSS3Pie supports now properties, or I refactor my CSS I have to ensure all the behaviours are in the right places.
b. It seems troublesome for the browser if my website utilises a ton of CSS3 properties, it has to load CSS3Pie for each rule. I understand that the response to the request can be cached, but it would still have to parse that file again or at least have some performance impact... no?

2. It still keeps the burdon of IE support on the developer, as it only provides support for some CSS3 properties.

These issues make me feel that a better solution would be something which can be included which tries it best to ensure IE behaves like other browsers for as much as it can - a true all round "solution" (well workaround). For instance even including CSS3Pie still won't stop the developer from having to spend countless hours still upgrading their website. It would be ideal if we could just include a file, which forces IE to behave like the other browsers.

One such alternative to this idea is Google Chrome Frame, however it would be nice is if the user doesn't have Chrome Frame then we can load in this magical file to force support. Now to me, that is a better idea.

What are your thoughts? Am I missing something?

It could have been applied as a blanket solution on load, but it's fairly apparent that this approach to solving the problem was targeted at efficiency. Compared to IE7.js, for instance, PIE is incredibly fast, because it doesn't try to do anything except do its magic on the elements you've specifically asked it to do its magic on. I think this is the right solution for real-world use.

I can just say one thing ...
PIE saved several hours I would have spent in slicing rounded corners , using images for gradients and writing extra markup ...
Seriously it's a huge time saver, better than any similar product.

I use separate stylesheet for IE and within that file I include a rule like this :

selector1, selector2, selector3 { behavior : url(pie.htc) }

That's all ... I don't have to write it for each selector. Collect them all on IE file. This will save your time

I'd like to address your points one-by-one:



At least one other behavior hack I've used in the past (whatever:hover) is implemented by adding the behavior style to the body element and letting it work out from there which elements to affect.

This approach makes it much easier to use; you only need one reference to it, and all affected styles magically work. However, the same approach for Pie is probably not feasible for a number of reasons, primarily performance - doing it this way, it would have to scan every element in the DOM for all the styles it works with, and run for each of them immediately. Whatever:hover has the advantage that hovered styles don't need to be displayed immediately on page load, so it isn't an issue if the script takes time to parse the whole DOM.

Additionally, Pie adds a number of event triggers to affected DOM elements, to support moving and resizing. Whatever:hover doesn't need to do nearly so much work in this regard, which again from a performance point of view makes it more suitable than Pie for placing at the top of the stylesheet.



If you're using most of the PIE supported styles, you'll already have a number of duplicate styles everywhere due to browser support (border-radius, -moz-border-radius, etc). In that context, I don't see any issue with placing a PIE style as well.



Once the script is loaded, it is loaded. As for running it multiple times, even if we only referenced the behavior once in the CSS, it would still need to run the code for every affected DOM element. There's no way around that, and yes: if you've got a lot of elements with rounded borders etc then yes, you may have a performance hit. That said, I'm developing a site with a *lot* of PIE, and we're not noticing any performance issues.



What??? You want it to give you the whole CSS3 spec??? Tell me you're not serious? None of the browsers do that, least of all IE. (if you don't believe me, have a look at the browser compatibility tables at Quirksmode.org.

The simple fact is that Pie provides a *hack* for IE to give it *some* additional functionality. As long as you're developing for IE, you're going to have to live with the burden of incomplete support for CSS and other specs. There are various hacks and tools around to make life easier, but as things stand there is indeed a burden, and there is no way around it. Sorry about that. That's just the way it is.

What Pie *does* do is provide a working method for supporting some of the more commonly requested visual aspects of CSS3 in IE. In that respect it is a success. If your users want rounded corners on their boxes (and everyone does these days), you can either (a) go old-school and cobble together a solution using graphics in the corners, (b) use CSS but don't bother supporting it in IE, or (c) use CSS, and add Pie for IE. It's not an ideal solution, but it's better than options (a) or (b).

For what its worth, there are a few alternatives to Pie (at least for border-radius, not sure about shadows or gradients). The solutions fall into two camps: Use Javascript for rounded boxes instead of CSS; or use behaviors. I've spent a lot of time analysing them all (I've even written my own), and I can tell you now that PIE is by far the most complete, easiest to use, least buggy and best implemented solution out there.




You are serious, aren't you? Hehe.

Pie is a javascript file which runs inside the browser. Frame is an installable application which completely replaces the whole browser engine. Common internet security rules make them very different things to use. You can't just "magically" load Frame, because the user would need to accept the download and accept the installation of the application. A lot of users (ie in businesses, where IE is still used the most) don't have the permissions to either download or install new applications. Even a lot of home users would refuse it if they didn't know what it was for.

That's a lot of hassle just for rounded corners.

Compare that with Pie, which just works. No need to ask the user to download or install anything; just add it to your CSS.

Of course, if you know your users already have Google Frame installed, then yes, you could use the meta tag to activate it. But frankly, most people who care enough to install Frame will already have been using an alternative browser anyway.

Hi Spudley,

I'm considering using CSS3PIE for my site, but I'm concerned about the performance hit.
You mention you are using this on a site with a lot of PIE, could you provide an estimate of the numbers?
My site is a auction site that can up to 250 lots on a single page, all with their own call to action button, which I'd love to use CSS3 rounded corners on (instead of lots of markup and large png), you can see an example here: http://www.go-dove.com/event-14490/BioP ... e-253/lots

Are you working on a site with as many DOM objects?

The idea of CSS3PIE really excites me, I just hope it will work with this volume of objects.

Cheers,
Jody

Hi.

Sure. I just did a quick count on a random page I've currently got on-screen, and I counted 40-odd boxes and buttons with rounded corners. Plus another 20-odd for menus which are only visible on hover. Plus another 20-odd (or more) for dynamically loaded elements. That isn't the most complex page on the site, but is probably an average one.

So no, I don't think it's going to be as complex as yours, so you may need to try for yourself to see if there is a performance issue. But even if you do have one, consider it against the performance issue of downloading extra markup or displaying an extra graphic for every button.

To my mind, PIE is in a similar league in terms of complexity to something like JQuery. If you'd be happy to run JQuery on your site, then PIE is probably just as safe.

Cheers.


Spudley.

Hi,

thanks for the quick response, those figures are encouraging, I'll give it a go and report back, doubt it will be for a couple of weeks though.
You also raise a good point about jQuery, as we do use that in various places on the site.

Cheers

Jody, FYI the upcoming beta3 release will have a big optimization in it that should make PIE very fast on your particular site. This optimization is to do lazy rendering based on the viewport -- basically PIE will only render those elements on page load which are within the visible browser viewport, and will render other elements only as the user scrolls them into view. I think with 250 elements you'll notice a significant lag on page load in beta2 (especially in IE8) but beta3 should be lightning fast.

If you don't want to wait for beta3 to be released you can try building the current dev code yourself.

Thanks for the heads up, I won't be able to start for a few weeks so I'll see if beta 3 has been released by the time I start.
If not I'll try the version in dev.

Hey guys thanks for the replies, definitely a interesting read.



Perhaps my suggestion was a bit ambiguous. Let me try again . I'm thinking that it would be nice to have a CSS3Pie for instance that tries to fix everything. So not just a few properties but the whole spectrum of IE quirks - or at least as many as possible. Chrome Frame was brought up as an alternative solution that essentially "fixes" everything, but again just as you have mentioned it has a vast majority of problems. Whereas I see a solution like a CSS3Pie that covers as many quirks as possible a great alternative to Chrome Frame. So a user could do this:
1. Include the Chrome Frame meta tag.
2. If the user does not have Chrome Frame installed, then don't do that annoying chrome frame popup but instead include CSS3Pie.

What do you think?

And thanks again to everyone for raising some really good points that I haven't though of yet, my other points have been successfully countered and I'm pleased Keep up the great work.