Webbrowser

Darstellung

• HTML: Strukturiertes Dokumentenformat für Inhalte (Texte, Bilder, Links).
• CSS: Stile zur Formatierung von HTML, Layouts, Animationen.
• JavaScript (JS): Dynamische Skriptsprache, Interaktionen und DOM-Manipulation.
• WebGL: Hardwarebeschleunigte 2D- und 3D-Grafiken.
• WebGPU: Moderne API für Hochleistungs-Grafik und parallele Rechenoperationen.
• PDF: Darstellung und Interaktion mit PDF-Dateien über Browser-native Funktionen oder Plugins.
• Audio/Video: Unterstützung von verschiedenen Audio- und Videoformaten über HTML5 <audio> und <video> Tags.
• SVG: Vektorgrafiken, dynamisch manipulierbar mit JS.
• Web Components: Eigenständige, wiederverwendbare UI-Komponenten.
• WebRTC: Echtzeitkommunikation (Audio/Video/Datentransfer).
• Service Workers: Offline-Fähigkeiten, Hintergrundaufgaben.

Sandboxes

JavaScript

JavaScript wird im Browser durch die JavaScript-Engine ausgeführt (z. B. V8 in Chrome, SpiderMonkey in Firefox). Diese Engine besteht aus einem Parser, der den Code in einen abstrakten Syntaxbaum (AST) umwandelt, einem Interpreter, der den Code schrittweise ausführt, und einem JIT-Compiler (Just-In-Time), der oft verwendeten Code in Maschinencode kompiliert, um die Ausführung zu beschleunigen. Ausführung ist single-threaded, aber moderne Browser unterstützen asynchrone Operationen und WebWorker.

• Kein direkter Zugriff auf System-Ressourcen, aber möglich über verschiedene APIs

Inline JS in <script> Tags wird immer synchron ausgeführt und kann von von Content Security Policies (CSP) blockiert werden, da Inline-Skripte als potenziell unsicher gelten. Externe JS Dateien dagegen können mit async und defer asynchron geladen werden:

• async: paralleles Laden und schnellstmöglichae Ausführung
• defer: paralleles Laden, Ausführung nach Parsen des HTML

WebAssembly (WASM)

WebAssembly läuft ebenfalls in einer geschützten Sandbox und bietet nur eine JS-API, kann also nicht selbständig im Browser ausgeführt werden, sondern muß über JS gestartet und verwaltet werden. WebAssembly ist sozusagen eine Erweiterung für Javascript.

CSSOM (CSS Object Model)

CSS wird vom Browser in CSSOM überführt, einer baumartigen Darstellung des gesamten CSS. Dieser wird dann mit dem DOM zu einem Render Tree kombiniert.

Richtlinien

Richtlinien werden vom Server gesetzt und im Browser umgesetzt, ohne daß JS Einfluß darauf nehmen kann.

CORS (Cross-Origin Resource Sharing)

Regelt, welche Ressourcen aus einer anderen Domain (Origin) geladen werden dürfen.

• Access-Control-Allow-Origin Header

bei Zugriff über JS wird automatisch ein Preflight-Request (OPTION-Method) geschickt, um die zulässigen Anfragen vom Server zu laden

CSP (Content-Security-Policy)

Kontrolliert, welche Ressourcen (Skripte, Stylesheets, etc.) geladen und ausgeführt werden dürfen.

SOP (Same-Origin Policy)

grundlegende Sicherheitsrichtlinie, die verhindert, dass Skripte auf Ressourcen von einer anderen Domain zugreifen, wenn diese nicht explizit freigegeben wurden

Schutz vor Cross-Site-Scripting (XSS) und Cross-Site-Request-Forgery (CSRF)

Feature Policy / Permissions Policy

Richtlinie steuert, welche Browserfunktionen eine Website verwenden darf (Kamera, Mikrofon, Geolocation, ...)

Permissions-Policy: geolocation=(self), camera=()

Referrer-Policy

Kontrolliert, welche Informationen im Referer-Header bei HTTP-Anfragen gesendet werden.

• Referrer-Policy: no-referrer verhindert, dass der Referer-Header gesendet wird
• Referrer-Policy: strict-origin sendet nur die Ursprungs-Domain, aber keine spezifischen Seitenpfade

X-Content-Type-Options

Sicherheitsrichtlinie, die verhindert, dass der Browser den MIME-Typ einer Datei basierend auf deren Inhalt rät (MIME-Sniffing) Schutz vor Angriffsvektoren durch falsch deklarierte MIME-Typen (z.B. Cross-Site Scripting).

X-Frame-Options

Steuert, ob eine Webseite in einem <iframe> eingebettet werden darf, um sogenannte Clickjacking-Angriffe zu verhindern.

HSTS (Strict-Transport-Security)

Erzwingt den Zugriff über HTTPS zum Schutz vor Man-in-the-Middle-Angriffen und versehentlichem Laden unsicherer HTTP-Verbindungen.

COOP (Cross-Origin-Opener-Policy)

Regelt, ob ein Dokument mit einem anderen Origin den gleichen Browser-Prozess teilen darf. Diese Richtlinie trennt Websites mit unterschiedlichen Origins in separate Prozesse, um Sicherheitslücken zu vermeiden. Schutz vor Spectre- und Meltdown-Sicherheitslücken

COEP (Cross-Origin-Embedder-Policy)

verhindert, dass eine Webseite unsichere Ressourcen von anderen Ursprüngen einbettet, die nicht die richtigen Sicherheitsheader haben.

Expect-CT (Certificate Transparency)

Fordert den Browser auf, eine Website nur zu laden, wenn ihr Zertifikat in einer öffentlichen Certificate Transparency (CT) Log veröffentlicht wurde. Dies verhindert das Verwenden von gefälschten oder unsicheren Zertifikaten.

SRI (Subresource Integrity)

SRI erlaubt es, eine kryptografische Hash-Prüfsumme für Ressourcen wie externe Skripte oder Stylesheets anzugeben. Der Browser überprüft dann, ob die geladene Ressource mit der erwarteten Hash übereinstimmt.
Der Hash widr nur beim Laden überprüft, nicht während der Laufzeit.