Less Loop基本上降低了性能？

Question

我做了這個較少的循環來生成特定任務所需的CSS代碼。 （包括在頁面底部）。 編寫less-loops可以減少開發時間並生成不必要的代碼樣式嗎？ 我可以看到使用這種技術的很多好處，但它們都不包括性能優化方面。

@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); 

Answer 1

您可以優化了一點：

@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); 
    } 
}