Skip to content

Instantly share code, notes, and snippets.

@BlessYAHU
Created September 22, 2012 03:23
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save BlessYAHU/3765006 to your computer and use it in GitHub Desktop.
Save BlessYAHU/3765006 to your computer and use it in GitHub Desktop.
When You Can't Capture, Hover

When You Can't Capture, Hover(draft)

Even though the browser landscape in my line of work has gotten better (as in, projects don't use IE6 or IE7 anymore), I still need to deal with "legacy" browsers. Since IE8 has been around for ?? years and is becoming the [new IE6], the term legacy fits.

I came across an issue where it was taking some time for javascript objects to initialize after a page load on IE8 for an application I was building. I just read about delaying object initialization using event capturing to increase performance[link]. Makes sense, no need to initialize objects until they are about to be used. Of course the rub is that IE8 doesn't do event capturing. I could shake my fist at IE for being behind the times and the bane of web developer existence..but I chose to find another way to implement the concept.

The UI item in question was a an piece of a bigger UI element, and getting to it (to click it) required mousing over the containing UI element. I could use the mouseover event to signal that the obeject initialization:

[example code]

Now almost literally before the object is used, it will be instantiated. The only thing left was to leave some type of identifier/mark, so if it is hovered over again, it will not try to initialize the object. Adding a css class to denote the state of the ui element fit well:

[example code]

In mouseover handler that will initialize the object, I needed to add a check for the class. If it's there, we get out quick. If not, it's business as usual:

[example code]

In Review This technique fits well for this scenario. I'm not sure if it is usefull for others. If you happen to hover over elements that you are not looking to click on, it will initialize them. However this weighted against initializing all of them is still worth it.

Even though I wasn't able to use event capturing, which would have been better, I'm happy with the comprise made. If the concept wasn't understood, then I would have not been able to come up with this. I say this because in the midst of various tutorials/techniques, understanding the underlying concept will allow to apply the core of the solution to a myraid of circumstances. Or at least work around shortcomings.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment