CodePrettify: JS, JSON, CSS & RSS Formatierer

CodePrettify verwandelt rohe Entwicklerdateien sofort beim Öffnen in ein IDE-ähnliches Erlebnis — mit Formatierung, Navigation, Validierung, Diff-Ansicht und sogar der Möglichkeit, JavaScript direkt im Browser auszuführen. Unterstützt JSON, JSON Lines (NDJSON), JavaScript, TypeScript, CSS, YAML, XML und RSS/Atom – sowohl für Webantworten als auch für lokale Dateien.

📊 UNTERSTÜTZUNG FÜR STRUKTURIERTE DATEN
• JSON, JSON Lines, XML, RSS, Atom, YAML (.yaml / .yml) und TypeScript (.ts / .mts / .cts)
• Einklappbares JSON mit Breadcrumb-Navigation und JSON-Path-Tools (Autocomplete, Validierung, Kopieren pro Ergebnis)
• Anklickbare URLs und Importpfade in JSON und XML
• Tabellenansicht: sortierbare und durchsuchbare Tabellen für JSON-Arrays von Objekten und wiederkehrende XML-Elemente, mit chunkweisem Laden für große Datensätze

🚀 INTELLIGENTE AUTOMATISIERUNG & FORMATIERUNG
• Automatische Formatierung mit Erkennung von Minifizierung, sodass komprimierte Dateien lesbar gemacht werden, während bereits lesbare Dateien unverändert bleiben
• Moderne CodeMirror 6-Engine mit VS Code-inspirierter Syntaxhervorhebung
• Code-Folding für Funktionen, Klassen, Objekte, Arrays und XML-Blöcke
• Klammer-Matching und ein flackerfreier Loader, der das Anzeigen von Rohinhalten verhindert

🧪 JAVASCRIPT PLAYGROUND
• Führt echtes JavaScript in einem sandboxed Web Worker mit konfigurierbarem Timeout von 1 / 5 / 15 Sekunden aus
• Erfasst console.log/info/warn/error/debug und rendert console.table als echte HTML-Tabelle
• Zeigt Rückgabewert, Ausführungszeit und vollständige Stacktraces
• Option „Include {filename}“ fügt die aktuelle Datei hinzu, sodass ihre Top-Level-Funktionen aufgerufen werden können
• Autocomplete für Funktionen, Methoden, Klassen und Variablen aus dem Playground und der aktuellen Datei, inklusive Parametersignaturen
• Top-level await, Tab / Shift+Tab Einrücken/Ausrücken und automatisch gespeicherter Code zwischen Sitzungen
• Ctrl+Alt+P zum Öffnen, Ctrl+Enter zum Ausführen, Ctrl+Space für Autocomplete

🧭 NAVIGATION & GROSSE DATEIEN
• Dokumentnavigator für JSON, JavaScript und XML
• Syntaxbewusste Minimap, gerendert auf einem Offscreen-Canvas
• URL-spezifischer Ansichtszustand: Folding, Suche, Highlights und Modus werden automatisch wiederhergestellt
• Teilbare Konfigurations-URL stellt exakt die gleiche Ansicht für Teammitglieder wieder her
• Gehe zu Zeile (Ctrl+G) merkt sich die zuletzt verwendete Zeilennummer

🔍 EINBLICKE & VALIDIERUNG
• Diagnose-Panel mit Syntaxstatus, Warnungen und dateitypspezifischen Einblicken
• Statistiken zu Dateigröße, Zeilen, JSON-Tiefe, JS-Funktionen/Variablen, CSS-Selektoren, XML-Tags/-Attribute
• Integrierte Validierung für JSON, JavaScript, TypeScript, CSS (Zeile/Spalte) und XML

🧬 VERGLEICH & DIFF
• Vollbild-Split-View-Diff (Ctrl+Alt+D) mit zeilenweisem Vergleich, synchronem Scrollen, Statistiken und Seitenwechsel

🔐 DATENINSPEKTION
• Inline-Base64- und JWT-Dekodierung mit eigenem Kopierdialog
• Erkennung von Unix-Timestamps (Sekunden und Millisekunden) mit lesbaren Tooltips
• ISO 8601- und RFC 822-Datums-Tooltips in JSON, XML und RSS

🔎 SUCHE & INTERAKTION
• Schwebende Suche (Ctrl+F) mit Live-Ergebniszählung
• Regex-Suche über /pattern/flags
• Anklickbare URLs und relative Importpfade

🔎 REGEX PLAYGROUND
• Teste Regex-Muster live gegen jede geöffnete Datei oder Antwort
• Sofortige Hervorhebung von Treffern im Hauptviewer mit gimsuy-Flag-Steuerung
• Trefferliste mit Anzahl, Zeilen-/Spaltenposition und Direktnavigation
• Capture Groups und benannte Gruppen werden für den aktiven Treffer angezeigt
• Integrierte Regex-Anleitung und Beispielbibliothek
• Zuletzt verwendete Muster werden gespeichert, Ctrl+Alt+R öffnet sofort

📤 EXPORT & TEILEN
• PNG-Export (sichtbarer Bereich oder gesamte Datei) mit Syntaxhervorhebung
• CSV-Export für JSON-Arrays flacher Objekte und RSS/Atom-Feeds
• HTML-Tabellenexport
• Kopieren von Original-, formatierter oder minifizierter Version per Klick

🌐 REQUEST-KONTEXT
• HTTP-Kontext-Panel: URL, Content-Type, Encoding, Größenhinweise und Timing
• cURL- und fetch()-Generator mit plattformübergreifend sicherem Quoting

🎨 CSS-TOOLS
• Hex- und RGB-Anzeige mit integriertem Color Picker (HEX, RGB, HSL kopierbar)

🔒 DATENSCHUTZ & SICHERHEIT
• 100 % lokale Verarbeitung; keine externen Anfragen, Telemetrie oder Drittanbieter-Abhängigkeiten
• Playground läuft in einer Sandbox ohne Zugriff auf Seite, Erweiterung oder Netzwerk
• Sicher für APIs, Tokens und interne Systeme

📂 FUNKTIONIERT ÜBERALL
• HTTP/HTTPS-Antworten und lokale Dateien (file:///)
• Automatische Erkennung über Content-Type

⚙️ ANPASSBAR
• Light-, Dark- und Auto-Themes
• Schriftgröße, Einrückung, Zeilennummern, Word Wrap, Minimap
• Einstellungen werden geräteübergreifend über Browser Storage synchronisiert

⌨️ TASTENKÜRZEL
• Ctrl+B — Raw / Pretty
• Ctrl+Alt+C — Copy
• Ctrl+F — Search
• Ctrl+G — Go to Line
• Ctrl+Alt+T — Toggle toolbar
• Ctrl+Alt+D — Diff tool
• Ctrl+Alt+P — JavaScript Playground
• Ctrl+Alt+R — RegEx Playground

📝 LOKALE DATEIEN
Aktiviere „Zugriff auf Datei-URLs zulassen“ in den Erweiterungseinstellungen deines Browsers für CodePrettify, um es mit file:/// zu verwenden.

Verfügbar in 14 Sprachen: Englisch, Norwegisch, Schwedisch, Dänisch, Deutsch, Spanisch, Französisch, Italienisch, Japanisch, Koreanisch, Portugiesisch, Russisch, Vietnamesisch und vereinfachtes Chinesisch.