Javascript or the browser for long numbers?

Question

Let's say I have a long decimal-place number and I want to use that to set the value of a dom element css width.

ex: 46.37524456801565

The browser can only render in natural number pixel units so rounding must occur. 46.37524456801565 becomes 46 pixels, for example.

Is it more performant to let the browser do the rounding or better to perform some rounding in javascript so the browser is only given a natural number?

In my case, the element width is being updated every 500ms with a new number so I'm curious to know whether I should be rounding/flooring in javascript.

edit: rephrased question for clarity

Sorry, don't really get it. What exactly is the problem? Why round the number? Is this due to width limit? — Shadow The GPT Wizard, Nov 01 '12 at 11:32
Flooring the number will probably have a higer overhead than just letting it use the raw number. - Best use JSPerf tool for this online. — cillierscharl, Nov 01 '12 at 11:33

score 2 · Accepted Answer · answered Nov 01 '12 at 11:34

2

Just pass that value in to the style as-is. The renderer will (can) only display elements to a one pixel accuracy, so will round given values automatically. If you were to round or floor the value yourself, you would likely be adding unnecessary overhead.

answered Nov 01 '12 at 11:34

Bojangles

99,427
50
170
208

Thanks for this. Caused me to have the revelation that whether the rounding is performed in js or in the actual renderer it's always going to be "the browser" that does it. Safe bet that the renderer is going to be quicker therefore. – benpink Nov 01 '12 at 12:18

score 2 · Answer 2 · edited May 23 '17 at 12:27

2

If you want consistent results, floor, ceil or round the numbers yourself.

Otherwise it is perfectly OK to pass these values as-is to the browsers but expect a one pixel difference here and there.

Javascript or the browser for long numbers?

2 Answers2