Handling Large Files

Processing 50GB database dumps or massive memory captures entirely in the browser requires specialized techniques.

The Memory Limit Problem

Browsers impose strict memory limits on individual tabs (often around 2-4GB). If you attempt to load a 10GB ISO file into a JavaScript ArrayBuffer using FileReader.readAsArrayBuffer(), the tab will immediately OOM (Out Of Memory) crash.

The Solution: Chunking and Streams

uViewFile bypasses this limitation by never loading the entire file into memory at once.

1. File API Slicing

When you select a file, the browser creates a File object, which is merely a reference to the file on disk. We use the File.slice(start, end) method to read small chunks (e.g., 1MB at a time) on demand.

2. Web Streams API

For more complex processing (like hashing a large file), we use the Web Streams API (file.stream()). This provides a ReadableStream that pipes data directly through our cryptographic functions in WebAssembly, processing the data and discarding it immediately.

3. Virtualized Rendering

In our Hex Viewer, if you scroll to the middle of a 10GB file, we don't render 10 billion HTML elements. We calculate the byte offset based on your scroll position, slice that specific 64KB chunk from the file, and render only the visible rows. This keeps DOM nodes minimal and performance at 60fps.

Common Mistakes

MistakeConsequenceBetter Approach
FileReader.readAsArrayBufferBrowser Crash (OOM)Use File.slice for chunks
Rendering full DOMBrowser freezeVirtualized list rendering

FAQ

What is the max file size?

By using slicing and streams, we can handle files limited only by your OS filesystem (e.g., 2TB on NTFS), not your RAM.

Internal References