Fake Alternative to Ajax

Using IE page transitions to simulate Ajax...

You know something is definitely the "in-thing" when the fake version also gets bantered around... yes, there is now a term for it: Fajax, or Fake Ajax.

The idea is you use IE inter-page transitions. I use these on the pages in my site (and blogged about it exactly one year ago now). You need to add a meta tag to the <head> of your document... something like:

<meta http-equiv="Page-Exit"
    content="progid:DXImageTransform.Microsoft.Fade(duration=.5)" />
I get questions about this effect that is in use on this page every month or so... it should no longer be a mystery hopefully.

They have a nice side-effect of reducing the flicker associated with post-backs. Essentially what IE does is capture an image of the page before, and then renders the new page in-memory first to create a second image. It then uses DirectX to smoothly blend one image to another.


[ Tags: | | ]
Posted on Wednesday, 5/31/2006 @ 11:58 PM | #Ajax


Comments

14 comments have been posted.

Morten

Posted on 6/1/2006 @ 1:29 AM
What's the point?!? The whole idea behind AJAX is to get a more responsive UI (not to avoid postbacks as many think). Your approach actually makes it even slower, because the transition doesn't start until everything on a page has been loaded.

jc

Posted on 6/1/2006 @ 5:05 AM
The problem is that it is the webauthor that gets to dicide if its a cool feature (I think it is), it should be the user that in the browsers options would setup which transition to use.
All the code is already present in IE, only it should also check users settings, as long as the meta-tag.

Kori Francis

Posted on 6/1/2006 @ 6:36 AM
Morten, just remember .. it's just a fix for what's currently going on in Atlas. Like, with the reorder control .. it currently causes a post back but this has been attributed so something which "should" be fixed in the next version.

Just a fix, for now.

Nikhil Kothari

Posted on 6/1/2006 @ 6:45 AM
Its another tool in the toolbox - the point isn't to use it everywhere, but where it makes sense, and where you think it helps.

Diego Vega

Posted on 6/1/2006 @ 7:53 AM
I have used the effect for the last 10 months in the project I am working on. And yes, some people at my office though it was AJAX. Now, I hope I will get honest soon :) I use a period shorter than .5. Anyway, it gets completely annoying when accessed remotely trough RDP.

yaip

Posted on 6/1/2006 @ 9:11 AM
Thanks for the tip. It solved my flicker problem when I navigated to a different page. Now I won't have to use SmartNavigation (though it is depricated).

Ricaute Jiménez Sánchez

Posted on 6/1/2006 @ 11:50 AM
I use this html tag:

<html>
<head>
<title></title>
<meta http-equiv="Page-Enter" content="Alpha(opacity=100)"> <!-- Remove the IE Flashing -->
..
..
</head>
<body ...

Nick

Posted on 6/1/2006 @ 6:16 PM
Is there a way to remove the flicker but still have the page display content as it gets loaded. For example have a look how long it takes to go to the ASP.NET archive on this page. That page is pretty much all text, so i could start reading it very quickly if there was no fade effect or if it didn't wait for the entire page to load before displaying it.

Nikhil Kothari

Posted on 6/1/2006 @ 7:14 PM
The browser actually doesn't wait for the full page to be loaded - just enough to render a screenful. So all the usual guidelines and tips for designing pages (eg. fixed layout tables if you have tables) apply to get a quick initial rendering.

My server is a bit slow today, and that might explain some of the delay in the page you point at.

filips

Posted on 6/2/2006 @ 1:20 AM
I think that Script# is the next big thing for asp.net developers.

Maysa

Posted on 6/6/2006 @ 4:32 AM
Fake the name and so the work it performs. But no point of using it if it slows down.
The point is to make it works where it does make any sense and where it don't.

WiseGuy

Posted on 6/6/2006 @ 8:33 AM
I think "FakeJax" would be a cool name for it

lb

Posted on 6/6/2006 @ 4:03 PM
Thanks for linking to me Nikhil! Script# is excellent, btw.
I'm using ie7 and don't see the page transition effects any more.

Kiran

Posted on 6/14/2006 @ 3:50 AM
I am too using IE7 and this fails to work in IE7, could someone suggest how to fix this transition effect in IE7
The discussion on this post has been closed. Please use my contact form to provide comments.