Imagine your task is to render continuous bars across discrete pixels. The challenge is to represent the dataset faithfully (say the bars are truly 2.3px wide) without fuzziness.
There are two approaches:
1) You can position your bars along a continuous scale and allow aliasing when a bar sits between two pixels. That’s what Dune analytics does and that’s why their bars can look a bit blurry, albeit accurate:
2) Or, you can round bar positions to the nearest pixel and prevent aliasing.
If you round your bar positions to the nearest pixel they will render crisp but now you have to decide between uneven gaps or uneven bar widths (you have to approx the continuous scale somehow).
Trading View uses rounded bar positions and they use uneven gaps at smaller levels:
Sometimes they use no gaps at all:
You could use uneven widths instead to get more bar:
A downside of uneven bar widths is that it can produce a strange visual effect when the bars are really small and packed due to the repeated patterns of odd/even spacing:
With wider bars the effect is reduced:
So stick to wider bars or use the equal bar widths strategy which is easier on the eyes at smaller widths.
note: modern displays can render half steps between pixels so round to the nearest 1/devicePixelRatio to make the most of the available space.