Initial commit: React frontend (SLP Software) + AIDLC workflow docs

Co-authored-by: Junie <junie@jetbrains.com>
2026-07-20 00:19:44 +02:00
commit e299f1c745
73 changed files with 7275 additions and 0 deletions
@@ -0,0 +1,51 @@
+# Performance Test Instructions
+
+## Purpose
+Validate that the static marketing site loads fast on a typical FTP/static web host, since page-load speed and SEO basics are explicit requirements (see `aidlc-docs/features/react-frontend/inception/requirements/`).
+
+## Performance Requirements
+- **Initial Load (Largest Contentful Paint)**: < 2.5s on a simulated "Fast 3G"/typical mobile connection
+- **Bundle Size**: JS + CSS payload kept small (single-page static site, no heavy client-side data fetching)
+- **Concurrent Users**: Not applicable — static assets served by the host/CDN, no application server to load-test
+- **Error Rate**: 0% (no runtime errors in the browser console)
+
+## Setup Performance Test Environment
+
+### 1. Prepare Test Environment
+```bash
+pnpm run build
+pnpm run preview
+```
+Serves the actual production bundle (`dist/`) locally, which is representative of what a static host would serve.
+
+### 2. Configure Test Parameters
+- **Tooling**: Browser DevTools "Lighthouse" panel (or `npx lighthouse <preview-url> --view`)
+- **Throttling**: Simulated mobile / Fast 3G, as offered by Lighthouse's default mobile preset
+
+## Run Performance Tests
+
+### 1. Execute Load Test (Lighthouse)
+```bash
+npx lighthouse http://localhost:4173 --view
+```
+(Adjust the port to whatever `pnpm run preview` prints.)
+
+### 2. Execute Stress Tests
+Not applicable — there is no backend/API to stress-test; the site is purely static assets.
+
+### 3. Analyze Performance Results
+- **Response Time / LCP**: Read from the Lighthouse report; target < 2.5s
+- **Bundle Size**: Inspect `dist/assets/*.js` and `*.css` sizes after `pnpm run build`
+- **Error Rate**: Confirm no console errors during the Lighthouse run
+- **Bottlenecks**: Typically font loading (`@fontsource/*`) or unused CSS; check the Lighthouse "Opportunities" section
+- **Results Location**: Lighthouse HTML report opened via `--view`, or exported JSON if needed
+
+## Performance Optimization
+If performance doesn't meet requirements:
+1. Identify bottlenecks from the Lighthouse report (e.g. render-blocking fonts, unused Tailwind classes)
+2. Optimize (e.g. font-display swap, purge unused Tailwind utilities via the existing Tailwind config, code-split rarely used components)
+3. Rerun `pnpm run build` + Lighthouse to validate improvements
+
+## Status
+- **Automated performance gate**: Not part of the current CI; this is a manual pre-deployment check
+- **Recommendation**: Run this check once before the first production deployment (Deployment Setup stage) and after any significant asset/dependency change