css - Less Loop基本上会降低性能吗？

我做了较少的循环来生成特定任务所需的CSS代码。
（包含在页面底部）。
可以肯定地说编写更少的循环会减少开发时间，但还会生成不必要的代码样式吗？
我可以看到使用此技术的许多好处，但其中没有一个包括性能优化方面的内容。

    @items : 12;
@color-base : red;
@slice : 30deg;
.looop (@i) when (@i>0){
  .looop(@i - 1);
  li:nth-child(@{i}){
    transform: rotate((@i*@slice)-30) skewY(-2*@slice);
    .text {
      background  : spin(@color-base, 30);
    }
  }
}
.looop(@items);

最佳答案

您可以对其进行一些优化：

@items : 12;
@excluded-items: 1, 2, 5;
@color-base : red;
@slice : 30deg;

.looop (@i) when (@i>0) {
  .looop(@i - 1);

  li:nth-child(@{i}){
    transform: rotate((@i*@slice)-30) skewY(-2*@slice);
  }
}

.looop(@items);

li {
  .text {
      background  : spin(@color-base, 30);
    }
}