Content aware dynamic height.

[Wiblz]

I'm having a difficult time making dynamic heights work. I am writing a basic chat window with messages of different heights (depending on amount of text inside. Currently I am trying to solve it by binding offsetHeight of the message to itemSize but it causes a lot of jumping and flickering with constant rerendering of components. It is obvious that I am doing something wrong and I would really appreciate any hints on what is wrong or what is the right way of doing it.

Here's REPL link to my code: https://svelte.dev/repl/6a5c26b0b7fa4351a9d30f3f907e00cf?version=3.48.0

[jonasgeiler]

So I've looked into your problem and unfortunately this is a tough one... Probably the biggest weakness of this library... The best way to solve this problem would probably be to calculate message sizes off-screen (either using a Canvas and measureText(), or using a DOM Element and position: fixed; top: -1000px, left: -1000px) and then maybe cache the height and pass it over to the virtual list. Otherwise I will have to disappoint you...

Note: You've only used let:style, but you also need to include the style itself using {style} next to it (<div let:style {style}>)

Good luck!

[jonasgeiler]

Any updates on this? I'd like to close this issue. Let me know if you need any help!

[jonasgeiler]

Closing this now due to inactivity. Let me know if you need additional help.