docs: update ROADMAP with completed quick wins
Moved PageSpeed optimizations from "in progress" to "completed": - Image optimization pipeline - Font preloading - Lazy loading - Cache headers - CSS bundle split Added new completed items: - Image Optimization Pipeline - Themed Form Components Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
7d5896a1e3
commit
62faf86abe
52
ROADMAP.md
52
ROADMAP.md
@ -337,33 +337,6 @@ This ensures sellers never unknowingly sell at a loss due to Printify price chan
|
||||
|
||||
---
|
||||
|
||||
## Quick Wins (Low Effort)
|
||||
|
||||
### PageSpeed 100% Score
|
||||
**Status:** In progress
|
||||
**Effort:** 0.5-1 day
|
||||
|
||||
Achieve 100% Google PageSpeed score on all core metrics.
|
||||
|
||||
**Completed:**
|
||||
- [x] Self-hosted fonts (removed Google Fonts external dependency)
|
||||
- [x] Production asset pipeline (minified, gzipped CSS/JS)
|
||||
|
||||
**Remaining:**
|
||||
- [ ] Add proper image dimensions to all `<img>` tags (CLS)
|
||||
- [ ] Preload critical fonts (LCP)
|
||||
- [ ] Lazy load below-fold images
|
||||
- [ ] Add `fetchpriority="high"` to hero images
|
||||
- [ ] Optimise mockup images (resize to actual display sizes, WebP format)
|
||||
- [ ] Review and reduce unused CSS (currently 22KB gzipped)
|
||||
- [ ] Add cache headers for static assets
|
||||
|
||||
**Metrics to hit:**
|
||||
- Performance: 100
|
||||
- Accessibility: 100
|
||||
- Best Practices: 100
|
||||
- SEO: 100
|
||||
|
||||
---
|
||||
|
||||
## Medium Features
|
||||
@ -514,3 +487,28 @@ The project is currently named `simpleshop_theme` (reflecting its origins as a t
|
||||
### Admin Access Route ✅
|
||||
- `/admin` redirects to `/admin/theme` (requires auth)
|
||||
- Shop owners can bookmark or type `/admin` to access
|
||||
|
||||
### PageSpeed 100% Score ✅
|
||||
- Self-hosted fonts (removed Google Fonts external dependency)
|
||||
- Production asset pipeline (minified, gzipped CSS/JS)
|
||||
- Proper image dimensions on all `<img>` tags (CLS prevention)
|
||||
- Critical font preloading via `<link rel="preload">`
|
||||
- Lazy loading for below-fold images
|
||||
- `fetchpriority="high"` on hero/priority images via `responsive_image` component
|
||||
- Responsive image variants (AVIF/WebP/JPEG) via image optimization pipeline
|
||||
- Shop CSS reduced from 122KB to 36KB (split bundles)
|
||||
- Cache headers (`max-age=31536000, immutable`) on static assets
|
||||
|
||||
### Image Optimization Pipeline ✅
|
||||
- Oban background job processing for variant generation
|
||||
- Responsive `<picture>` element with AVIF/WebP/JPEG sources
|
||||
- Only generates sizes ≤ source dimensions (no upscaling)
|
||||
- Disk cache for variants (regenerable from DB)
|
||||
- Mix task for mockup optimization
|
||||
- On-demand JPEG fallback generation
|
||||
|
||||
### Themed Form Components ✅
|
||||
- Semantic CSS classes (`.themed-input`, `.themed-button`, `.themed-card`, etc.)
|
||||
- Phoenix components (`shop_input`, `shop_button`, `shop_card`, etc.)
|
||||
- Consistent styling across all shop forms
|
||||
- Reduced repeated inline styles
|
||||
|
||||
Loading…
Reference in New Issue
Block a user