use-fit-text
use-fit-text copied to clipboard
We can get rid of the binary search in the font size algorithm
I read in the Readme that you are using binary search. It seems that performance can be improved by not using binary search.
The algorithm for finding the font size is as follows:
- get the width of the text
const {width} = myElement. getBoundingClientRect();
-
coefficient = element_width / fontSize
- to get the font size that will fit without breaking a line in a div with a width of 400 pixels, you need to divide 400 by this coefficient;
newFontSize = 400 / coefficient
- ...
- Profit! :)
@jt3k Such algorithm is nice but unfortunately imprecise. Text can overlap or be not as big as possible.
I know this is an old issue, but did you have any examples of this algorithm breaking? In my testing it's working okay, but it sounds like the issues are tricky edge case.