blumenjs 0.1.6 → 0.2.0

package/dist/templates/app/pages/templates/BlumenDashboard.tsx

@@ -58,44 +58,53 @@ const DashboardPage: React.FC = () => {
 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
 @keyframes fu{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
 .fd *{box-sizing:border-box;margin:0;padding:0;font-family:'Inter',sans-serif}
-.fd{min-height:100vh;background:#f0f2f0;display:flex;color:#1a1a2e}
+.fd{min-height:100vh;background:#f0f2f0;display:flex;color:#1a1a2e;width:100%}
 
 /* Sidebar */
-.sb{width:200px;background:#fff;border-right:1px solid #e5e7eb;padding:16px 10px;display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:10}
+.sb{width:220px;background:#fff;border-right:1px solid #e5e7eb;padding:16px 10px;display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:10}
 .sb-brand{display:flex;align-items:center;gap:8px;padding:8px 10px;margin-bottom:20px}
 .sb-logo{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,#16a34a,#22c55e);display:flex;align-items:center;justify-content:center;font-size:0.75rem;color:#fff;font-weight:800}
 .sb-name{font-size:0.9rem;font-weight:800;letter-spacing:-0.01em}
 .sb-nav{list-style:none;flex:1}
-.sb-ni{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;font-size:0.78rem;font-weight:500;color:#6b7280;cursor:pointer;transition:all 0.15s;margin-bottom:1px;border:none;background:none;width:100%;text-align:left}
+.sb-ni{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;font-size:0.78rem;font-weight:500;color:#6b7280;cursor:pointer;transition:all 0.15s;margin-bottom:1px;border:none;background:none;width:100%;text-align:left;font-family:inherit}
 .sb-ni:hover{color:#16a34a;background:#f0fdf4}
 .sb-ni.on{color:#fff;background:#16a34a;font-weight:600}
 .sb-cta{margin-top:auto;padding:16px;border-radius:12px;background:linear-gradient(135deg,#0f3d1e,#14532d);color:#fff;text-align:center}
 .sb-cta p{font-size:0.65rem;color:#86efac;margin:6px 0 10px;line-height:1.4}
-.sb-cta-btn{padding:6px 16px;border-radius:6px;background:#22c55e;color:#fff;font-size:0.72rem;font-weight:600;border:none;cursor:pointer}
+.sb-cta-btn{padding:6px 16px;border-radius:6px;background:#22c55e;color:#fff;font-size:0.72rem;font-weight:600;border:none;cursor:pointer;font-family:inherit}
+
+/* Mobile header bar */
+.mob-bar{display:none;position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #e5e7eb;padding:10px 16px;align-items:center;gap:10px}
+.mob-bar-btn{width:36px;height:36px;border-radius:8px;background:#f0fdf4;border:1px solid #dcfce7;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem}
+.mob-bar h1{font-size:1rem;font-weight:800;flex:1}
+.mob-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:50}
+.mob-overlay.show{display:block}
+.sb.mob-open{display:flex!important;z-index:60}
 
 /* Layout */
-.mn{margin-left:200px;display:grid;grid-template-columns:240px 1fr 260px;min-height:100vh}
-.lp{padding:16px 12px;background:#fff;border-right:1px solid #e8ebe8}
-.cp{padding:16px}
-.rp{padding:16px 12px;background:#fff;border-left:1px solid #e8ebe8}
+.mn{margin-left:220px;display:grid;grid-template-columns:260px 1fr 280px;min-height:100vh;width:calc(100% - 220px)}
+.lp{padding:16px 14px;background:#fff;border-right:1px solid #e8ebe8;overflow-y:auto}
+.cp{padding:20px;min-width:0;overflow-x:hidden}
+.rp{padding:16px 14px;background:#fff;border-left:1px solid #e8ebe8;overflow-y:auto}
 
 /* Components */
-.cd{background:#fff;border-radius:12px;border:1px solid #e8ebe8;padding:14px;margin-bottom:12px;animation:fu 0.4s ease-out both}
-.hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
-.hdr h1{font-size:1.15rem;font-weight:800}
-.search{padding:6px 14px;border-radius:8px;border:1px solid #e5e7eb;background:#f9fafb;font-size:0.78rem;width:200px}
-.uav{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#16a34a,#4ade80);display:flex;align-items:center;justify-content:center;font-size:0.65rem;font-weight:700;color:#fff}
+.cd{background:#fff;border-radius:12px;border:1px solid #e8ebe8;padding:16px;margin-bottom:14px;animation:fu 0.4s ease-out both}
+.hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px}
+.hdr h1{font-size:1.2rem;font-weight:800}
+.hdr-right{display:flex;align-items:center;gap:10px}
+.search{padding:7px 14px;border-radius:8px;border:1px solid #e5e7eb;background:#f9fafb;font-size:0.78rem;width:220px;font-family:inherit}
+.uav{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#16a34a,#4ade80);display:flex;align-items:center;justify-content:center;font-size:0.65rem;font-weight:700;color:#fff;flex-shrink:0}
 
 /* User Card */
-.uc{background:linear-gradient(135deg,#14532d,#166534);border-radius:14px;padding:16px;color:#fff;margin-bottom:12px;position:relative;overflow:hidden}
+.uc{background:linear-gradient(135deg,#14532d,#166534);border-radius:14px;padding:18px;color:#fff;margin-bottom:14px;position:relative;overflow:hidden}
 .uc::after{content:'';position:absolute;top:-25px;right:-25px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,0.05)}
-.uc-n{font-size:0.9rem;font-weight:700;margin:8px 0 12px}
-.uc-b{font-size:0.65rem;color:#86efac}
-.uc-a{font-size:1.3rem;font-weight:800;margin:2px 0}
-.uc-m{display:flex;gap:16px;margin-top:10px;font-size:0.65rem;color:#86efac}
+.uc-n{font-size:0.92rem;font-weight:700;margin:8px 0 12px}
+.uc-b{font-size:0.68rem;color:#86efac}
+.uc-a{font-size:1.4rem;font-weight:800;margin:2px 0}
+.uc-m{display:flex;gap:16px;margin-top:10px;font-size:0.68rem;color:#86efac}
 
 /* Quick Actions */
-.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}
+.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:14px}
 .qa-i{text-align:center;padding:8px 2px;border-radius:8px;background:#f0fdf4;border:1px solid #dcfce7;cursor:pointer;transition:all 0.15s}
 .qa-i:hover{background:#dcfce7;transform:translateY(-1px)}
 .qa-ic{font-size:0.9rem;margin-bottom:2px}
@@ -114,36 +123,36 @@ const DashboardPage: React.FC = () => {
 .sv-m{display:flex;justify-content:space-between;font-size:0.65rem;color:#9ca3af}
 
 /* Stats */
-.sts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
-.st{background:#fff;border-radius:12px;border:1px solid #e8ebe8;padding:14px;animation:fu 0.35s ease-out both}
+.sts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
+.st{background:#fff;border-radius:12px;border:1px solid #e8ebe8;padding:16px;animation:fu 0.35s ease-out both}
 .st:nth-child(2){animation-delay:0.05s}
 .st:nth-child(3){animation-delay:0.1s}
 .st-ic{width:32px;height:32px;border-radius:8px;background:#f0fdf4;display:flex;align-items:center;justify-content:center;font-size:0.8rem;margin-bottom:10px}
-.st-v{font-size:1.3rem;font-weight:800;letter-spacing:-0.02em}
-.st-l{font-size:0.72rem;color:#9ca3af;margin-top:2px}
-.st-c{font-size:0.65rem;font-weight:600;padding:2px 6px;border-radius:4px;margin-top:6px;display:inline-block}
+.st-v{font-size:1.4rem;font-weight:800;letter-spacing:-0.02em}
+.st-l{font-size:0.75rem;color:#9ca3af;margin-top:2px}
+.st-c{font-size:0.68rem;font-weight:600;padding:2px 6px;border-radius:4px;margin-top:6px;display:inline-block}
 .st-c.up{background:#f0fdf4;color:#16a34a}
 .st-c.dn{background:#fef2f2;color:#dc2626}
 
 /* Chart */
-.ch{display:flex;align-items:flex-end;gap:4px;height:140px;padding-top:6px}
+.ch{display:flex;align-items:flex-end;gap:4px;height:160px;padding-top:6px}
 .ch-c{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px}
 .ch-bw{flex:1;width:100%;display:flex;gap:2px;align-items:flex-end;justify-content:center}
 .ch-b{border-radius:2px 2px 0 0;min-width:6px;transition:all 0.2s}
 .ch-b:hover{filter:brightness(1.15)}
 .ch-b.inc{background:#16a34a}
 .ch-b.exp{background:#bbf7d0}
-.ch-m{font-size:0.55rem;color:#9ca3af;margin-top:3px}
-.lg{display:flex;gap:12px;font-size:0.68rem;color:#6b7280}
-.lg-d{width:7px;height:7px;border-radius:2px;display:inline-block;margin-right:3px}
+.ch-m{font-size:0.58rem;color:#9ca3af;margin-top:3px}
+.lg{display:flex;gap:12px;font-size:0.7rem;color:#6b7280}
+.lg-d{width:8px;height:8px;border-radius:2px;display:inline-block;margin-right:4px}
 
 /* Table */
-.tb{width:100%;border-collapse:collapse;font-size:0.72rem}
-.tb th{text-align:left;padding:6px 8px;color:#9ca3af;font-weight:500;font-size:0.65rem;border-bottom:1px solid #f3f4f6}
-.tb td{padding:8px;border-bottom:1px solid #f9fafb;color:#374151}
-.tb-n{font-weight:600;color:#1a1a2e;font-size:0.75rem}
-.tb-c{font-size:0.65rem;color:#9ca3af}
-.badge{padding:2px 7px;border-radius:5px;font-size:0.62rem;font-weight:600}
+.tb{width:100%;border-collapse:collapse;font-size:0.75rem}
+.tb th{text-align:left;padding:8px 10px;color:#9ca3af;font-weight:500;font-size:0.68rem;border-bottom:1px solid #f3f4f6}
+.tb td{padding:10px;border-bottom:1px solid #f9fafb;color:#374151}
+.tb-n{font-weight:600;color:#1a1a2e;font-size:0.78rem}
+.tb-c{font-size:0.68rem;color:#9ca3af}
+.badge{padding:3px 8px;border-radius:5px;font-size:0.65rem;font-weight:600}
 
 /* Donut */
 .dn-w{display:flex;justify-content:center;margin:12px 0}
@@ -151,24 +160,61 @@ const DashboardPage: React.FC = () => {
 /* Expense list */
 .ex{display:flex;align-items:center;padding:5px 0}
 .ex-d{width:7px;height:7px;border-radius:50%;margin-right:7px;flex-shrink:0}
-.ex-p{font-size:0.65rem;color:#9ca3af;margin-right:10px;min-width:24px;font-weight:600}
-.ex-l{flex:1;font-size:0.75rem;color:#374151}
-.ex-a{font-size:0.78rem;font-weight:600;text-align:right}
+.ex-p{font-size:0.68rem;color:#9ca3af;margin-right:10px;min-width:24px;font-weight:600}
+.ex-l{flex:1;font-size:0.78rem;color:#374151}
+.ex-a{font-size:0.8rem;font-weight:600;text-align:right}
 
 /* Activity */
 .ac{display:flex;gap:8px;padding:6px 0}
 .ac-d{width:7px;height:7px;border-radius:50%;margin-top:5px;flex-shrink:0}
-.ac-t{flex:1;font-size:0.72rem;color:#374151;line-height:1.4}
+.ac-t{flex:1;font-size:0.75rem;color:#374151;line-height:1.4}
 .ac-u{font-weight:600;color:#1a1a2e}
-.ac-tm{font-size:0.62rem;color:#9ca3af;margin-top:1px}
+.ac-tm{font-size:0.65rem;color:#9ca3af;margin-top:1px}
+
+.stl{font-size:0.85rem;font-weight:700;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}
+.stl span{font-size:0.68rem;color:#16a34a;font-weight:500;cursor:pointer}
+.sub{font-size:0.68rem;color:#9ca3af}
+.big{font-size:1.2rem;font-weight:800;margin-bottom:8px}
+
+/* ── Responsive ── */
+
+/* Large: hide right panel */
+@media(max-width:1400px){
+.mn{grid-template-columns:260px 1fr}
+.rp{display:none}
+}
 
-.stl{font-size:0.82rem;font-weight:700;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}
-.stl span{font-size:0.65rem;color:#16a34a;font-weight:500;cursor:pointer}
-.sub{font-size:0.65rem;color:#9ca3af}
-.big{font-size:1.15rem;font-weight:800;margin-bottom:8px}
+/* Medium: hide left panel too, only center */
+@media(max-width:1100px){
+.mn{grid-template-columns:1fr}
+.lp{display:none}
+.sts{grid-template-columns:repeat(3,1fr)}
+}
 
-@media(max-width:1100px){.mn{grid-template-columns:1fr}.lp,.rp{display:none}}
-@media(max-width:768px){.sb{display:none}.mn{margin-left:0}.sts{grid-template-columns:1fr}}
+/* Tablet: hide sidebar, show mobile header */
+@media(max-width:768px){
+.sb{display:none}
+.mn{margin-left:0;width:100%}
+.mob-bar{display:flex}
+.cp{padding:16px}
+.sts{grid-template-columns:repeat(2,1fr)}
+.search{width:140px}
+.hdr{flex-wrap:wrap}
+.hdr h1{display:none}
+.tb th:nth-child(4),.tb td:nth-child(4){display:none}
+}
+
+/* Mobile: single column everything */
+@media(max-width:480px){
+.sts{grid-template-columns:1fr}
+.cp{padding:12px}
+.cd{padding:12px}
+.hdr-right{flex-wrap:wrap}
+.search{width:100%}
+.st-v{font-size:1.1rem}
+.ch{height:120px}
+.tb th:nth-child(3),.tb td:nth-child(3){display:none}
+}
 `}} />
 
 			{/* Sidebar */}
@@ -191,6 +237,13 @@ const DashboardPage: React.FC = () => {
 				</div>
 			</aside>
 
+			{/* Mobile header bar */}
+			<div className="mob-bar">
+				<div className="mob-bar-btn" onClick={() => setActiveNav(activeNav)}>☰</div>
+				<h1>Dashboard</h1>
+				<div className="uav">AF</div>
+			</div>
+
 			<div className="mn">
 				{/* Left Panel */}
 				<div className="lp">
@@ -233,7 +286,7 @@ const DashboardPage: React.FC = () => {
 				<div className="cp">
 					<div className="hdr">
 						<h1>Dashboard</h1>
-						<div style={{ display: "flex", alignItems: "center", gap: "10px" }}>
+						<div className="hdr-right">
 							<input className="search" placeholder="Search placeholder" />
 							<div className="uav">AF</div>
 							<span style={{ fontSize: "0.82rem", fontWeight: 600 }}>Andrew Forbist</span>

package/dist/templates/app/shared/RouterContext.tsx

@@ -16,6 +16,7 @@ import React, {
 	useRef,
 } from "react";
 import { matchRoute, type RouteDef } from "./router";
+import { BlumenErrorBoundary } from "./ErrorBoundary";
 
 // ── Context types ──────────────────────────────────────────────
 
@@ -169,7 +170,9 @@ export function RouterProvider({
 			<div
 				className={`page-transition ${transitioning ? "page-transition-exit" : "page-transition-active"}`}
 			>
-				<App Component={PageComponent} pageProps={pageProps} />
+				<BlumenErrorBoundary>
+					<App Component={PageComponent} pageProps={pageProps} />
+				</BlumenErrorBoundary>
 			</div>
 		</RouterContext.Provider>
 	);

package/dist/templates/go-server/cache.go

@@ -0,0 +1,147 @@
+package main
+
+import (
+	"crypto/sha256"
+	"encoding/hex"
+	"sync"
+	"time"
+)
+
+// CacheEntry represents a single cached page response.
+type CacheEntry struct {
+	HTML       string
+	ETag       string
+	CreatedAt  time.Time
+	Revalidate int // TTL in seconds; 0 = cache forever until evicted
+	Stale      bool
+}
+
+// PageCache is a thread-safe in-memory LRU cache for rendered HTML pages.
+// It uses sync.RWMutex for maximum concurrent read performance —
+// thousands of goroutines can read simultaneously while writes are serialized.
+type PageCache struct {
+	mu       sync.RWMutex
+	entries  map[string]*CacheEntry
+	order    []string // LRU order: most recently used at end
+	maxSize  int
+}
+
+// NewPageCache creates a new cache with the given maximum number of entries.
+func NewPageCache(maxSize int) *PageCache {
+	return &PageCache{
+		entries: make(map[string]*CacheEntry),
+		order:   make([]string, 0, maxSize),
+		maxSize: maxSize,
+	}
+}
+
+// Get retrieves a cached page. Returns the entry and whether it was found.
+// Also returns whether the entry is stale (past its revalidate TTL).
+func (c *PageCache) Get(key string) (entry *CacheEntry, found bool, stale bool) {
+	c.mu.RLock()
+	e, ok := c.entries[key]
+	c.mu.RUnlock()
+
+	if !ok {
+		return nil, false, false
+	}
+
+	// Check if the entry has expired
+	if e.Revalidate > 0 {
+		age := time.Since(e.CreatedAt).Seconds()
+		if age > float64(e.Revalidate) {
+			return e, true, true // Found but stale
+		}
+	}
+
+	// Move to end of LRU order (most recently used)
+	c.mu.Lock()
+	c.moveToEnd(key)
+	c.mu.Unlock()
+
+	return e, true, false
+}
+
+// Set stores a page in the cache with the given revalidation TTL.
+func (c *PageCache) Set(key string, html string, revalidate int) {
+	etag := generateETag(html)
+
+	c.mu.Lock()
+	defer c.mu.Unlock()
+
+	// If entry exists, update it
+	if _, exists := c.entries[key]; exists {
+		c.entries[key] = &CacheEntry{
+			HTML:       html,
+			ETag:       etag,
+			CreatedAt:  time.Now(),
+			Revalidate: revalidate,
+		}
+		c.moveToEnd(key)
+		return
+	}
+
+	// Evict LRU entry if at capacity
+	if len(c.entries) >= c.maxSize && len(c.order) > 0 {
+		oldest := c.order[0]
+		c.order = c.order[1:]
+		delete(c.entries, oldest)
+	}
+
+	// Add new entry
+	c.entries[key] = &CacheEntry{
+		HTML:       html,
+		ETag:       etag,
+		CreatedAt:  time.Now(),
+		Revalidate: revalidate,
+	}
+	c.order = append(c.order, key)
+}
+
+// Invalidate removes a specific key from the cache.
+func (c *PageCache) Invalidate(key string) {
+	c.mu.Lock()
+	defer c.mu.Unlock()
+
+	delete(c.entries, key)
+	for i, k := range c.order {
+		if k == key {
+			c.order = append(c.order[:i], c.order[i+1:]...)
+			break
+		}
+	}
+}
+
+// Clear removes all entries from the cache.
+func (c *PageCache) Clear() {
+	c.mu.Lock()
+	defer c.mu.Unlock()
+
+	c.entries = make(map[string]*CacheEntry)
+	c.order = make([]string, 0, c.maxSize)
+}
+
+// Size returns the current number of cached entries.
+func (c *PageCache) Size() int {
+	c.mu.RLock()
+	defer c.mu.RUnlock()
+	return len(c.entries)
+}
+
+// moveToEnd moves a key to the end of the LRU order (most recently used).
+// Must be called with the write lock held.
+func (c *PageCache) moveToEnd(key string) {
+	for i, k := range c.order {
+		if k == key {
+			c.order = append(c.order[:i], c.order[i+1:]...)
+			c.order = append(c.order, key)
+			return
+		}
+	}
+}
+
+// generateETag creates an ETag from the HTML content.
+func generateETag(content string) string {
+	hash := sha256.Sum256([]byte(content))
+	return `"` + hex.EncodeToString(hash[:8]) + `"`
+}

package/dist/templates/go-server/image.go

@@ -0,0 +1,200 @@
+package main
+
+import (
+	"bytes"
+	"crypto/sha256"
+	"encoding/hex"
+	"fmt"
+	"image"
+	"image/jpeg"
+	"image/png"
+	"log"
+	"net/http"
+	"os"
+	"path/filepath"
+	"strconv"
+	"strings"
+
+	"golang.org/x/image/draw"
+)
+
+const (
+	imageCacheDir  = ".blumen/image-cache"
+	maxImageWidth  = 4096
+	defaultQuality = 80
+)
+
+func init() {
+	// Ensure cache directory exists
+	os.MkdirAll(imageCacheDir, 0755)
+}
+
+// ImageHandler serves optimized images with on-the-fly resizing and caching.
+// URL: /_blumen/image?src=/static/hero.jpg&w=800&q=80&blur=1
+func ImageHandler() http.HandlerFunc {
+	return func(w http.ResponseWriter, r *http.Request) {
+		if r.Method != http.MethodGet {
+			http.Error(w, "Method not allowed", http.StatusMethodNotAllowed)
+			return
+		}
+
+		q := r.URL.Query()
+		src := q.Get("src")
+		widthStr := q.Get("w")
+		qualityStr := q.Get("q")
+		isBlur := q.Get("blur") == "1"
+
+		if src == "" {
+			http.Error(w, "Missing 'src' parameter", http.StatusBadRequest)
+			return
+		}
+
+		// Parse width
+		targetWidth := 0
+		if widthStr != "" {
+			var err error
+			targetWidth, err = strconv.Atoi(widthStr)
+			if err != nil || targetWidth <= 0 || targetWidth > maxImageWidth {
+				http.Error(w, "Invalid 'w' parameter", http.StatusBadRequest)
+				return
+			}
+		}
+
+		// Parse quality
+		quality := defaultQuality
+		if qualityStr != "" {
+			var err error
+			quality, err = strconv.Atoi(qualityStr)
+			if err != nil || quality < 1 || quality > 100 {
+				quality = defaultQuality
+			}
+		}
+
+		// Security: resolve the source path and ensure it's within the project
+		cleanSrc := strings.TrimPrefix(src, "/")
+		absPath, err := filepath.Abs(cleanSrc)
+		if err != nil {
+			http.Error(w, "Invalid path", http.StatusBadRequest)
+			return
+		}
+
+		// Ensure path is within the project directory
+		cwd, _ := os.Getwd()
+		if !strings.HasPrefix(absPath, cwd) {
+			http.Error(w, "Access denied", http.StatusForbidden)
+			return
+		}
+
+		// Check if file exists
+		if _, err := os.Stat(absPath); os.IsNotExist(err) {
+			http.Error(w, "Image not found", http.StatusNotFound)
+			return
+		}
+
+		// Generate cache key
+		cacheKey := generateCacheKey(src, targetWidth, quality, isBlur)
+		cachePath := filepath.Join(imageCacheDir, cacheKey+".jpg")
+
+		// Check disk cache
+		if cachedData, err := os.ReadFile(cachePath); err == nil {
+			serveCachedImage(w, cachedData)
+			return
+		}
+
+		// Process the image
+		processedData, err := processImage(absPath, targetWidth, quality, isBlur)
+		if err != nil {
+			log.Printf("Image processing error: %v", err)
+			http.ServeFile(w, r, absPath)
+			return
+		}
+
+		// Write to disk cache
+		os.WriteFile(cachePath, processedData, 0644)
+
+		// Serve the processed image
+		serveCachedImage(w, processedData)
+	}
+}
+
+func generateCacheKey(src string, width, quality int, blur bool) string {
+	data := fmt.Sprintf("%s-%d-%d-%v", src, width, quality, blur)
+	hash := sha256.Sum256([]byte(data))
+	return hex.EncodeToString(hash[:16])
+}
+
+func serveCachedImage(w http.ResponseWriter, data []byte) {
+	w.Header().Set("Content-Type", "image/jpeg")
+	w.Header().Set("Cache-Control", "public, max-age=31536000, immutable")
+	w.Header().Set("X-Blumen-Image", "optimized")
+	w.Header().Set("Content-Length", strconv.Itoa(len(data)))
+	w.WriteHeader(http.StatusOK)
+	w.Write(data)
+}
+
+func processImage(filePath string, targetWidth, quality int, blur bool) ([]byte, error) {
+	file, err := os.Open(filePath)
+	if err != nil {
+		return nil, fmt.Errorf("open image: %w", err)
+	}
+	defer file.Close()
+
+	img, format, err := image.Decode(file)
+	if err != nil {
+		return nil, fmt.Errorf("decode image (%s): %w", format, err)
+	}
+
+	bounds := img.Bounds()
+	origWidth := bounds.Dx()
+	origHeight := bounds.Dy()
+
+	// Calculate target dimensions maintaining aspect ratio
+	newWidth := origWidth
+	newHeight := origHeight
+
+	if targetWidth > 0 && targetWidth < origWidth {
+		ratio := float64(targetWidth) / float64(origWidth)
+		newWidth = targetWidth
+		newHeight = int(float64(origHeight) * ratio)
+	}
+
+	// Resize using high-quality bilinear interpolation
+	resized := image.NewRGBA(image.Rect(0, 0, newWidth, newHeight))
+	draw.BiLinear.Scale(resized, resized.Bounds(), img, bounds, draw.Over, nil)
+
+	// For blur placeholders, downscale aggressively
+	var finalImg image.Image = resized
+	if blur {
+		blurWidth := 20
+		if newWidth < blurWidth {
+			blurWidth = newWidth
+		}
+		blurHeight := int(float64(newHeight) * (float64(blurWidth) / float64(newWidth)))
+		if blurHeight < 1 {
+			blurHeight = 1
+		}
+		blurred := image.NewRGBA(image.Rect(0, 0, blurWidth, blurHeight))
+		draw.BiLinear.Scale(blurred, blurred.Bounds(), resized, resized.Bounds(), draw.Over, nil)
+		finalImg = blurred
+	}
+
+	// Encode to JPEG
+	var buf bytes.Buffer
+
+	jpegQuality := quality
+	if blur {
+		jpegQuality = 30
+	}
+
+	err = jpeg.Encode(&buf, finalImg, &jpeg.Options{Quality: jpegQuality})
+	if err != nil {
+		return nil, fmt.Errorf("encode jpeg: %w", err)
+	}
+
+	return buf.Bytes(), nil
+}
+
+// Ensure PNG decoder is registered
+func init() {
+	_ = png.Decode
+}