Possible Chrome bug: Typing into input field is terribly slow if rest of page has heavy css

问题

I have a page that consists of:

• basic input field
• lots of heavily styled dom elements

Typing in the input field is very slow -- it causes a lot of re-layouting.

The Timeline tab in the Chrome Dev Tools indicates that only the input field is redrawn. Removing all the heavy CSS makes the typing much faster -- the layout are much shorter.

It makes no sense that:

• the input field triggers a layout when you type in it
• that this layout is dependent on other page elements even if the Inspector only says that the input field is relayouted.

Affected browsers:

• Chrome beta on Linux
• Chrome beta on Android

Not affected:

• Firefox stable/beta on Linux
• Firefox beta on Android

Here is a jsbin that exhibits this problem

回答1:

The issue was that I was forcing this rule in the css of some of the elements on the page:

-webkit-backface-visibility: hidden;

Removing it made the Layout much faster (unnoticeably short)

来源：https://stackoverflow.com/questions/22127701/possible-chrome-bug-typing-into-input-field-is-terribly-slow-if-rest-of-page-ha