This rule aims to disallow batching multiple style changes at once.

To limit the number of repaint/reflow, it is advised to batch style modifications by adding a class containing all style changes that will generate a unique reflow.

Examples

Examples of non-compliant code for this rule:

<script>
  element.style.height = "800px";
  element.style.width = "600px";
  element.style.color = "red";
</script>

Examples of compliant code for this rule:

<style>
  .in-error {
    color: red;
    height: 800px;
    width: 800px;
  }
</style>

<script>
  element.addClass("in-error");
</script>