Phil Freo

Can you describe the reasons for each change over https://coderwall.com/p/kdi8ua? Is it purely performance (if so, how) or improved in some other way?

@dahjelle, etc... Agreed that if you have common values a dictionary based lookup would help. Regarding Canvas: while I don't doubt it could be faster, the simplicity in your JSPerf is not very robust. There are a bunch of other CSS properties that can affect the width of text. I don't have a comprehensive list, but yours is missing a bunch (e.g., font-weight, letter-spacing, text-transform, etc.).

I saw a bunch of other half-baked implementations on StackOverflow originally that just picked specific CSS properties to care about. Without figuring out a comprehensive list (and having a longer JS implementation), my solution seemed to be the shortest & most complete.

Forgot to mention - my original example fiddle: http://jsfiddle.net/philfreo/MqM76/

Cool, thanks for sharing. In my case though this is never getting called in a loop so the difference is meaningless.

Also if you just rely on cloning it, you might miss out on styles that come from CSS selectors such as nth-child, right?