Subscribe on changes!

Using :style in Vue can lead to component re-rendering.

avatar
Oct 18th 2023

Vue version

3.3.4

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-hxtfe8?file=src%2FApp.vue

Steps to reproduce

Just open the StackBlitz link, no need for any additional actions.

What is expected?

update only the styles without causing Vue to re-render the component

What is actually happening?

Modifying only :style resulted in Vue re-rendering the component.

Any additional comments?

Is this a bug, or is it something that needs optimization? image

avatar
Oct 18th 2023

updating the style attribute means updating the DOM. to update the DOM, the component needs to re-render. That's how virtualDOM based rendering libraries work.

This will be likely be different once we ship the alternate rendering mode called "vapor mode", but there no clear ETA on that.