I'm making an interactive character sheet for D&D on my website. It's based on another character sheet, and simply adds text boxes and check boxes (and eventually will do some calculations for us).

It works great so far, except there is one rather essential bug... It's incredibly laggy when using Chrome!

If you try typing into the fields, it inserts one character then freezes for a few seconds. Mind you there are easily 300 text inputs on screen at one time.


Is there anything I can do to fix this performance issue? I don't think it's javascript related.

I set up a public test account for stackoverflow, but we can use it here:

http://radleygh.com/dnd/index.php
username: stackoverflow
password: testthispage

1. Can somebody confirm the performance issue on Chrome?
2. Does this also exist in other webkit browsers? (Works fine in Safari for PC)
3. Does anyone have any suggestions to fix the issue? (Perhaps converting the text boxes to simple <div> elements until you click on them?)

I'm completely stumped. For a long time this was working flawlessly, until I added the entire right column of inputs, then it suddenly started choking if I typed. No idea what the issue is. :/

1. Yes. I also experienced the slight delay in Chrome.
2. Works perfectly fine in Firefox.
3. Sorry, no

Thanks for the confirmation. I did test converting the inputs to divs and making the click event turn ContentEditable = true, which did solve the issue and still functioned just fine. Unfortunately, this removes much of the functionality, including the form's submit() function.


If not for already having the backend saving and load designed this would be easy, but now I'll have to rewrite a bunch of code. Argh...

I'll probably just have everyone use firefox. Hell, even IE9 doesn't have the issue. Even safari! Bleh

I don't know how much of a delay you experienced, but for me it was no more than a second or so. Unless you plan to add evan more text fields, I wouldn't worry much about it. This is an issue for the Chrome developers to tackle, not you

I didn't get any lag on that page. Nice character sheet, by the way!

The lag might be coming from the way Chrome handles text boxes. I don't know Chrome that well, but chances are if you have a bad processor (the hardware), pumping out all those inputs could be what's lagging. I'm using a quad-core 2.8Ghz processor, and there was no lag for me.

I'm sure that a powerful CPU would fix the issue. I have a 1.6ghz quad core (720QM), so yours is certainly better. The thing is, no other browser has the issue. So far I've tested:

IE6 (vm, xp sp3)
IE9 w/ IE7 mode
IE9
Firefox 8
Safari 5.1

I submitted a chromium browser ticket, which I think is the right way to report the issue.

http://code.google.com/p/chromium/is...&ts=1326573444

I've also attached a test page there which has the same result, even without all of the custom CSS.


The character sheet was not made by me, but the original is made to print out and use - which makes complete sense. But we play on PC, so it's much more convenient to have editable like this, and I love wasting time with useless projects like this just for the experience. See http://charactersheets.minotaur.cc/ for the original sheets, they're wonderful.