Files
Jatin K MalikandGitHub 0d9c488d82 fix: optimize PageSpeed Insights performance (#115)
* fix: optimize PageSpeed Insights performance

This commit addresses several PageSpeed Insights issues to improve
the performance score from 56 to a target of 90+.

Changes:
- Add SWC config to output modern ES2022 JavaScript, eliminating
  unnecessary polyfills (~12 KiB savings)
- Convert vocalinux.png to WebP format (17KB vs 207KB - 92% reduction)
- Add OptimizedImage component with WebP/PNG fallback support
- Add _headers file for proper static asset caching (1 year cache
  for immutable assets)
- Configure Next.js with optimizePackageImports for framer-motion
  and lucide-react
- Fix heading hierarchy issue (Quick Install h3 -> h2)
- Add console.log removal in production builds

Expected improvements:
- Image delivery: ~41 KiB savings
- Legacy JavaScript: ~12 KiB savings
- Cache lifetime: 754 KiB proper caching
- Accessibility score: 98 -> 100 (heading order fix)

* test: add coverage for PageSpeed optimization

Add comprehensive test suite for PageSpeed Insights optimization changes:

- WebP image loading tests (optimized-image.tsx)
- next/image component configuration tests (next.config.js)
- _headers file generation and cache header tests
- Lazy loading behavior tests

Includes:
- Jest configuration with TypeScript support
- React Testing Library setup
- 54 test cases covering all PageSpeed optimization features
- Build verification

All tests pass: npm run test
Build passes: npm run build

* ci: trigger workflow

* ci: trigger workflow run

* ci: trigger workflow
2026-02-04 19:25:34 -08:00

26 lines
760 B
TypeScript

import type { Config } from 'jest'
import nextJest from 'next/jest.js'
const createJestConfig = nextJest({
// Provide the path to your Next.js app to load next.config.js and .env files in your test environment
dir: './',
})
// Add any custom config to be passed to Jest
const config: Config = {
coverageProvider: 'v8',
testEnvironment: 'jsdom',
// Add more setup options before each test is run
setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1',
},
testMatch: [
'**/__tests__/**/*.ts?(x)',
'**/?(*.)+(spec|test).ts?(x)',
],
}
// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
export default createJestConfig(config)