managarten/apps-archived/memoro/apps/landing/docs/features/netlify-functions-vs-vps-comparison.md

Netlify Functions vs. Hetzner VPS - Vergleich für Replicate Integration

🎯 Übersicht

Vergleich zwischen Netlify Functions (Serverless) und Hetzner VPS (Self-Hosted) für die Replicate API Integration.

💰 Kostenvergleich

Netlify Functions

Free Tier:

• 125.000 Requests/Monat
• 100 Stunden Compute-Zeit/Monat
• Perfekt für Development & kleine Projekte

Pro Tier ($19/Monat):

• 1 Million Requests/Monat
• 1000 Stunden Compute-Zeit

Kosten für Replicate Bildgenerierung:

• Replicate API: ~$0.01 pro 4 Bilder
• Netlify Functions: GRATIS im Free Tier
• Gesamtkosten: Nur Replicate-Nutzung (~$1-10/Monat)

Hetzner VPS + Coolify

CPX31 Server:

• €22/Monat (16GB RAM, 4 vCPUs)
• Unbegrenzte Requests
• Kann mehrere Services hosten

Zusatzkosten:

• Domain/SSL: €0 (Let's Encrypt)
• Backup: €2/Monat
• Gesamtkosten: €24/Monat + Replicate

🚀 Implementierungsvergleich

Option 1: Netlify Functions (EMPFOHLEN) ⭐

Implementierung:

// netlify/functions/generate-persona-image.js
import Replicate from 'replicate';

export async function handler(event, context) {
	// CORS Headers
	if (event.httpMethod === 'OPTIONS') {
		return {
			statusCode: 200,
			headers: {
				'Access-Control-Allow-Origin': '*',
				'Access-Control-Allow-Headers': 'Content-Type, X-API-Key',
				'Access-Control-Allow-Methods': 'POST, OPTIONS',
			},
		};
	}

	// Check API Key
	const apiKey = event.headers['x-api-key'];
	if (apiKey !== process.env.API_KEY) {
		return {
			statusCode: 401,
			body: JSON.stringify({ error: 'Unauthorized' }),
		};
	}

	// Parse request
	const { personaData, prompt, style = 'portrait', count = 4 } = JSON.parse(event.body);

	// Initialize Replicate
	const replicate = new Replicate({
		auth: process.env.REPLICATE_API_TOKEN,
	});

	try {
		// Generate images
		const output = await replicate.run(
			'stability-ai/sdxl:39ed52f2a78e934b3ba6e2a89f5b1c712de7dfea535525255b1aa35c5565e08b',
			{
				input: {
					prompt: prompt || buildPromptFromPersona(personaData, style),
					negative_prompt: 'ugly, distorted, blurry, low quality',
					width: 1024,
					height: 1024,
					num_outputs: count,
					scheduler: 'K_EULER',
					num_inference_steps: 30,
					guidance_scale: 7.5,
				},
			}
		);

		return {
			statusCode: 200,
			headers: {
				'Content-Type': 'application/json',
				'Access-Control-Allow-Origin': '*',
			},
			body: JSON.stringify({
				success: true,
				images: output,
			}),
		};
	} catch (error) {
		return {
			statusCode: 500,
			body: JSON.stringify({
				success: false,
				error: error.message,
			}),
		};
	}
}

function buildPromptFromPersona(personaData, style) {
	// Prompt building logic
	const { appearance, demographics, professional } = personaData;
	// ... (same as before)
}

Setup:

# 1. Install Netlify CLI
npm install -g netlify-cli

# 2. Create netlify.toml
cat > netlify.toml << EOF
[build]
  command = "npm run build"
  publish = "dist"

[functions]
  directory = "netlify/functions"

[build.environment]
  NODE_VERSION = "20"
EOF

# 3. Add environment variables in Netlify UI
# REPLICATE_API_TOKEN = "..."
# API_KEY = "..."

# 4. Deploy
netlify deploy --prod

Frontend Integration bleibt gleich:

// Nur API URL ändern
const API_URL = '/.netlify/functions';
// Statt: const API_URL = 'http://localhost:3001/api';

Option 2: Vercel Functions (Alternative)

Ähnlich wie Netlify:

• Free Tier: 100GB-Hrs/Monat
• Pro: $20/Monat
• Edge Functions möglich
• Bessere TypeScript-Unterstützung

// api/generate-persona-image.ts
import { VercelRequest, VercelResponse } from '@vercel/node';

export default async function handler(req: VercelRequest, res: VercelResponse) {
	// Similar implementation
}

Option 3: Astro SSR mit API Routes (Neu in Astro 4.0)

In deinem bestehenden Projekt:

// src/pages/api/generate-persona-image.ts
import type { APIRoute } from 'astro';
import Replicate from 'replicate';

export const POST: APIRoute = async ({ request }) => {
	const data = await request.json();
	// Implementation
	return new Response(JSON.stringify(result), {
		status: 200,
		headers: {
			'Content-Type': 'application/json',
		},
	});
};

📊 Entscheidungsmatrix

Kriterium	Netlify Functions	Hetzner VPS	Gewichtung
Kosten	⭐⭐⭐⭐⭐ (€0-19/Mo)	⭐⭐ (€24/Mo)	30%
Einfachheit	⭐⭐⭐⭐⭐	⭐⭐	25%
Skalierbarkeit	⭐⭐⭐⭐	⭐⭐⭐	15%
Kontrolle	⭐⭐	⭐⭐⭐⭐⭐	10%
Performance	⭐⭐⭐⭐	⭐⭐⭐⭐	10%
Wartung	⭐⭐⭐⭐⭐ (keine)	⭐⭐ (manuell)	10%

Gewinner: Netlify Functions 🏆

🎯 Empfehlung

Für dein Memoro-Projekt: Netlify Functions

Warum:

1. Kostenlos für Development und kleine Nutzung
2. Zero DevOps - kein Server-Management
3. Automatisches Scaling - zahle nur was du nutzt
4. 5 Minuten Setup vs. Stunden für VPS
5. Integriert mit deinem bestehenden Netlify Hosting

Migrations-Pfad:

# Phase 1: Development (JETZT)
Netlify Functions Free Tier
- Test mit echten Usern
- Kosten: €0 + Replicate

# Phase 2: Growth (100+ Personas/Monat)
Netlify Functions Pro
- Kosten: €19/Monat + Replicate

# Phase 3: Scale (1000+ Personas/Monat)
Evaluiere Hetzner VPS für mehrere Services
- Kosten: €24/Monat + Replicate

🚀 Quick Start mit Netlify Functions

1. Erstelle Function-Datei:

mkdir -p netlify/functions
touch netlify/functions/generate-persona-image.js

2. Kopiere Code von oben

3. Environment Variables in Netlify:

Site Settings > Environment Variables:
- REPLICATE_API_TOKEN
- API_KEY

4. Deploy:

git add .
git commit -m "Add Netlify Function for image generation"
git push

5. Fertig! 🎉

💡 Pro-Tipps

Bildoptimierung mit Netlify:

// Nutze Netlify Image CDN für generierte Bilder
const optimizedUrl = `/.netlify/images?url=${imageUrl}&w=1024&q=80`;

Caching Strategy:

// Cache Replicate responses in Netlify Blobs (Free)
import { getStore } from '@netlify/blobs';

const store = getStore('persona-images');
await store.set(personaId, imageUrls);

Rate Limiting:

// Nutze Netlify Edge Functions für Rate Limiting
export const config = {
	path: '/api/generate-image',
	rateLimit: {
		windowMs: 60000, // 1 minute
		max: 5, // 5 requests per minute
	},
};

📈 Kosten-Beispielrechnung

Szenario: 50 Personas pro Monat

Service	Netlify Functions	Hetzner VPS
Hosting	€0 (Free Tier)	€24
Replicate	€0.50	€0.50
Zeit-Investment	5 Minuten	2-4 Stunden
Total	€0.50	€24.50

Szenario: 500 Personas pro Monat

Service	Netlify Functions	Hetzner VPS
Hosting	€19 (Pro)	€24
Replicate	€5	€5
Total	€24	€29

🏁 Fazit

Netlify Functions ist die beste Wahl für dein Projekt:

✅ Sofort einsatzbereit - keine Server-Konfiguration ✅ Kosteneffizient - zahle nur was du nutzt
✅ Automatisches Scaling - keine Sorgen bei Traffic-Spitzen ✅ Integriert - funktioniert nahtlos mit Astro ✅ Zukunftssicher - einfache Migration wenn nötig

Hetzner VPS nur wenn:

• Du mehrere Backend-Services brauchst
• Du volle Kontrolle willst
• Du bereits DevOps-Erfahrung hast
• Du >1000 Requests/Tag erwartest

---

Empfehlung: Starte mit Netlify Functions Free Tier und skaliere bei Bedarf.