Angular / TypeScript / RxJS

Architecture and Security Specification for a Browser-Based Virtual Archive Terminal

Report summary

Status: Research archive item
Category: Angular / TypeScript / RxJS
Length: 5,852 words
Reading time: 27 minutes
Report type: evaluation

Key topics

Angular / TypeScript / RxJS
Angular
TypeScript
RxJS
AI
.NET
Physics
Semantic Systems
Research Archive

Research provenance

Archive status: Research archive item
Canonical report: https://mikekappel.com/reports/angular-typescript-rxjs/web-terminal-architecture-research/
Content identity: sha256:0ffaeba6d9a2e90628d4dca73764d112f32f4d373649d671c1de24634d8a4f6e

For citation, use the report title and canonical URL. Archival presence does not establish authorship or promote report statements into portfolio evidence.

This page renders the archived Markdown as safe, formatted HTML. It is background research and does not become a portfolio claim without evidence review.

Full report

On this page

Executive Summary

Providing an authentic, deeply immersive terminal experience within a browser-based archive workstation requires resolving a fundamental architectural dichotomy. The interface must meticulously simulate a high-capability command-line environment—exhibiting features like piping, recursive directory traversal, and session persistence—yet it must remain a rigidly constrained, read-only document navigation tool that poses absolutely no risk to the underlying infrastructure. This report details the design, constraints, and implementation strategy for a sophisticated virtual terminal utilizing exclusively PHP, HTML, CSS, and vanilla JavaScript. The system achieves this simulation by explicitly rejecting third-party terminal emulators, syntax libraries, and server-side shell execution engines. Instead, the architecture establishes a zero-trust sandbox wherein the terminal operates entirely as a front-end parsing engine interpreting a strict, mathematically bounded command language. The frontend interfaces with a simulated JSON-based virtual file system (VFS) and fetches pre-sanitized, static text documents from a hardened PHP backend. The environment utilizes advanced Document Object Model (DOM) virtualization to maintain performance during heavy text output, seeded pseudo-random number generation to orchestrate deterministic output streaming, and pure CSS to render authentic Cathode Ray Tube (CRT) visual effects. To make the terminal feel incredibly powerful without exposing a real execution environment, the architecture relies on the functional composition of pure JavaScript routines. Operations like filtering, pagination, and searching are executed entirely in the browser's memory against fetched text arrays. Security invariants guarantee that no arbitrary code execution, path traversal, or prototype pollution vulnerabilities can compromise the application, ensuring the terminal remains a secure, closed research interface.

Threat Model

Evaluating the virtual terminal through the STRIDE threat modeling methodology—an industry-standard framework for identifying application threats1—reveals critical attack vectors that must be mitigated entirely through architectural constraints. Because the system explicitly rejects third-party sanitization libraries, vulnerability prevention must be engineered natively into the parser, the state management, and the backend communication protocols. The primary threat surfaces involve the parsing of malicious user input, the manipulation of the virtual file system to access unauthorized data, and the communication interface between the terminal and the backend PHP server. The analysis identifies key vulnerabilities and mandates specific architectural mitigations to preserve the security boundary.

STRIDE Category	Threat Description	Architectural Mitigation
Spoofing	Malicious actors forging window.postMessage payloads to force the external desktop application to open unauthorized files or execute arbitrary actions.	Inter-application message envelopes mandate strict schema validation and origin checking. The desktop application verifies the origin against a hardcoded allowlist and strictly filters the OPEN command payload to explicitly mapped, safe document identifiers3.
Tampering	Modification of the JSON-based Virtual File System or the JavaScript execution environment to alter archive data or elevate privileges within the frontend sandbox.	The VFS is initialized via an immutable, deep-frozen JavaScript object using Object.freeze(). State modifications, such as the current working directory, are stored in isolated closures inaccessible from the global scope, preventing manipulation via the browser console.
Repudiation	Users performing disallowed actions or attempting sandbox escapes without generating a definitive audit trail.	While the terminal is strictly read-only, all issued commands and backend API requests carry a deterministic Session ID. This ID allows backend access logs to definitively recreate the exact sequence of user actions, ensuring full accountability.
Information Disclosure	Local File Inclusion (LFI) or Path Traversal attacks (e.g., ../../etc/passwd) against the PHP backend leading to the exposure of sensitive server configurations or source code5.	The PHP backend completely ignores client-side path structures. Instead, it accepts only cryptographic hashes or strict alphanumeric document identifiers. The backend validates these identifiers against a hardcoded registry of allowed files, resolving absolute paths via realpath() and enforcing strict directory boundaries prior to any file read operations5.
Denial of Service	Resource exhaustion via deeply nested abstract syntax trees (AST), recursive command aliases, or memory leaks from unbounded DOM text output during large document reads.	The parser enforces a maximum AST depth of five and strictly caps pipe segments. The user interface utilizes a virtualized DOM window, limiting active DOM nodes to those strictly visible in the viewport, completely preventing browser memory exhaustion regardless of the simulated output size8.
Elevation of Privilege	Cross-Site Scripting (XSS) via maliciously crafted archive documents or JavaScript Prototype Pollution leading to a complete sandbox escape9.	All DOM insertion strictly utilizes document.createTextNode() and element.textContent, rendering embedded HTML tags inert. Objects mapping the VFS and command registry are instantiated via Object.create(null) to eliminate prototype chains, structurally neutralizing prototype pollution vulnerabilities9.

Strict Command-Language Grammar

To ensure the terminal behaves deterministically and safely, all user input is processed through a highly rigid, formal grammar. The command language allows for standard operations, flag arguments, and pseudo-piping, but the piping mechanism is safely limited exclusively to text array filtering in memory. The Extended Backus-Naur Form (EBNF) grammar provides the mathematical foundation for the parser, defining the absolute boundaries of the acceptable language space12. Any input that deviates from this structure triggers an immediate syntax error during the lexical analysis phase, precluding injection attacks before they reach the execution dispatcher.

This strict grammar guarantees that the tokenizer can accurately distinguish between command binaries, path parameters, and string literals. For instance, spaces contained within double quotes are treated as part of a single literal token, preventing malicious inputs from breaking out of argument boundaries. The pipeline character (|) is explicitly defined as a separator between fully formed commands, preventing its use as an arbitrary shell injection vector.

Command Registry

The command registry acts as a bounded execution environment. Functions within the registry are pure, meaning they accept an environment state object and an array of parsed arguments, returning a transformed state and an output buffer. To maintain the overarching security boundary, absolutely no commands possess the capability to invoke eval(), pass string arguments to setTimeout(), or execute system-level binaries. To make the terminal feel exceptionally powerful, these pure functions support composition. When commands are chained via pipes, the output buffer of the left-hand command (an array of strings) is passed as the input array to the right-hand command. This perfectly simulates a Unix-style execution environment while remaining entirely constrained to front-end string manipulation.

Command	Allowed Arguments	Behavior, Context, & Security Invariants	Aliases
HELP	\[command\]	Outputs static instructional text. Limits lookups exclusively to the bounded keys of the command registry object to prevent object property disclosure.	?
DIR	\[path\]	Lists VFS nodes. Defaults to the current working directory (CWD) state. Validates the target path strictly against the bounds of the simulated VFS graph.	LS
TREE	\[path\]	Recursively lists VFS nodes to provide a structural overview. Traversal is strictly capped at a depth of 10 to prevent denial-of-service via circular VFS references.	None
CD	\<path\>	Mutates the session's CWD state variable. Rejects non-directory targets. Automatically updates the string representation of the virtual prompt.	CHDIR
PWD	None	Prints the current absolute virtual path by traversing the VFS graph back to the root node.	None
TYPE	\<file\>	Initiates an asynchronous PHP fetch for a document payload. Maps the VFS path to a UUID before requesting data to prevent LFI. Passes the content to the pipeline output buffer.	CAT
OPEN	\<file\>	Validates the file extension against an allowlist, then dispatches a sanitized window.postMessage payload to the host application to launch a desktop viewer module.	RUN
INFO	None	Displays simulated system resources, memory banks, and deterministic connection data generated via the session identifier.	SYSINFO
SEARCH	\<query\>	Iterates over the VFS metadata (including filenames and locally indexed descriptions) searching for the string literal, returning matching absolute paths.	None
FIND	\<query\>	Acts exclusively as a pipe filter. Receives an array of strings from a preceding command (e.g., TYPE) and returns only the lines containing the literal query.	GREP
HEAD	\[-n count\] \[file\]	Returns the first n lines of a document or an incoming pipeline stream. It safely aborts array processing immediately after the threshold is reached.	None
MORE	\[file\]	Halts the pipeline, buffers output, and establishes a temporary keydown listener waiting for spacebar input to paginate the remaining string array.	LESS
HISTORY	None	Prints the session's command ring-buffer array, enumerated chronologically.	None
CLS	None	Truncates the DOM output buffer entirely and resets the virtual scrolling index, clearing the visual canvas.	CLEAR
VER	None	Prints a static simulated OS version banner, contributing heavily to the immersion of the archive system.	None
DATE	None	Prints the client's current date, formatted specifically to simulate legacy operating system display standards.	None
TIME	None	Prints the client's current time.	None

Virtual Path Model

To establish deep immersion, the terminal requires a robust abstraction of a file system. This is achieved via a JSON-based Virtual File System (VFS) manifesting entirely within the browser's memory. The VFS acts as the single source of truth for all path-based operations, isolating the frontend interface from the actual server architecture. The VFS is represented as a directed acyclic graph, initialized via a deeply frozen JSON object. The root is designated by a virtual drive letter, typically R:\\ to represent the remote Archive or Repository. Every node in the graph represents either a directory containing child nodes or a file containing metadata, such as file size, creation date, and a backend document identifier. To prevent path traversal vulnerabilities from compromising the illusion of the VFS or attempting to exploit the backend, a strict path normalization algorithm is utilized13. When a user requests a complex relative path, such as CD ..\\..\\SECRET, the algorithm evaluates the path iteratively against the VFS graph. The path is divided into tokens using the slash or backslash delimiters. The algorithm then traverses a tracking pointer starting from the absolute root or the current working directory. If a . token is encountered, the pointer remains stationary. Crucially, if a .. token is encountered, the pointer moves to the parent node, but if the pointer is already at the absolute root of the virtual drive, it simply remains at the root. This mechanism effectively neutralizes excessive directory traversal attempts without throwing fatal application errors, maintaining the illusion of a resilient operating system14. The isolation between the frontend VFS and the PHP backend is absolute. The frontend strictly maps VFS file nodes to alphanumeric unique identifiers (UUIDs). When the user types TYPE R:\\SRC\\REPORT.TXT, the frontend resolves the path internally, locates the corresponding UUID (e.g., doc-781a), and sends a highly constrained fetch request to the PHP backend (GET /api/fetch.php?id=doc-781a). The PHP script performs no dynamic path resolution based on user input. It maps the UUID against a hardcoded array pointing to a sanitized internal path outside the public web root, reads the file, and returns the raw text5. This total decoupling ensures complete immunity to Local File Inclusion attacks, as the backend never processes path characters like slashes or dots supplied by the client6.

Parser Architecture

Translating raw text input into simulated execution requires a sophisticated, multi-stage parser architecture built natively in vanilla JavaScript. The parser is responsible for deconstructing the input string, identifying the intent, and orchestrating the data flow between pure functions. The process begins with lexical analysis, where the tokenizer processes the input string character by character, converting it into a continuous stream of semantic tokens. The tokenizer maintains internal state to properly handle string literals wrapped in single or double quotes. This state machine ensures that spaces occurring within quotes do not trigger argument separation, allowing users to search for phrases like "thermal spikes" as a single token. Furthermore, the tokenizer identifies the pipe character (|), tagging it as a structural delimiter rather than a standard argument. Following tokenization, the parser analyzes the token stream to construct an Abstract Syntax Tree (AST). The parser specifically utilizes the pipe tokens to split the stream into a linked list of distinct command nodes. Each node represents an executable command and its associated arguments. This tree structure validates the syntax; for example, if a pipe token is found without a subsequent command node, the parser immediately raises a syntax error, halting execution. The execution dispatcher evaluates the AST from left to right. It retrieves the appropriate function from the Command Registry for the current node. If a pipe relationship exists, the dispatcher captures the output buffer generated by the left-hand command—which is strictly an array of strings—and passes it as an implicit argument (simulating standard input) to the right-hand command. Because the environment involves asynchronous operations, such as fetching a text file from the backend via the TYPE command, the dispatcher relies on JavaScript Promises to await the resolution of network requests before passing the data to the next pipeline stage. This asynchronous pipeline architecture makes the terminal feel extraordinarily powerful and authentic, simulating complex data flows entirely within safe memory confines.

Output-Buffer Model

Creating an authentic terminal requires specialized rendering techniques to balance the specific aesthetic of a legacy CRT monitor with the performance demands of rendering potentially tens of thousands of lines of text from archive documents. Appending thousands of \<div\> or \<span\> elements to the DOM degrades browser performance rapidly, leading to severe memory bloat and unresponsive scrolling. To solve this, the application employs DOM virtualization, a technique relying on node recycling8. The terminal maintains a logical output buffer as an array of strings and ANSI metadata in memory. The visual container only renders the specific subset of lines visible within the viewport, calculated by dividing the scroll position by a fixed row height, plus a small buffer margin to prevent tearing during fast scrolling. As the user scrolls, existing DOM nodes are not destroyed or created; instead, their textContent properties are rapidly replaced with the new lines from the buffer. This keeps the total DOM node count strictly bounded to approximately 40 to 50 lines, ensuring a consistent 60 frames-per-second experience even when navigating a 100,000-line history log16. Implementing standard copy and selection behavior within a virtualized DOM presents a significant challenge, as the browser's native text selection breaks when elements scroll out of existence. To maintain the illusion of a continuous document, the architecture implements a custom selection behavior. When a user drags their cursor across the terminal, a global event listener calculates the selected lines by mapping the mouse coordinates back to the logical buffer array in memory. When a copy command is intercepted, the system writes this contiguous string directly to the system clipboard using the modern navigator.clipboard API, entirely bypassing the broken visual selection state. Search highlighting, triggered by commands like FIND, requires careful handling to avoid XSS vulnerabilities. When a match is identified within a text line, a safe regular expression calculates the index of the substring. The system slices the text and utilizes document.createElement('span') to wrap the specific match in a highlight class, appending these nodes sequentially using Node.append(). The innerHTML property is never used, guaranteeing that any HTML syntax embedded within the archive documents is rendered purely as inert text18. The visual aesthetic of a retro CRT monitor is achieved entirely through vanilla CSS, leveraging gradients, shadows, and animations to create a deeply immersive atmosphere without relying on heavy WebGL libraries19.

Scanlines are achieved by overlaying a pseudo-element (::after) over the entire terminal container with a repeating linear-gradient background.
The distinctive phosphor glow of legacy hardware is generated using the text-shadow CSS property, layering multiple colored blurs over the text (e.g., text-shadow: 0 0 5px \#00ff00, 0 0 10px \#00ff00;)22.
A subtle screen flicker is implemented via a CSS @keyframes animation that rapidly and pseudo-randomly oscillates the opacity of the terminal container between 0.95 and 1.0, simulating cathode voltage fluctuations19.
Finally, a slight border-radius combined with an inset box-shadow provides the visual illusion of a curved glass bezel housing the terminal20.

To further enhance immersion, the system includes an optional boot sequence. Before the virtual prompt appears, the terminal executes a scripted startup routine, rapidly printing simulated BIOS memory checks, loading hardware drivers, and establishing network handshakes. This entirely aesthetic sequence reinforces the illusion of operating a physical terminal connected to a remote mainframe. To support legacy text formatting without integrating third-party libraries24, a vanilla JavaScript regular expression engine intercepts ANSI escape codes (\\x1b\[...m) within the output stream. The engine splits the string at these markers and applies specific CSS classes to the resulting spans, allowing documents to feature colored text and bold formatting while maintaining the strict text-injection security policy.

Command-History Design

The terminal perfectly replicates the standard shell feature of recalling previous commands via the up and down arrow keys, a critical feature for establishing user familiarity and flow. The command history is managed via a ring buffer array with a fixed size of 100 entries. A tracking index points to the current position within this buffer. When a user presses the ArrowUp key, an event listener intercepts the action, decrements the index, and replaces the current input value with the historical command. Pressing ArrowDown increments the index, cycling back toward more recent commands. If the index exceeds the buffer length, the input field is cleared to allow new input. Submitting a new command pushes it to the head of the buffer and resets the tracking index to zero. To ensure the input element behaves naturally without requiring actual HTML \<input\> or \<textarea\> elements—which often break strict terminal styling and selection behaviors—the system intercepts global keyboard events, mapping printable characters directly to an internal string while updating a simulated, CSS-animated blinking block cursor.

Autocomplete Design

Pressing the Tab key triggers a predictive algorithm that assists users with rapid path and command resolution. The parser first determines the context of the cursor position. If the cursor is located at the first token of the input string, the autocomplete engine targets the Command Registry. If the context is an argument following a command, the engine targets the Virtual File System paths relative to the current working directory. The autocomplete engine leverages a Trie (prefix tree) data structure, initialized on startup with the complete VFS schema and the available command names. The engine traverses the Trie based on the characters currently typed. If a unique branch is identified, it immediately appends the remaining characters to the user's input string. If multiple branches exist, consecutive Tab presses cycle through the available sibling nodes, accurately simulating standard Bash completion behavior and greatly accelerating the navigation of the virtual archive.

Inter-App OPEN Behavior

The virtual terminal is highly effective for text manipulation, but certain files—such as high-resolution imagery, complex datasets, or multimedia—exceed the capabilities of a text-based interface. When the OPEN command is executed against such a file, the terminal must instruct the parent archive workstation wrapper to render the file in a distinct, purpose-built desktop application module. To maintain the strict security boundary between the terminal sandbox and the host workstation, the terminal utilizes the browser's native window.postMessage() API3. The payload conforms to a rigorous Event Schema Design4, ensuring both sides of the communication channel understand the intent without executing arbitrary instructions.

JSON { "envelope": { "type": "ARCHIVE\_INTEROP\_OPEN", "version": "1.0", "timestamp": "2026-09-01T14:15:57Z" }, "payload": { "documentId": "doc-781a", "mimeType": "image/png" } }

The terminal executes window.parent.postMessage(eventObject, "https://archive.secure-domain.com"). The parent window verifies the strict origin of the message, validates the JSON schema of the envelope, and triggers the appropriate application module based on the payload. If the payload contains unexpected keys, attempts to pass executable code, or originates from a tampered domain, the parent application simply drops the event and logs a security warning3. This enforces the principle of least privilege, as the terminal can only request document views and cannot dictate how the parent executes them.

Error-Message Taxonomy

Immersion relies heavily on replicating the esoteric and structured failure modes of historical operating systems. Modern web development jargon, such as "404 Not Found" or "Type Error," shatters the illusion. The error taxonomy is specifically designed to provide contextual, simulated OS responses that guide the user while maintaining the narrative atmosphere.

Error Condition	Simulated Terminal Output
Command not found in registry	Bad command or file name
Traversal beyond VFS root boundary	Invalid directory
TYPE executed on a directory node	Access denied \- target is a directory
File does not exist in VFS	File not found
Syntax error (e.g., dangling quote)	Syntax error: unexpected termination
Pipe constraint violation	Invalid pipe operation

Example Sessions

To demonstrate the robust narrative and functional capabilities of the terminal, the following simulates a session detailing an investigation into the virtual archive. This sequence totals over 100 lines of simulated interaction, highlighting the optional boot sequence, deterministic streaming, complex piping, and error handling. \[BIOS\] Memory Test: 640K OK \[BIOS\] Initializing peripheral controllers... \[BIOS\] Floppy drive controller... OK \[BIOS\] Hard disk controller... OK \[INIT\] Loading ARCA-OS Kernel... \[INIT\] Mounting Virtual Volumes... \[INIT\] Establishing network handshake... \[INIT\] Connection established. R:\> VER ARCA-OS Virtual Environment Version 7.4.1 (Build 8291\) (c) Copyright 1982-2026. All rights reserved. R:\> INFO \[SYSTEM INFORMATION\] Session ID : 0x9A4B-F81C Latency Profile : Simulated (9600 Baud) Crypto State : Synchronized Memory : 640K Base / 16384K Extended Uptime : 0 Days, 0 Hours, 14 Minutes R:\> PWD R:\\ R:\> DIR Volume in drive R is ARCHIVE\_MAIN Volume Serial Number is 4F3C-9B1A Directory of R:\\ 09/01/2026 14:15 SYS 09/01/2026 14:15 DATA 09/01/2026 14:15 REPORTS 09/01/2026 14:15 128 README.TXT 1 File(s) 128 bytes 3 Dir(s) 10,240,000 bytes free R:\> TYPE SYSTEM\_CONFIG.BIN File not found R:\> CD REPORTS R:\\REPORTS\> DIR Volume in drive R is ARCHIVE\_MAIN Volume Serial Number is 4F3C-9B1A Directory of R:\\REPORTS 09/01/2026 14:15 . 09/01/2026 14:15 .. 07/12/1998 08:30 4,096 INCIDENT\_01.LOG 08/15/1998 16:45 12,532 ANALYSIS\_A.TXT 10/31/1998 23:59 1,024 SUMMARY.TXT 3 File(s) 17,652 bytes 2 Dir(s) 10,240,000 bytes free R:\\REPORTS\> TYPE INCIDENT\_01.LOG | HEAD \-n 15 \[CLASSIFIED LOG ENTRY\] DATE: 07/12/1998 SUBJECT: Sector 7 Anomalous Readings 0800: Routine sweep of Sector 7 initiated. 0815: Telemetry indicates minor thermal spikes. 0819: Thermal spikes escalated beyond baseline parameters. 0822: Connection with Drone 4 lost. Last known coordinates logged. 0830: Recovery team assembled and briefed. 0845: Team deployed to sector coordinates. 0910: Recovery team reports localized electromagnetic interference. 0915: Visual contact with Drone 4 established. 0916: Drone chassis displays severe localized scorching. 0930: Drone recovered. Commencing transport to containment. \[END OF SECTOR 7 EXCERPT\] R:\\REPORTS\> TYPE ANALYSIS\_A.TXT | FIND "scorching" 0916: Drone chassis displays severe localized scorching. Note: Scorching pattern is inconsistent with standard electrical fires. Metallurgical analysis of scorching suggests exposure to plasma. R:\\REPORTS\> CD ..\\DATA R:\\DATA\> DIR Volume in drive R is ARCHIVE\_MAIN Volume Serial Number is 4F3C-9B1A Directory of R:\\DATA 09/01/2026 14:15 . 09/01/2026 14:15 .. 11/02/1998 10:00 524,288 DRONE\_SCAN.PNG 11/05/1998 14:20 85,192 SPECTROGRAPHY.DAT 2 File(s) 609,480 bytes 2 Dir(s) 10,240,000 bytes free R:\\DATA\> OPEN DRONE\_SCAN.PNG \[INTERPROCESS\] Dispatching payload to external viewer module... \[INTERPROCESS\] Handshake acknowledged. Document opened successfully. R:\\DATA\> HISTORY 1 VER 2 INFO 3 PWD 4 DIR 5 TYPE SYSTEM\_CONFIG.BIN 6 CD REPORTS 7 DIR 8 TYPE INCIDENT\_01.LOG | HEAD \-n 15 9 TYPE ANALYSIS\_A.TXT | FIND "scorching" 10 CD ..\\DATA 11 DIR 12 OPEN DRONE\_SCAN.PNG 13 HISTORY R:\\DATA\> CLS

Accessibility Strategy

Translating a deeply visual, continuously streaming terminal environment into a format accessible via screen readers presents complex challenges. A standard approach would lead to cognitive overload and duplicate readouts as the virtual DOM rapidly updates27. To solve this, the architecture implements a dual-DOM approach. For sighted users, the terminal utilizes DOM virtualization, recycling nodes for peak performance8. However, if a screen reader encounters nodes being rapidly added, removed, and recycled during scroll events, it loses context or reads the entire terminal content multiple times27. To prevent this, the visible DOM container is explicitly marked with aria-hidden="true", hiding the complex virtualization logic from assistive technologies. A secondary, visually hidden DOM container is maintained exclusively for screen readers. This hidden container acts as the live region and is designated with role="log" and aria-live="polite"29. When a command is executed, the user's input and the resulting output are appended as raw text nodes to this hidden log29. Because aria-atomic is explicitly set to false, the screen reader is instructed to only announce the newly appended text rather than rereading the entire log28. During the rapid streaming of large files, appending character-by-character would overwhelm the screen reader API. Therefore, the accessibility buffer debounces updates, appending text strictly line-by-line or in coherent semantic blocks, ensuring a smooth auditory experience. The entire application assumes a keyboard-first interaction model. Focus is programmatically trapped within the virtual input prompt to prevent accidental navigation away from the terminal context, which would disrupt workflow. If the user deliberately presses the Escape key, focus is safely released to the parent workstation wrapper, adhering strictly to WCAG 2.1 AA standards for preventing keyboard traps32.

Security Invariants

The terminal achieves a zero-trust footprint by adhering strictly to the following fundamental invariants, ensuring it never becomes an execution vector:

1. No System Execution: There are no backend shell processors or sub-processes. The terminal relies entirely on front-end string parsing and pure functional composition. No user input is ever passed to execution functions like exec(), system(), or shell\_exec() in PHP.

2. Prototype Isolation: The command registry and the VFS are instantiated utilizing Object.create(null) and rendered immutable via Object.freeze(). This neutralizes JavaScript prototype pollution attacks, as there is no \_\_proto\_\_ object on the inheritance chain to tamper with or poison9.

3. Strict Content Insertion: Output text is written to the DOM exclusively via document.createTextNode(str) or the HTMLElement.textContent property. The innerHTML property is strictly forbidden across the entire codebase. This constraint naturally neutralizes any Cross-Site Scripting (XSS) payloads that may be maliciously embedded within the archive text files18.

4. Absolute Boundary Enforcement: The PHP backend validates all incoming file requests against a static allowlist of document IDs. It utilizes the realpath() function to resolve the underlying OS path and verifies that the resulting string strictly begins with the hardcoded, secured archive directory path. This complete detachment from client-supplied path tokens fully neutralizes Local File Inclusion (LFI)5.

Performance Strategy

Simulating a high-speed terminal in the browser requires meticulous management of rendering cycles and memory, particularly when processing large documents or sustaining long sessions. To replicate the feel of baud-rate limited network latency, text is streamed to the display character by character. However, to ensure this streaming is deterministic—meaning the delay pattern is identical if the user replays the session for auditing or testing—a seeded Linear Congruential Generator (LCG) is used to calculate the delay33. The LCG relies on a mathematical formula to generate pseudo-random float values, utilizing the unique Session ID assigned upon loading as its initial seed34. These float values dictate the milliseconds passed to the setTimeout function between character renders. This ensures that while the output feels organically variable and unpredictable, perfectly simulating network jitter, it requires no true entropy and remains entirely stable across repeated tests35. Appending text to the DOM character by character triggers excessive layout recalculations, known as reflows, which degrade browser performance. The architecture mitigates this by batching string concatenations in memory and executing the actual DOM updates strictly within the window.requestAnimationFrame() loop. This technique aligns all visual modifications with the browser's native screen refresh rate, guaranteeing efficient execution and preventing thread blocking even during intense data floods.

Test Matrix

The Quality Assurance strategy dictates comprehensive regression testing against adversarial inputs designed specifically to attempt to escape the command language constraints.

Attack Vector	Input Example	Expected (Safe) Outcome
Path Traversal (LFI)	TYPE ../../../../etc/passwd	Frontend VFS normalization traps the pointer at R:\\. The resulting path evaluates to R:\\etc\\passwd, failing the VFS check and returning File not found13.
Backend Forgery	Direct HTTP GET /api/?file=../../config.php	PHP validates the input against allowlisted UUIDs. The input is rejected entirely, resulting in an HTTP 403 Forbidden response.
Cross-Site Scripting	TYPE R:\\XSS.TXT (containing \<script\>alert(1)\</script\>)	The payload is displayed safely as raw text due to the strict adherence to textContent DOM insertion. The script does not execute.
Prototype Pollution	CD \_\_proto\_\_	Rejected. The VFS initialized via Object.create(null) has no prototype, and the property access fails safely9.
Command Injection	DIR && rm \-rf /	Parsed strictly via EBNF grammar as: Command DIR, Argument &&, Argument rm... Rejected as invalid arguments by the DIR pure function. No shell execution occurs.
Denial of Service	TREE R:\\ (if VFS has circular loops)	TREE enforces a hardcoded recursion depth limit of 10\. The traversal safely aborts, preventing browser thread lock.

Pseudocode

The following algorithmic implementations highlight the core architectural components responsible for ensuring both safety and an authentic simulation.

1. Deterministic LCG Streaming

JavaScript // Linear Congruential Generator for deterministic baud-rate jitter class LCG { constructor(seed) { this.seed \= seed; this.m \= 4294967296; // 2^32 modulus this.a \= 1664525; // multiplier this.c \= 1013904223; // increment } next() { // Generates the next pseudo-random value deterministically this.seed \= (this.a \* this.seed \+ this.c) % this.m; return this.seed / this.m; // Returns a float between 0 and 1 } }

// Simulated typing with deterministic jitter based on session ID async function streamText(text, sessionId, container) { const prng \= new LCG(sessionId); let buffer \= ""; for (let char of text) { buffer \+= char; // Calculate jitter delay between 2ms and 15ms let delay \= Math.floor(prng.next() \* 13) \+ 2; await new Promise(resolve \=\> setTimeout(resolve, delay)); container.textContent \= buffer; // Strictly safe DOM insertion } }

2. Virtual Path Normalizer

JavaScript // Prevents traversal out of bounds in the frontend VFS function normalizeVirtualPath(cwd, inputPath) { let parts \= inputPath.replace(/\\\\/g, '/').split('/'); let resolved \= inputPath.startsWith('R:') ? \[\] : cwd.split('/').filter(Boolean);

for (let part of parts) { if (part \=== '' || part \=== '.') continue; // Stay in place if (part \=== '..') { // Trap the pointer at R:\\ (length 1\) to prevent escaping the root if (resolved.length \> 1) resolved.pop(); } else { resolved.push(part.toUpperCase()); } }

let finalPath \= resolved.join('\\\\'); return finalPath.startsWith('R:') ? finalPath : 'R:\\\\' \+ finalPath; }

3. Secure PHP Backend Fetcher

PHP \<?php // backend\_fetch.php header('Content-Type: text/plain');

// Hardcoded map linking UUIDs to safe internal paths outside the web root $allowed\_documents \= \[ 'doc-781a' \=\> '/var/archive\_safe/incident\_01.log', 'doc-992b' \=\> '/var/archive\_safe/analysis\_a.txt' \];

$requested\_id \= $\_GET\['id'\] ?? '';

// Immediate rejection of non-allowlisted input if (\!array\_key\_exists($requested\_id, $allowed\_documents)) { http\_response\_code(404); die("Error 404: File not found in archive registry."); }

$target\_file \= $allowed\_documents\[$requested\_id\]; $real\_base \= realpath('/var/archive\_safe'); $real\_target \= realpath($target\_file);

// Absolute boundary enforcement (LFI mitigation) // Ensures the resolved path strictly resides within the allowed base directory if ($real\_target \=== false || strpos($real\_target, $real\_base) \!== 0) { http\_response\_code(403); die("Error 403: Security boundary violation."); }

echo file\_get\_contents($real\_target); ?\>

Implementation Phases

The rollout of the virtual terminal occurs over five distinct engineering phases. This phased approach isolates architectural complexity and ensures the security model is rigorously tested at each tier before advancing.

Phase	Description	Key Deliverables
Phase 1: Substrate & VFS	Establish the core data structures, state management, and backend communication.	JSON VFS schema, absolute path normalization algorithm, Object.create(null) registries, and the hardened PHP backend file fetcher with explicit boundary enforcement.
Phase 2: Parser Engine	Implement the text interpretation and execution logic.	Lexer/Tokenizer state machine, AST generation, command dispatch pipeline, and pure functional pipe implementations (FIND, MORE, HEAD).
Phase 3: Presentation & CRT	Build the visual rendering layer and implement strict DOM performance constraints.	CSS CRT scanlines, text-shadow glow, keyframe flicker, requestAnimationFrame streaming buffer, and the DOM recycling container to manage large text blocks.
Phase 4: Inter-App & A11y	Bridge the terminal to the parent workstation environment and accommodate all users.	window.postMessage integration with schema validation, dual-DOM implementation ensuring the hidden ARIA live region behaves correctly.
Phase 5: Auditing	Comprehensive security and stability verification prior to deployment.	Full execution of the test matrix, prototype pollution scanning, boundary fuzzing, and performance profiling sustaining 60fps at 10,000+ lines.

This architectural specification provides the comprehensive blueprint necessary for constructing an authentic, secure, and performant virtual archive terminal. By enforcing strict grammatical parsers, structurally neutralizing dynamic code evaluation, and leveraging pure browser specifications (CSS animations, DOM virtualization, and semantic ARIA HTML), the application guarantees deep immersion for the user while maintaining absolute security for the underlying infrastructure.

Works cited

1. GitHub \- mrwadams/stride-gpt: An AI-powered threat modeling tool, https://github.com/mrwadams/stride-gpt

2. ISADM: An Integrated STRIDE, ATT\&CK, and D3FEND Model ... \- arXiv, https://arxiv.org/pdf/2512.18751

3. What Is Web Messaging? \- ITU Online IT Training, https://www.ituonline.com/tech-definitions/what-is-web-messaging/

4. How to Build Event Schema Design \- OneUptime, https://oneuptime.com/blog/post/2026-01-30-event-schema-design/view

5. Local File Inclusion (LFI) \- Invicti, https://www.invicti.com/learn/local-file-inclusion-lfi

6. A guide to path traversal and arbitrary file read attacks \- YesWeHack, https://www.yeswehack.com/learn-bug-bounty/practical-guide-path-traversal-attacks

7. File uploads | Web Security Academy \- PortSwigger, https://portswigger.net/web-security/file-upload

8. Virtual list in vanilla JavaScript \- Sergi Mansilla, https://sergimansilla.com/blog/virtual-scrolling/

9. Ultimate Guide to Prototype Pollution \- NetSPI, https://www.netspi.com/blog/technical-blog/web-application-pentesting/ultimate-guide-to-prototype-pollution/

10. CVE-2025-68613 Deep Dive: How Node.js Sandbox Escapes, https://www.penligent.ai/hackinglabs/cve-2025-68613-deep-dive-how-node-js-sandbox-escapes-shatter-the-n8n-workflow-engine/

11. RCE via Insecure JS Sandbox Bypass | by Bipin Jitiya \- Medium, https://medium.com/@win3zz/rce-via-insecure-js-sandbox-bypass-a26ad6364112

12. EBNF-Grammars — DHParser 1.9.1 documentation, https://dhparser.readthedocs.io/en/v1.9.1/manuals/01\_EBNF-grammars.html

13. Check the File Path \- IsMy.net, https://www.ismy.net/archive/check-the-file-path

14. Normalize file path in JavaScript front-end \- Stack Overflow, https://stackoverflow.com/questions/71557013/normalize-file-path-in-javascript-front-end

15. How to normalize a path in PowerShell? \- Stack Overflow, https://stackoverflow.com/questions/495618/how-to-normalize-a-path-in-powershell

16. Optimizing Frontend Rendering with Virtual DOM Techniques, https://namastedev.com/blog/optimizing-frontend-rendering-with-virtual-dom-techniques/

17. JavaScript Virtual Scrolling Library For Large Lists, https://www.html-code-generator.com/javascript/virtual-scrolling

18. Safe HTML sanitization → DOMPurify. | by Vikrant Tewathia \- Medium, https://medium.com/@vkrntteotia/safe-html-sanitization-dompurify-2c1cbdd8714f

19. Using CSS to create a CRT \- Alec Lownes, https://aleclownes.com/2017/02/01/crt-display.html

20. crt effect tutorial \- oudkee's corner, https://oudkee.neocities.org/tutorials/tutcrt

21. Using CSS Animations To Mimic The Look Of A CRT Monitor \- Medium, https://medium.com/@dovid11564/using-css-animations-to-mimic-the-look-of-a-crt-monitor-3919de3318e2

22. How to create neon text using vanilla CSS \- Medium, https://medium.com/@amirlotfi/how-to-create-neon-text-using-vanilla-css-be0964ea138b

23. Add CRT scanlines, screen flicker and color separation effects · GitHub, https://gist.github.com/lmas/6a1bd445bc7a7145245085f4a740d3f5

24. ansi-render – Typst Universe, https://typst.app/universe/package/ansi-render/

25. ansi-escapes \- NPM, https://www.npmjs.com/package/ansi-escapes

26. Events, Schemas and Payloads:The Backbone of EDA Systems, https://solace.com/blog/events-schemas-payloads/

27. Screenreader read content again although the role log is used, https://stackoverflow.com/questions/72940439/screenreader-read-content-again-although-the-role-log-is-used

28. Designing Stable Interfaces For Streaming Content, https://www.smashingmagazine.com/2026/05/designing-stable-interfaces-streaming-content/

29. WCAG 4.1.3 Status Messages: How to Test It \- Auditsu, https://auditsu.com/wcag/4-1-3-status-messages

30. Accessible Rich Internet Applications (WAI-ARIA) 1.3 \- W3C on GitHub, https://w3c.github.io/aria/

31. omnichannel-chat-widget/CHANGE\_LOG.md at main \- GitHub, https://github.com/microsoft/omnichannel-chat-widget/blob/main/CHANGE\_LOG.md

32. Accessibility Statement \- EU Optikos, https://euoptikos.com/accessibility

33. RandomLCG | myPhysicsLab Docs, https://www.myphysicslab.com/develop/docs/classes/lab\_util\_Random.RandomLCG.html

34. Linear Congruence method for generating Pseudo Random Numbers, https://www.geeksforgeeks.org/dsa/linear-congruence-method-for-generating-pseudo-random-numbers/

35. Generating Pseudo-Random Numbers in Java \- Medium, https://medium.com/@AlexanderObregon/generating-pseudo-random-numbers-with-javas-random-class-58a153d18c99

36. Pseudorandom number generator \- Wikipedia, https://en.wikipedia.org/wiki/Pseudorandom\_number\_generator

37. NodeJS \- \_\_proto\_\_ & prototype Pollution \- HackTricks, https://angelica.gitbook.io/hacktricks/pentesting-web/deserialization/nodejs-proto-prototype-pollution