Performance-budget

Holder styr på byte-budgetter pr. resourcetype for en webside. Hver række er én ressourcekategori med en faktisk størrelse og et mål-budget i KB eller MB; værktøjet renderer en live statusbjælke pr. række (grøn / gul / rød), aggregerer samlet størrelse og samlet budget i MB, og tæller hvor mange rækker, der har overskredet deres budget. Fem standardrækker lever præ-udfyldt: HTML, CSS, JavaScript, Images og Fonts.

1. Rediger for hver række ressource-navnet (f.eks. "HTML"), indtast den målte størrelse, vælg en enhed (KB eller MB), og angiv budgettet i samme enhed. 2. Se statusbjælken under hver række udfyldes proportionelt i forhold til størrelse/budget. 3. Klik på Tilføj ressource for at tilføje en ny række (standard "Ny ressource", størrelse 0, budget 100 KB) eller det røde X på en række for at slette den. 4. Læs oversigtskortet i bunden: Samlet størrelse (MB), Budget (MB) og Status — enten "Alt inden for budget" eller "N over budget" i rødt.

Hver rækkes bjælke farves efter dens udfyldningsgrad: - Grøn, når størrelse ≤ budget (sund). - Gul, når størrelsen er over 80 % af budgettet, men endnu ikke overskrider det (advarselszone). - Rød, når størrelse > budget (over budget). Udfyldningsprocenten er begrænset til 100 for visning, selv når størrelsen langt overstiger budgettet. Totaler beregnes internt i KB — MB-rækker multipliceres med 1024 før summering — og den viste samlede størrelse og budget divideres med 1024 og vises med én decimal. Status-indikatoren tæller enhver række, hvor størrelse > budget, uanset enhed, så en 0,4 MB Images-post mod et 500 KB-budget tælles korrekt som over.