search

codedance / jquery.AreYouSure

A light-weight jQuery "dirty forms" Plugin - it monitors html forms and alerts users to unsaved changes if they attempt to close the browser or navigate away from the page. (Are you sure?)
508 stars 145 forks source link

900ms cooldown for IE and Chrome too long #80

Open clin-smooth2 opened 9 years ago

clin-smooth2 commented 9 years ago

I've been experiencing issues where after creating a dirty form, clicking a link, choosing to not navigate away from the page, then clicking another link within 900ms navigates away from the page. This appears to be a workaround for an issue on line 169 - I was wondering if reducing this to a much lower amount (say 50ms) or if this might cause issues.

codedance commented 9 years ago

A bit of history. The "cooldown" was originally there for IE only, but then Chrome started to exhibit the same behaviour. In short the bowers seem to raise multiple 'beforeunload' events - say once on the user action when the user clicks on an external link, and then again when the page unloads after the new page link resolves. This 2nd "resolve" event depends on network performance - ie. DNS lookup, network round-trip. In most situations this is pretty quick, but for external/new links it's a lot slower. There is not a lot of "science" in 900ms - just deduced by playing around. It's a balance between protecting the situation you've mentioned vs. a double-dialog.

In your case, you may know the "speed" of your off-page link so reducing this may be acceptable. I'll leave this issue open and if we get any more requests, I could consider making this configurable via the options.

Comments/thoughts welcome.

14113 commented 9 years ago

I'm not sure if it's the same issue, but I had a really big form, so I check this lib. and find one thing why it makes it so slow. 

$fields = $form.find(settings.fieldSelector);

Because of this setup:

'fieldSelector': ":input:not(input[type=submit]):not(input[type=button])"

So I just init form like this:

$('form').areYouSure({fieldSelector: 'input'})

Now speed is 10 times better. I now, it's not the best approach, but UX it more important for me.

codedance commented 9 years ago

I'd like to understand the performance issue a little more. A few questions:

1) How many fields do you have in your form? 2) What browser(s) are you setting the issue one?