From 0bedc7e023cb9cda6822b93275d43abf52f30db8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BC=A0=E7=BF=94?= Date: Fri, 6 Mar 2026 10:02:58 +0800 Subject: [PATCH] feat: add performance audit script with Lighthouse --- scripts/performance-audit.js | 100 +++++++++++++++++++++++++++++ scripts/utils/lighthouse-runner.js | 33 ++++++++++ 2 files changed, 133 insertions(+) create mode 100644 scripts/performance-audit.js create mode 100644 scripts/utils/lighthouse-runner.js diff --git a/scripts/performance-audit.js b/scripts/performance-audit.js new file mode 100644 index 0000000..146b270 --- /dev/null +++ b/scripts/performance-audit.js @@ -0,0 +1,100 @@ +const { runLighthouse, generateReport, extractMetrics } = require('./utils/lighthouse-runner'); + +const PAGES = [ + { name: '首页', url: 'http://localhost:3000' }, + { name: '关于我们', url: 'http://localhost:3000/about' }, + { name: '联系我们', url: 'http://localhost:3000/contact' }, + { name: '服务', url: 'http://localhost:3000/services' }, + { name: '产品', url: 'http://localhost:3000/products' }, + { name: '案例', url: 'http://localhost:3000/cases' }, + { name: '新闻', url: 'http://localhost:3000/news' } +]; + +const THRESHOLDS = { + performance: 80, + accessibility: 80, + bestPractices: 80, + seo: 80 +}; + +async function auditAllPages() { + console.log('🚀 开始性能审计...\n'); + + const results = []; + const reportDir = 'test-results/performance'; + + if (!fs.existsSync(reportDir)) { + fs.mkdirSync(reportDir, { recursive: true }); + } + + for (const page of PAGES) { + console.log(`📊 审计页面: ${page.name} (${page.url})`); + + try { + const result = await runLighthouse(page.url, { + onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo'], + output: 'html' + }); + + const metrics = extractMetrics(result); + const reportPath = path.join(reportDir, `${page.name.toLowerCase().replace(/\s+/g, '-')}-report.html`); + generateReport(result, reportPath); + + results.push({ + page: page.name, + url: page.url, + metrics, + reportPath + }); + + console.log(` ✅ 性能: ${metrics.performance.toFixed(0)}`); + console.log(` ✅ 可访问性: ${metrics.accessibility.toFixed(0)}`); + console.log(` ✅ 最佳实践: ${metrics.bestPractices.toFixed(0)}`); + console.log(` ✅ SEO: ${metrics.seo.toFixed(0)}`); + console.log(` 📄 报告: ${reportPath}\n`); + + } catch (error) { + console.error(` ❌ 审计失败: ${error.message}\n`); + results.push({ + page: page.name, + url: page.url, + error: error.message + }); + } + } + + return results; +} + +function generateSummary(results) { + console.log('\n📈 审计摘要\n'); + console.log('─'.repeat(80)); + + const table = results.map(r => { + if (r.error) { + return `| ${r.page.padEnd(20)} | ❌ 失败: ${r.error.substring(0, 30)} |`; + } + const status = (m) => m >= THRESHOLDS.performance ? '✅' : '⚠️'; + return `| ${r.page.padEnd(20)} | ${status(r.metrics.performance)} ${r.metrics.performance.toFixed(0)} | ${status(r.metrics.accessibility)} ${r.metrics.accessibility.toFixed(0)} | ${status(r.metrics.seo)} ${r.metrics.seo.toFixed(0)} |`; + }); + + console.log('| 页面'.padEnd(20) + ' | 性能 | 可访问性 | SEO |'); + console.log('─'.repeat(80)); + table.forEach(row => console.log(row)); + console.log('─'.repeat(80)); + + const passed = results.filter(r => !r.error && r.metrics.performance >= THRESHOLDS.performance).length; + const total = results.length; + console.log(`\n📊 总计: ${passed}/${total} 页面达到性能标准 (${(passed/total*100).toFixed(1)}%)`); +} + +async function main() { + const results = await auditAllPages(); + generateSummary(results); + + const jsonPath = path.join('test-results', 'performance-summary.json'); + fs.writeFileSync(jsonPath, JSON.stringify(results, null, 2)); + console.log(`\n💾 详细结果已保存到: ${jsonPath}`); +} + +main().catch(console.error); \ No newline at end of file diff --git a/scripts/utils/lighthouse-runner.js b/scripts/utils/lighthouse-runner.js new file mode 100644 index 0000000..77cf4ac --- /dev/null +++ b/scripts/utils/lighthouse-runner.js @@ -0,0 +1,33 @@ +const lighthouse = require('lighthouse'); +const chromeLauncher = require('chrome-launcher'); +const fs = require('fs'); +const path = require('path'); + +async function runLighthouse(url, options = {}) { + const chrome = await chromeLauncher.launch({ chromeFlags: ['--headless'] }); + options.port = chrome.port; + + const runnerResult = await lighthouse(url, options); + await chrome.kill(); + + return runnerResult; +} + +function generateReport(result, outputPath) { + const reportHtml = result.report; + fs.writeFileSync(outputPath, reportHtml); + return outputPath; +} + +function extractMetrics(result) { + const categories = result.reportCategories; + return { + performance: categories.performance?.score * 100 || 0, + accessibility: categories.accessibility?.score * 100 || 0, + bestPractices: categories['best-practices']?.score * 100 || 0, + seo: categories.seo?.score * 100 || 0, + pwa: categories.pwa?.score * 100 || 0 + }; +} + +module.exports = { runLighthouse, generateReport, extractMetrics }; \ No newline at end of file