CSS性能與媒體查詢

Question

我想知道如果CSS可以是'重'，例如從瀏覽器中使用大量的解析時間。

例如我用了很多具體選擇的CSS片，像

:last-child, 
:nth-child(n) 
table.sortable thead tr th:not(.table-th-nosort):hover 

等可以在noticably影響性能？

與使用媒體查詢相同。我想要使​​用CSS3媒體查詢用於移動設備的網站訪問：

@media screen and (max-width: 600px) { 
    #sidebar { 
     display: none; 
     // etc 
    } 
} 

現在我在我的主文件中有大約600 CSS（不精縮）的線，併爲某些特定頁面包括額外的CSS文件（在10-300行之間）。

使用媒體查詢會大大增加我的預期。這會對性能產生影響嗎？

Answer 1

最簡單的檢查方法是每晚獲取webkit或Chrome Canary，然後查看新性能的審計。它可以讓你看到每個選擇器運行的時間以及佔用的總時間的百分比。 Opera的新版本也有類似的工具。

下面是什麼它看起來像一個小的屏幕截圖：