Guide

Developer Handbook

ZepraBrowser Development Guide

Project: ZepraBrowser - Independent Web Browser
Engine: ZepraScript (JavaScript) + WebCore (HTML/CSS) + NXRender (Graphics)
Trademark: ZepraScript is a trademark of KetiveeAI
Last Updated: 2025-12-13

Architecture Overview

+----------------------------------------------------------+
|                    ZepraBrowser                          |
+----------------------------------------------------------+
|  UI Layer (NXRENDER)                                     |
|  - Tab Bar, Address Bar, DevTools                        |
|  - Native X11/Wayland + OpenGL rendering                 |
+----------------------------------------------------------+
|  Browser Core                                            |
|  - Tab Management, History, Bookmarks                    |
|  - Downloads, Settings, Extensions                       |
+----------------------------------------------------------+
|  WebCore Engine                                          |
|  - HTML Parser (Tokenizer + Tree Builder)                |
|  - CSS Engine (Parser + Selector Matching)               |
|  - Layout Engine (Box Model + Flow)                      |
|  - Paint/Composite (GPU accelerated)                     |
+----------------------------------------------------------+
|  ZepraScript Engine                                      |
|  - Lexer, Parser, AST                                    |
|  - Bytecode Compiler                                     |
|  - Multi-tier JIT (Baseline, DFG, FTL)                   |
|  - Garbage Collector                                     |
+----------------------------------------------------------+
|  Networking                                              |
|  - HTTP/HTTPS Client (curl/OpenSSL)                      |
|  - WebSocket, Fetch API                                  |
+----------------------------------------------------------+
|  Platform Layer                                          |
|  - X11/Wayland Window                                    |
|  - File System, Process Sandbox                          |
+----------------------------------------------------------+

Directory Structure

zeprabrowser/
├── CMakeLists.txt                              # ROOT BUILD
├── Architecture.md                             # Architecture docs
├── README.md
│
├── source/                                     # === NEW ARCHITECTURE ===
│   │
│   ├── ThirdParty/                            # External dependencies
│   ├── aiEngine/                              # AI integration & LLM APIs
│   ├── bin/                                   # Built executables
│   ├── devtools/                              # Developer tools, debugger GUI
│   ├── extensions/                            # Extension system & sandbox
│   ├── integration/                           # Service integrations
│   ├── main.cpp                               # Application Entry
│   ├── media/                                 # Audio/Video processing
│   ├── networking/                            # Network stack, sockets
│   ├── nxbase/                                # NeolyxOS Base components
│   ├── nxcrypto/                              # Cryptography, TLS/SSL
│   ├── nxhttp/                                # HTTP/HTTP2 parser & client
│   ├── nxjson/                                # JSON parsing & generation
│   ├── nxrender-cpp/                          # Core rendering logic (C++)
│   ├── nxsvg_wrapper.cpp                      # SVG Rendering Support
│   ├── nxxml/                                 # XML/DOM parsing
│   ├── platform/                              # Cross-platform abstractions
│   ├── privacy/                               # Privacy & tracking protection
│   ├── sandbox/                               # IPC sandboxing model
│   ├── storage/                               # LocalStorage, IndexedDB, Cache
│   ├── webCore/                               # Core layout and rendering
│   ├── webGpu/                                # WebGL & WebGPU implementation
│   ├── webapp/                                # Progressive Web PWA
│   ├── zepraEngine/                           # Browser shell & core UI
│   └── zepraScript/                           # JavaScript Engine Core
│
├── config/                                    # Configuration files
├── docs/                                      # Documentation
├── tools/                                     # Dev tools
└── zepra.ketivee.com/                         # Branding assets

Key Components

1. ZepraScript Engine

Location: source/zepraScript/

The JavaScript engine implementing ECMAScript 2024. Features:

  • Multi-tier JIT compilation
  • Generational garbage collection
  • ES modules support & Web API bindings

Key Files:

  • frontend/lexer.cpp - Tokenization
  • frontend/parser.cpp - AST generation
  • bytecode/bytecode_generator.cpp - Bytecode
  • runtime/vm.cpp - Virtual machine
  • jit/baseline_jit.cpp - First-tier JIT
Explore ZepraScript Architecture

2. WebCore Engine

Location: source/webCore/

High performance HTML/CSS parsing and layout engine.

Key Files:

  • html/tokenizer.cpp - HTML5 tokenizer
  • src/html/tree_builder.cpp - DOM construction
  • src/css/parser.cpp - CSS parsing
  • src/css/selector.cpp - Selector matching
  • src/layout/box.cpp - Box model
  • src/paint/painter.cpp - Rendering
Explore WebCore Architecture

3. NXRENDER Graphics

Location: source/nxrender-cpp/

C++ based rendering system with OpenGL support.

Key Components:

  • nxgfx - GPU context, primitives, text
  • nxrender-core - Compositor, surfaces
  • nxrender-widgets - Button, TextField, etc.
  • nxrender-input - Mouse, keyboard, gestures
Explore NXRender Architecture

4. Networking

Location: source/networking/

HTTP client using libcurl and OpenSSL.

Key Files:

  • http_client.cpp - Request/response handling
  • cookie_jar.cpp - Cookie management
  • tls.cpp - HTTPS support
Explore Networking Stack

Building

Prerequisites

bash
# Ubuntu/Debian
sudo apt install build-essential cmake libcurl4-openssl-dev \
    libssl-dev libx11-dev libgl1-mesa-dev libfreetype6-dev \
    libharfbuzz-dev

# Build Browser
mkdir build && cd build
cmake .. -DUSE_NXRENDER=ON
make -j$(nproc)

Running

bash
cd build/bin
LD_LIBRARY_PATH=../../source/nxrender/target/release ./zepra_nxrender

Development Workflow

Adding a Web API

  1. Define interface in source/zepraScript/browser/
  2. Implement in source/zepraScript/browser/
  3. Register in global object
  4. Add tests

Adding HTML Element Support

  1. Add element handling in source/webCore/src/html/tree_builder.cpp
  2. Implement DOM interface in source/webCore/src/dom/
  3. Add layout behavior in source/webCore/src/layout/
  4. Add rendering in source/webCore/src/paint/

Adding CSS Property

  1. Add property to enum in source/webCore/include/webcore/css/properties.h
  2. Add parsing in source/webCore/src/css/parser.cpp
  3. Add computation in source/webCore/src/css/computed_style.cpp
  4. Use in layout/paint

References

Specifications

MDN Documentation

Code Style

C++ (ZepraScript, WebCore, NXRENDER)

  • C++17 standard
  • PascalCase for classes
  • camelCase for methods
  • snake_case for variables
  • Trailing underscore for members

Testing

bash
# ZepraScript tests
cd source/zepraScript/build
ctest

# WebCore tests
cd source/webCore/build
ctest

# NXRENDER tests
cd build_nxrender
ctest

Trademark Notice

ZepraScript is a registered trademark of KetiveeAI. All rights reserved.

HomeDocsCommunityBlog