[Scroll] Content rendered too many times

[gltjk]

Describe the bug

When the content within the Scroll component is scrolled, it is rendered every bit the mouse wheel scrolls, which might lead to low performance of the page.

To check this, just open the following reproduction link, and then open the browser console. Though this issue only addressed the Scroll component, it is the same with the Native Scroll component.

Ideally, everything in the content should be rendered before scrolling and should not change unless as a result of Vue's reactivity. Scrolling should not trigger the change.

Reproduction

https://playground.vexipui.com/#eNqVVcGK3EYQ/ZVCDpaGjFp2QgKRd8wmIZDcgte3KMhaqWbUXqm702rNzDIeSCAQyCeEHHzwwZfkB2x/jdnF/gtXtzQazeIxNiy76qpXr6peVfduvG+VYssWvdg7MVirKjN4PxEAJwVfQmMuK5wlXp2twxUvTBnDl1/fUet7cC51gTqGZaaDMFyuVdhZwvOswcm9xHMkRHOWa1lV0DYYXpJTQ1wiX5SGWO9+cWfAEVLBMpxLTQ4BXMA3iQfxBV7a8wgGsNmAgO329e9/0JdGQVkf4toE/tW/z6//e3b17M/rF/9c/f387cun10//ou83r/73Pxcw2W6HXJHa1Rd1BXY9R9Q0fZ1EIyno6GSAJpcKC7Iw227T9aVgYyNVVhRcLGL4Sq3hrlUoEZTtJHKhPUuuuTLQoGlt9nkrcsOlGLdg6NekY8ylaGSFrJKLzmyNmmK1AHve8TtSovOmHq+V1KZhjxspaJ6OJtlZEy+GDYXQzwAN60x9AN0plHi0HvaceKUxqomjqBXqYsFyWUfkOrU6NYako190ZroVhtfIsKnDcy1XDWpKknjTEV9ExiVtS9c76mP8p+/BHiS84ftAUlxzFbb8aCe9/7Cd3sjq93J102V54/T6aNZR1EB5OnByO/njehzADmg5SbC+Ueke3xpefQStgx2jtax2hWiB6owLEpgWp9sY2ECukcLoPZlCCVuYa1mDT/PzE9FjyNebWdS/O3vnwxJrPFtxk5cDaGQ7BG/ohWhMRhdwSNR3QJhEWG0MPEBVwazbY5HVGINvTb5Tx13DoL9sw80iw+w+lIFPD4E/hV/KgOqcUEPBqJTJr+4ydpdpl6yWtPaUrWMYrrCBjJom84p0lCuWpnROU7IMcgW2qAmjFzLom5oQvyUgKI1HzPmCtWKlM/WTeIy5weIBzonBaLqYhzDUWuofM1FUqAmBtpbdS+J8AbrabYirOPBv0bdPRteLwBX8THpyKibQSHFLnJI4Nu3NxnhBGfw0dcqnbqnTlOTf+WVlAYXM2xqFYb+1qC/PsCImKuPRrc82vNg+ctV0+FK7rvxPvUVu4gB8DoFNefu2zcw6ttnM0Y7G7FoKXNrd1Pth7iupuLigSizbkyf7DrqJ/VDRIljhLMoKZ+PsNzsuiHNrtNvoO3tTIpq9q2/d/hnxSVHJzHL2VY8cbpbOYyfTxQx1lpgVjFYJtfkO6T8qBjZqegMw57ox35e8KuzwJ8yUKAK3E3T2tu8A4yPUaA==

Steps to reproduce

No response

System Info

No response

Validations

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vexip UI issue.
• The provided reproduction is a minimal reproducible example of the bug.

[qmhc]

You can view this vue sfc.

Attributes update (although value actually has not changed) will trigger template render function be called. (Ideally should not trigger if the parameters same, you can follow this issue)

If the template render result is same to prev, the Doms do not get any update.

And currently you can use v-memo to control update behavior.

[qmhc]

https://vuejs.org/guide/essentials/computed.html#computed-caching-vs-methods

You can see above documation of Vue, this behavior seems to be expected.

[gltjk]

https://vuejs.org/guide/essentials/computed.html#computed-caching-vs-methods

You can see above documation of Vue, this behavior seems to be expected.

Thanks for your reply. I know it is the expected behavior that methods are triggered every time the component gets rendered. I just don't think it necessary to re-render the content when it is scrolled. It should be natural that the content is not rendered every little bit it is scrolled (unless in a virtual list where new content keeps appearing and old content disappearing.) Maybe this could get optimized on the Scroll component's side?