Comments on: How To Keep Widgets From Slowing Down Sites: WEDJE

By: Anonymous

Anonymous — Sun, 07 Dec 2008 14:38:18 +0000

Fixing the IE crash:

It seems like if the script src is added to the script element AFTER the script element is appended to the div, IE doesn’t crash.
So, the setTimeout first argument should be: “document.getElementById(‘wedje_div_yourcompanyname’).appendChild(s);s.src=’http://www.mikeindustries.com/blog/scripts/sleepywidget.php’;”.

Don’t forget to remove the original s.src=… before the setTimeout call.

By: Nikolay Kolev

Nikolay Kolev — Sun, 31 Aug 2008 04:02:13 +0000

In its latest version, it crashes on IE7 every single time when I press Enter in the address bar.

By: Alex Stubbs

Alex Stubbs — Mon, 30 Jun 2008 23:28:07 +0000

Wow, I have been looking for this forever. This REALLY helped me out with the horrible twitter badge hanging my site everytime.

Thank you :)

By: James Wilson

James Wilson — Sun, 03 Feb 2008 21:11:56 +0000

I like the method to isolate widget load from the page load. Thanks.

We are looking to distribute widgets to clients. Not every page view will use our widget, but only when the consumer directly interacts with the widget. Therefore, to limit each trip to our server for the basic widget draw, we want to have the HTML live in the distributed .js file. This way only when a consumer interacts with the widget will AJAX API calls come to our servers; otherwise it is all on our clients servers?

So, deployment is providing the snippet _AND_ the .js file which we ask them to host on their system.

Again, the .js file contains the widget display, defaults, etc and the API calls to our systems.

Is this how other people are doing things? What are some alternatives to think about.

By: Mike D.

Mike D. — Sun, 20 Jan 2008 20:41:19 +0000

Hi Matt. Yeah, that’s probably just an artifact of me switching to WordPress… but yeah, I wouldn’t use WEDJE at this point because I never got around to fully sussing out the IE6 issue. It’s unpredictable.

By: matt

matt — Sun, 20 Jan 2008 03:13:56 +0000

The widget is not loading in the example?
Are some “famous” widgets using this technique? Or do the random crashing behaviour happen too often to be used in a real environment?

thanks!

By: Mike D.

Mike D. — Fri, 07 Sep 2007 19:06:17 +0000

Joe. Thanks for discovering this. I had noticed some IE crashing as well and was never able to pin it down to a certain behavior. The fact that it doesn’t happen upon a full reload makes me think it’s some sort of timing issue. I’ll look into it, but these things are pretty hard to debug sometimes…

By: Joe

Joe — Tue, 28 Aug 2007 07:36:54 +0000

I did a little more testing, and it works, and you can refresh the page many times and it works. but, when you click in the address bar and simply press enter (ie. go to same page without refreshing…) it crashes.

Any fix for this?

By: Joe

Joe — Mon, 27 Aug 2007 22:26:52 +0000

Hmm… I posted a comment here, and its gone :S

I tested this and less than 5 minutes in IE5 had crashed twice.

By: Robin

Robin — Wed, 30 Nov -0001 00:00:00 +0000

Interesting. I’ve always wondered what effects those fancy little widgets had on my loading times, I guess this confirms it. WEDJE sounds good.

By: Dave S.

Dave S. — Wed, 30 Nov -0001 00:00:00 +0000

Thank god someone’s thinking about this. Anyone from Technorati reading this? (hint hint: link count)

By: Rob Goodlatte

Rob Goodlatte — Wed, 30 Nov -0001 00:00:00 +0000

Hahah. Leave it to Mike D to coin a term :) If I use this method to embed an Atom feed widget, does that make it an Atomic WEDJE?

Another caveat — the external script cannot itself use document.write to deliver it’s code. This shouldn’t be a problem because innerHTML’ing the widgetholder anchor div inserts the code exactly where document.write would. But it does make it difficult to adapt already existing scripts that use document.write to use the WEDJE insert method. And it also means that the external script has to specifically reference the div that’s been written by the inline script on the target site.

I spent about an hour last night trying to adapt the WEDJE method to work with javascript Flickr badges to no avail — you just can’t use document.write in the external script as far as I can tell.

By: Dan Wood

Dan Wood — Wed, 30 Nov -0001 00:00:00 +0000

Very cool. In Sandvox we call these things “pagelets” since “widget”, to a Mac user, is something that goes into Dashboard.

I like the idea here but there are some issues with document.write in XHTML… A google search reveals some explanation of the issue.

So I’m wondering if there is a way to avoid the document.write and do the operation completley with DOM operations….

By: Mike D.

Mike D. — Wed, 30 Nov -0001 00:00:00 +0000

Dan: Yet another reason why serving pages up with an XML mimetype seems pointless to me. So much downside, so little upside… for now at least. :)

The original version of WEDJE (which is to say, the version we cooked up last night), wrote the container div out as part of the standard HTML, so you could always do that I suppose.

By: Rob Goodlatte

Rob Goodlatte — Wed, 30 Nov -0001 00:00:00 +0000

Dan — you can avoid the document.write by simple including the widgetholder div right above the script block — That was how we originally hacked this thing together. Mike had the good idea to include the div inside the script itself to make the whole thing a bite more self-contained, but the document.write part of the script isn’t essential if you want to avoid it.

I’m pretty sure you need some sort of tag with a unique id on the target site to reference with the external script — that DOM hook is what allows the browser to go back and deposit the external script’s embedded content after it’s moved on to render the rest of the page.