基準測試資料表
共用的基準測試資料表與實用範例。
已記錄輸出
Recorded CSS output
Use arrow keys to scroll the table.
| Fixture | Variant | Raw CSS | Gzip | Brotli | Samples |
|---|---|---|---|---|---|
| Documentation | Static | 56.2 kB | 6.8 kB | 5.1 kB | 10 |
| Documentation | Runtime | 32.4 kB | 4.9 kB | 3.7 kB | 10 |
| Dashboard | Static | 104.8 kB | 13.2 kB | 9.4 kB | 10 |
完整圖表呈現
這是元件示意資料,實測基準測試結果請前往產品連結。
使用於 基準測試.
用法與介面
BenchmarkDataTable 接受 title,以及作為 children 的完整原生表格。原生可展開區塊讓所有資料列保留在伺服器呈現的文件中。內層具名捲動區域可透過鍵盤操作,並將寬欄位限制在表格內。
<BenchmarkDataTable title="All recorded measurements"> <table> <thead><tr><th scope="col">Fixture</th><th scope="col">Median</th></tr></thead> <tbody><tr><th scope="row">Illustrative fixture</th><td>12.5 ms</td></tr></tbody> </table></BenchmarkDataTable>表格應保留列與欄的標題、包含單位,並區分零值與缺少資料。展開區塊使用原生滑鼠、觸控、Enter 與空白鍵行為。捲動區域在 WebKit 中也能一致處理方向鍵;沒有 JavaScript 時,展開區塊與完整表格仍可使用。列印時會顯示完整表格。