Typing inside a text input is extremely slow on iPad mini with iOS8 Mobile Safari and Safari 8

Question

In mobile Safari (iOS 8.0 iPad Mini) it seems that, the more inputs (I've tried with different types) a web has, the slower the "typing" gets (I've even managed to freeze safari just typing). Just to make sure it was not the keyboard, I tested with Swiftkey, but the same problem arose. With Swiftkey, the input was fast, but the text was slowly inserted inside an input type text.

I've created a jsFiddle with some inputs and it really goes slow (as hell). At this fiddle, I added some select with lots of "option" tags because I found out that this makes the situation even worse. I also tried adding autocomplete attribute (set to false) but it doesn't seem to affect in any way.

This is more or less how would a "problematic" code look like:

<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="text" autocorrect="off" />
<input class=""  type="email" autocorrect="off" />
<select><!-- lots of "option" tags --></select>

And now the weird thing: this doesn't happen on an iPhone 5S (didn't test it on any other iPad).

Does anybody know why this happens? Or if it happens on any other device?

Thanks in advance.

Answer 1

Same issue as this one: Why does Safari Mobile have trouble handling many input fields on iOS 8

A workaround is to wrap each input element in a form element like this:

<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="text" autocorrect="off" /></form>
<form><input class=""  type="email" autocorrect="off" /></form>