Skip to content

Optimized HTML for performance and readability #14

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
7h3Rabbit merged 1 commit into from
Apr 4, 2025
Merged

Optimized HTML for performance and readability #14

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
100 changes: 66 additions & 34 deletions pug/index.pug
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,41 +1,67 @@
- let pluginData = pageInfo.data['webperf-plugin-javascript'].run ? pageInfo.data['webperf-plugin-javascript'].run : pageInfo.data['webperf-plugin-javascript'].pageSummary

if pluginData.knowledgeData && pluginData.knowledgeData.issues && pluginData.knowledgeData.issues.length > 0
h1 Grouped Issues
- let groupedIssues = {};
- pluginData.knowledgeData.issues.forEach(issue => {
- let key = `${issue.rule}-${issue.category}-${issue.severity}`;
- if (!groupedIssues[key]) {
- groupedIssues[key] = { rule: issue.rule, category: issue.category, severity: issue.severity, count: 0 };
- }
- groupedIssues[key].count++;
- });
- const severityOrder = { critical: 4, error: 3, warning: 2, info: 1 };
- let sortedGroupedIssues = Object.values(groupedIssues).sort((a, b) => {
- if (severityOrder[b.severity] !== severityOrder[a.severity]) {
- return severityOrder[b.severity] - severityOrder[a.severity];
- }
- return b.count - a.count;
- });
table
thead
tr
th Rule
th Category
th Severity
th Count
tbody
each value in sortedGroupedIssues
- if (pluginData.knowledgeData.issues.length > 15)
h1 Grouped Issues
- let groupedIssues = {};
- pluginData.knowledgeData.issues.forEach(issue => {
- let key = `${issue.rule}-${issue.category}-${issue.severity}`;
- if (!groupedIssues[key]) {
- groupedIssues[key] = { rule: issue.rule, category: issue.category, severity: issue.severity, count: 0 };
- }
- groupedIssues[key].count++;
- });
- const severityOrder = { critical: 4, error: 3, warning: 2, info: 1 };
- let sortedGroupedIssues = Object.values(groupedIssues).sort((a, b) => {
- if (severityOrder[b.severity] !== severityOrder[a.severity]) {
- return severityOrder[b.severity] - severityOrder[a.severity];
- }
- return b.count - a.count;
- });
table
thead
tr
td
a(href=`#rule-${value.rule}`)= value.rule
td= value.category
td= value.severity
td= value.count
th Rule
th Category
th Severity
th Count
tbody
each value in sortedGroupedIssues
tr
td
a(href=`#rule-${value.rule}`)= value.rule
td= value.category
td= value.severity
td= value.count

// Add tables for each rule
each value in sortedGroupedIssues
h2(id=`rule-${value.rule}`)= `Rule: ${value.rule}`
// Add tables for each rule
each value in sortedGroupedIssues
h2(id=`rule-${value.rule}`)= `Rule: ${value.rule}`
p
strong Category:
= value.category
br
strong Severity:
= value.severity
- if (pluginData.knowledgeData.issues.filter(issue => issue.rule === value.rule).length > 100)
p Note: Only the first 100 issues are displayed.
table
thead
tr
th URL
th Text
th Line
th Column
tbody
- let limitedIssues = pluginData.knowledgeData.issues.filter(issue => issue.rule === value.rule).slice(0, 100);
each issue in limitedIssues
tr
td= issue.url
td= issue.text
td= issue.line
td= issue.column
- else
h1 Issues
table
thead
tr
Expand All @@ -47,7 +73,7 @@ if pluginData.knowledgeData && pluginData.knowledgeData.issues && pluginData.kno
th Line
th Column
tbody
each issue in pluginData.knowledgeData.issues.filter(issue => issue.rule === value.rule)
each issue in pluginData.knowledgeData.issues
tr
td= issue.url
td= issue.rule
Expand All @@ -56,3 +82,9 @@ if pluginData.knowledgeData && pluginData.knowledgeData.issues && pluginData.kno
td= issue.text
td= issue.line
td= issue.column
else
p No issues found.

//- h2 Debug: Plugin Data
//- pre
//- code= JSON.stringify(pluginData, null, 3)
Loading