TYPO3 CMS Enterprise Development
TYPO3 ist das führende Open-Source Enterprise CMS im DACH-Raum und bietet mit Version 13 LTS eine moderne, Composer-basierte Architektur. Die Entwicklung erfolgt über Site Packages, die als eigenständige Composer-Pakete Templates, TypoScript, Fluid-Partials und Backend-Layouts bündeln. TYPO3 v13 setzt konsequent auf Symfony-Komponenten, Dependency Injection und das neue Site Set System für modulare Konfigurationen.
- Site-Package-Architektur: Ein TYPO3 Site Package folgt der Verzeichnisstruktur
packages/my-sitepackage/mitConfiguration/(TypoScript, TCA, Sets),Resources/Private/(Fluid Templates, Layouts, Partials) undResources/Public/(CSS, JS, Images). Die Registrierung erfolgt übercomposer.jsonmit"type": "typo3-cms-extension"und einem Repository-Eintrag vom Typpath. Site Sets inConfiguration/Sets/ersetzen die klassischeext_localconf.php-basierte TypoScript-Inclusion. - Fluid-Templating: Fluid ist die Template-Engine von TYPO3, die eine strikte Trennung von Logik und Präsentation ermöglicht. ViewHelper wie
<f:cObject>,<f:render>und<f:uri.resource>binden dynamische Inhalte ein. Custom ViewHelper werden als PHP-Klassen implementiert und über Namespaces (xmlns:custom="...") registriert. Best Practice: Layouts definieren das Seitengerüst, Templates die seitentyp-spezifische Struktur, Partials wiederverwendbare Komponenten. - Middleware & PSR-15: TYPO3 v13 nutzt die PSR-15 Middleware-Pipeline für HTTP-Request-Verarbeitung. Eigene Middlewares werden in
Configuration/RequestMiddlewares.phpregistriert und können Requests vor oder nach dem TYPO3-Core verarbeiten. Typische Anwendungsfälle: Custom-Authentication, IP-basierte Zugriffskontrolle, Response-Header-Manipulation und Caching-Strategien. Die Registrierung erfolgt mit'before'/'after'-Constraints zur Positionierung in der Pipeline. - Content Blocks & Structured Content: TYPO3 v13 unterstützt Content Blocks als modernere Alternative zu klassischen Content Elements. Diese werden deklarativ über YAML und Fluid definiert, ohne TCA/SQL-Boilerplate. Für komplexe Projekte bleibt die manuelle Content-Element-Erstellung via
ext_tables.sql(Datenbankfelder), TCA-Konfiguration (Backend-Formulare) und TypoScript (tt_content.myElement) die flexiblere Option.
PHP 8.x Performance & Best Practices
PHP 8.4 bringt mit Property Hooks, asymmetrischer Visibility und dem JIT-Compiler erhebliche Performance-Verbesserungen. Im TYPO3-Kontext ist die korrekte Konfiguration von OPcache, Realpath-Cache und Session-Handling entscheidend für die Antwortzeiten. Eine optimierte php.ini kann die Time-to-First-Byte (TTFB) um 40–60 % reduzieren.
- OPcache-Tuning: Für Produktionsumgebungen empfehlen wir:
opcache.enable=1,opcache.memory_consumption=256,opcache.max_accelerated_files=20000,opcache.validate_timestamps=0(Deployment-basiertes Cache-Clearing via Apache-Restart) undopcache.jit_buffer_size=128M. Der JIT-Compiler (Tracing-Modus:opcache.jit=tracing) optimiert rechenintensive Operationen, bietet aber bei I/O-lastigen CMS-Anwendungen nur moderate Verbesserungen. - Preloading: PHP Preloading lädt häufig genutzte Klassen beim Server-Start in den OPcache. TYPO3 bietet ein Preload-Script unter
vendor/typo3/cms-core/Resources/PHP/ClassAliasMapPreloader.php. Die Konfiguration inphp.ini:opcache.preload=/var/www/html/vendor/autoload.phpundopcache.preload_user=www-data. Achtung: Änderungen an preloaded Klassen erfordern einen PHP-FPM/Apache-Restart. - Fehlerbehandlung & Logging: Produktionsumgebungen setzen
display_errors=Off,log_errors=Onunderror_reporting=E_ALL. TYPO3 nutzt PSR-3 (Monolog) für strukturiertes Logging. Die Konfiguration inconfig/system/additional.phpermöglicht channel-basiertes Logging:$GLOBALS['TYPO3_CONF_VARS']['LOG']['writerConfiguration']mit FileWriter (Produktion) oder StreamWriter (Docker/stdout). - Memory & Session Management: Für TYPO3-Backend-Operationen (Imports, Datei-Verarbeitung) wird
memory_limit=512Mempfohlen, CLI-Skripte benötigen ggf.-d memory_limit=2G. Sessions werden viasession.save_handler=redisundsession.save_path="tcp://127.0.0.1:6379"in Redis ausgelagert, um bei Load-Balancing Session-Stickiness zu vermeiden.
Frontend-Technologien
Moderne Webentwicklung erfordert einen durchdachten Frontend-Stack, der Performance, Wartbarkeit und Barrierefreiheit vereint. Die Kombination aus React für interaktive Komponenten, TypeScript für Typsicherheit und Tailwind CSS für utility-basiertes Styling hat sich als Enterprise-Standard etabliert. Im TYPO3-Kontext werden diese Technologien über Build-Pipelines (Vite/esbuild) in das Site Package integriert.
- React & TypeScript: React 19 mit Server Components ermöglicht hybrides Rendering (SSR + Client). TypeScript 5.x mit
strict: truein dertsconfig.jsonerzwingt vollständige Typsicherheit. Interface-Definitionen für API-Responses und Component-Props verhindern Runtime-Fehler. Build-Tooling: Vite (vite build --mode production) mitrollupOptions.output.manualChunksfür Code-Splitting nach Route. - Tailwind CSS & Design Systems: Tailwind CSS 4 mit dem neuen CSS-first-Ansatz ersetzt die
tailwind.config.jsdurch native@theme-Direktiven in CSS. Für TYPO3 Site Packages wird Tailwind über PostCSS integriert:@import "tailwindcss"in der Haupt-CSS-Datei, PurgeCSS scanntResources/Private/**/*.htmlfür verwendete Klassen. Custom Design Tokens werden als CSS Custom Properties (--color-primary) definiert und in Tailwind via@themereferenziert. - Web Components & Stencil: Für framework-agnostische UI-Komponenten setzen wir auf Web Components mit Stencil.js. Diese Custom Elements (
<itzu-accordion>,<itzu-modal>) funktionieren in jedem CMS und Framework. Shadow DOM kapselt Styles, Slots ermöglichen flexible Content-Projektion. Die Kompilierung erzeugt Lazy-Loading-fähige Bundles mit automatischer Polyfill-Erkennung. - Barrierefreiheit (WCAG 2.1): Alle Frontend-Komponenten erfüllen WCAG 2.1 Level AA. Checkliste: semantisches HTML (
<nav>,<main>,<article>), ARIA-Attribute für dynamische Inhalte (aria-live="polite",aria-expanded), Farbkontrast-Ratio ≥ 4.5:1 (Text) / 3:1 (großer Text), Tastaturbedienbarkeit (Focus-Management, Skip-Links) undprefers-reduced-motion-Media-Query für Animationen.
CI/CD Pipelines
Continuous Integration und Continuous Deployment automatisieren den gesamten Entwicklungszyklus von Code-Commit bis Produktions-Deployment. Für TYPO3-Projekte umfasst die Pipeline statische Code-Analyse, Unit-Tests, Frontend-Build, Datenbankmigrationen und Zero-Downtime-Deployment. Die Wahl zwischen GitHub Actions und GitLab CI hängt von der bestehenden Infrastruktur und den Compliance-Anforderungen ab.
- GitHub Actions: Workflows werden in
.github/workflows/als YAML definiert. Ein typischer TYPO3-Workflow umfasst: Matrix-Build (PHP 8.3/8.4, PostgreSQL/MariaDB),composer install --no-dev --optimize-autoloader, PHPStan (vendor/bin/phpstan analyse -l 8), PHP-CS-Fixer (--dry-run --diff), PHPUnit mit Coverage-Report und Deployment viarsyncoderdeployer. Secrets werden übersecrets.DEPLOY_KEYverwaltet. - GitLab CI: Die
.gitlab-ci.ymldefiniert Stages (lint, test, build, deploy) mit Docker-Runnern. Vorteil gegenüber GitHub Actions: integrierte Container Registry ($CI_REGISTRY_IMAGE), Review-Apps für Merge-Requests und Self-Hosted-Runner für Compliance-Anforderungen. TYPO3-spezifisch: eindeploy:production-Job nutztdeployer deploy productionmitwhen: manualfür kontrollierte Releases. - Deployer (PHP): Deployer ist das Standard-Tool für PHP-Deployments und unterstützt Zero-Downtime via Symlink-basiertem Release-Management. Die
deploy.phpdefiniert:set('repository', 'git@...'),set('shared_dirs', ['var/log', 'public/fileadmin']),set('writable_dirs', ['var', 'public/typo3temp']). Post-Deploy-Tasks:typo3 cache:flush,typo3 extension:setup,typo3 cache:warmup. Rollback:dep rollback productionstellt den vorherigen Release-Symlink wieder her. - Feature Flags & Canary Releases: Feature Flags ermöglichen die Trennung von Deployment und Release. TYPO3-Feature-Toggles werden in
config/system/settings.phpunter$GLOBALS['TYPO3_CONF_VARS']['SYS']['features']konfiguriert. Für granulare Steuerung nutzen wir Unleash oder Flagsmith als Feature-Flag-Service mit PHP-SDK-Integration. Canary Releases werden über gewichtetes Routing im Load Balancer (z. B. 5 % auf v2, 95 % auf v1) realisiert.
Web Performance Optimierung
Web Performance ist ein direkter Ranking-Faktor (Google Core Web Vitals) und beeinflusst Conversion-Raten maßgeblich — jede 100 ms zusätzliche Ladezeit kann die Conversion um bis zu 7 % senken. Die Optimierung umfasst Server-seitige Maßnahmen (Caching, Kompression), Netzwerk-Optimierung (CDN, HTTP/3) und Client-seitige Strategien (Lazy Loading, Critical CSS, Resource Hints).
- Core Web Vitals: LCP (Largest Contentful Paint) < 2,5s, FID/INP (Interaction to Next Paint) < 200ms, CLS (Cumulative Layout Shift) < 0,1. LCP-Optimierung: Hero-Image per
<link rel="preload" as="image">vorladen, serverseitiges Caching (TYPO3 Page Cache + Redis Backend). INP-Optimierung: Long Tasks aufbrechen viarequestIdleCallback()undscheduler.yield(). CLS: explizitewidth/heightauf<img>und<video>,font-display: optionalfür Web Fonts. - CDN & Edge Caching: Cloudflare oder Fastly als CDN cachen statische Assets (CSS, JS, Images) an Edge-Standorten weltweit. Die Konfiguration erfolgt über Cache-Control-Header:
Cache-Control: public, max-age=31536000, immutablefür versionierte Assets,Cache-Control: public, max-age=3600, stale-while-revalidate=86400für HTML. Cloudflare Workers ermöglichen Edge-seitige Logik (A/B-Tests, Geo-Routing). - Bildoptimierung: Moderne Bildformate (WebP, AVIF) reduzieren die Dateigröße um 30–50 % gegenüber JPEG. TYPO3 v13 unterstützt WebP-Konvertierung nativ über ImageMagick/GraphicsMagick. Die
<picture>-Element-Strategie:<source type="image/avif">,<source type="image/webp">,<img src="fallback.jpg">. Responsive Images übersrcsetundsizesliefern größenoptimierte Varianten. - HTTP/3 & Kompression: HTTP/3 (QUIC) eliminiert Head-of-Line-Blocking und beschleunigt den Verbindungsaufbau durch 0-RTT-Handshake. Die Apache-Konfiguration nutzt
mod_http2(HTTP/2) mitProtocols h2 h2c http/1.1. Brotli-Kompression (mod_brotli) erzielt 15–25 % bessere Kompressionsraten als gzip:AddOutputFilterByType BROTLI_COMPRESS text/html text/css application/javascript application/json.
Security Headers & OWASP Top 10
Websicherheit erfordert einen Defense-in-Depth-Ansatz, der Server-Konfiguration, Anwendungscode und HTTP-Header umfasst. Die OWASP Top 10 (2021) definieren die kritischsten Schwachstellen — von Broken Access Control über Injection bis zu Security Misconfiguration. Eine korrekte Header-Konfiguration schützt vor XSS, Clickjacking, MIME-Sniffing und Daten-Exfiltration.
- Security Headers: Essenzielle HTTP-Header für Apache (
.htaccessoderhttpd.conf):Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-{random}'; style-src 'self' 'unsafe-inline',Strict-Transport-Security: max-age=63072000; includeSubDomains; preload,X-Content-Type-Options: nosniff,X-Frame-Options: DENY,Referrer-Policy: strict-origin-when-cross-originundPermissions-Policy: camera=(), microphone=(), geolocation=(). - OWASP A01 — Broken Access Control: TYPO3 bietet ein granulares Berechtigungssystem mit Backend-Gruppen, Page-TSconfig und User-TSconfig. Kritische Maßnahmen:
$GLOBALS['TYPO3_CONF_VARS']['BE']['lockSSL'] = true, IP-basierte Backend-Zugriffsbeschränkung via[BE][IPmaskList], Zwei-Faktor-Authentifizierung (TOTP) für alle Admin-Accounts und regelmäßige Audits derbe_groups-Berechtigungen. - OWASP A03 — Injection: SQL-Injection wird in TYPO3 durch die Doctrine DBAL Query Builder API verhindert:
$queryBuilder->createNamedParameter($value)statt String-Konkatenation. XSS-Prävention: Fluid-ViewHelper escapen standardmäßig ({variable}= escaped,{variable -> f:format.raw()}= unescaped — nur bei vertrauenswürdigem Content). CSP-Nonces für Inline-Scripts:<script nonce="{nonce}">. - Dependency Scanning & WAF: Automatisierte Schwachstellen-Erkennung in der CI/CD-Pipeline:
composer audit(PHP-Abhängigkeiten),npm audit(Node.js), Snyk oder Dependabot für kontinuierliches Monitoring. Zusätzlich wird ModSecurity als Web Application Firewall (WAF) mit dem OWASP Core Rule Set (CRS) eingesetzt:SecRuleEngine Onmit Detection-Mode im Staging und Prevention-Mode in Produktion.
API-Entwicklung
APIs sind das Rückgrat moderner Webanwendungen und ermöglichen die Entkopplung von Frontend und Backend, die Integration externer Dienste und die Bereitstellung mobiler Apps. Die Wahl zwischen REST und GraphQL hängt vom Anwendungsfall ab: REST für standardisierte CRUD-Operationen, GraphQL für flexible Datenabfragen mit variablen Datenanforderungen.
- REST-API-Design: RESTful APIs folgen den Prinzipien: ressourcenbasierte URLs (
/api/v1/customers/{id}/orders), HTTP-Verben (GET/POST/PUT/PATCH/DELETE), HATEOAS-Links in Responses und konsistente Fehler-Responses ({"error": {"code": 422, "message": "..."}}). Versionierung über URL-Prefix (/api/v1/) oder Header (Accept: application/vnd.itzu.v1+json). Rate-Limiting:X-RateLimit-Limit: 1000,X-RateLimit-Remaining: 999. - GraphQL: GraphQL ermöglicht präzise Datenabfragen ohne Over-/Under-Fetching. Schema-Definition:
type Query { customer(id: ID!): Customer }mit Resolvern in PHP (webonyx/graphql-php) oder Node.js (Apollo Server). Sicherheitsmaßnahmen: Query-Depth-Limiting (max_depth: 7), Query-Complexity-Analyse und Persisted Queries über APQ (Automatic Persisted Queries) zur DDoS-Prävention. - Authentifizierung & Autorisierung: API-Authentifizierung über OAuth 2.0 mit PKCE (Proof Key for Code Exchange) für SPAs und mobile Apps. JWT-Tokens (RS256-signiert) mit kurzer Laufzeit (15 Min.) und Refresh-Tokens (httpOnly Cookie, 7 Tage). TYPO3 API-Endpoints werden über PSR-15 Middleware gesichert: Token-Validierung, Scope-Prüfung und Rate-Limiting pro API-Key.
- API-Dokumentation & Testing: OpenAPI 3.1 (Swagger) spezifiziert die API maschinenlesbar. Die Spec wird aus PHP-Attributen generiert (nelmio/api-doc-bundle) und über Swagger UI bereitgestellt. API-Tests mit Postman/Newman (Collection Runner) oder PHPUnit mit HTTP-Client. Contract-Testing via Pact stellt die Kompatibilität zwischen Frontend und Backend sicher. Monitoring: API-Response-Zeiten und Fehlerraten über Prometheus/Grafana.
Webprojekt starten?
Wir entwickeln Ihre TYPO3-Website mit modernem Frontend-Stack, CI/CD-Pipeline und optimierter Web Performance — von der Konzeption bis zum Go-Live.
Kostenlose Erstberatung →
