3 ms·

Hey John, while I've possibly got your attention, I've got a question regarding performance on IE. This one, to this day, I cannot explain. The gist of it is:

Hey John, while I've possibly got your attention, I've got a question regarding performance on IE. This one, to this day, I cannot explain. The gist of it is: I do "document.attachEvent("onmousemove", fn)" where fn resizes a div based on where the cursor is. I then test it out, and it's slow as hell, especially when the div gets pretty big. In fact, the event only seems to fire when I move the mouse slowly. Now here's the catch. I bind the event again so that the function is bound twice to onmousemove, and performance is vastly improved! How could it be that binding a function twice to an event speeds it up? Three times has no further effect... beyond that I haven't tested. EDIT: Go to my profile to see the bug in action. While resizing a div (which contains 2 iframes), it's much much smoother with the "mousemove" event attached twice.

andreyf 18y ago
Isn't it ironic how you say you love John's job (above), then throw an IE bug question at him? I wonder how many JavaScript questions he has in his e-mail every morning... shudder Aside, though: your e-mail isn't in your profile, and I'd like to chat - could you e-mail me at anfedorov@gmail.com, please?
- sam_in_nyc 18y ago
  Well, I considered that before posting... it's not a bug, it's just completely unexpected behavior. Performance related, too, so it's on topic. Anyway, I've updated my profile... let's chat
jeresig 18y ago
Hmm, I'm really not sure what the issue is, off-hand. It doesn't seem like you're hugely interested - but this is definitely what libraries are for (making annoyingly complex interactions like this possible). The jQuery UI Draggables are quite good (for example): http://ui.jquery.com/demos/draggable/ http://ui.jquery.com/demos/draggable/
- sam_in_nyc 18y ago
  I use jQuery all the time, I purposefully left it out of this example to reduce the number of variables causing the IE performance quirk. I've found that jQuery UI plugins are bloated and slow, to be honest. There focus is on providing a dead simple interface to the developer, who might not even know how to code. I believe this leads to bloating the code and degrading performance, since the code now has to check for and include tons of these little edge cases, which can even compound themselves when they're used at the same time. In the "draggable" demos, anything being dragged is quite laggy and choppy, at least in FF, when it definitely shouldn't be. jQuery already makes it easy enough to build whatever functionality I want, including drag and drop... and since it's not generalized (as in the case of jUI) it's fast. For drag and drop, 50 lines was all it took to pretty much copy the entire functionality of jQuery draggables... assuming the developer can code a tiny bit of functionality himself. Rather than cram all sorts of microfeatures, like "vertical-only" and "hortizontal-only", I abstract the problem out so that it puts more control in the developer's hands, but still is dead simple. In my case, the developer defines the "init" function (triggered after it's dragged for a given length or time), the "move" function (which is passed deltaX and deltaY) and the "end" function, all of which are passed events as well. If he can't use this information to make something resize (which is just adding deltaX to originalWidth), for example, then that's too bad, he will have to use 42kb of jUI code to do it. Another example of bloat and poor performance... if you wanted to create a Dialog, it requires Draggable, and Sortable, and comes to a total of 84kb (uncompressed). It's so laggy then when you're moving it around the shadow appears to be chasing the dialog... and resizing it lags half upwards of half a second. With jQuery, I've made draggable, resizable, shadowed dialogs in like 200 lines.

andreyf 18y ago

Isn't it ironic how you say you love John's job (above), then throw an IE bug question at him? I wonder how many JavaScript questions he has in his e-mail every morning... shudder Aside, though: your e-mail isn't in your profile, and I'd like to chat - could you e-mail me at anfedorov@gmail.com, please?

sam_in_nyc 18y ago
Well, I considered that before posting... it's not a bug, it's just completely unexpected behavior. Performance related, too, so it's on topic. Anyway, I've updated my profile... let's chat

jeresig 18y ago

Hmm, I'm really not sure what the issue is, off-hand. It doesn't seem like you're hugely interested - but this is definitely what libraries are for (making annoyingly complex interactions like this possible). The jQuery UI Draggables are quite good (for example): http://ui.jquery.com/demos/draggable/ http://ui.jquery.com/demos/draggable/

sam_in_nyc 18y ago
I use jQuery all the time, I purposefully left it out of this example to reduce the number of variables causing the IE performance quirk. I've found that jQuery UI plugins are bloated and slow, to be honest. There focus is on providing a dead simple interface to the developer, who might not even know how to code. I believe this leads to bloating the code and degrading performance, since the code now has to check for and include tons of these little edge cases, which can even compound themselves when they're used at the same time. In the "draggable" demos, anything being dragged is quite laggy and choppy, at least in FF, when it definitely shouldn't be. jQuery already makes it easy enough to build whatever functionality I want, including drag and drop... and since it's not generalized (as in the case of jUI) it's fast. For drag and drop, 50 lines was all it took to pretty much copy the entire functionality of jQuery draggables... assuming the developer can code a tiny bit of functionality himself. Rather than cram all sorts of microfeatures, like "vertical-only" and "hortizontal-only", I abstract the problem out so that it puts more control in the developer's hands, but still is dead simple. In my case, the developer defines the "init" function (triggered after it's dragged for a given length or time), the "move" function (which is passed deltaX and deltaY) and the "end" function, all of which are passed events as well. If he can't use this information to make something resize (which is just adding deltaX to originalWidth), for example, then that's too bad, he will have to use 42kb of jUI code to do it. Another example of bloat and poor performance... if you wanted to create a Dialog, it requires Draggable, and Sortable, and comes to a total of 84kb (uncompressed). It's so laggy then when you're moving it around the shadow appears to be chasing the dialog... and resizing it lags half upwards of half a second. With jQuery, I've made draggable, resizable, shadowed dialogs in like 200 lines.