✨ What is Zync Log?

Zync Log is a lightweight npm package that bundles a high-performance ASP.NET Core log streaming engine with a modern React dashboard. With a single terminal command, it opens an interactive log analyzer in your browser — zero cloud services, zero telemetry, and zero setup required.

Zync Log is built specifically to provide first-class, native support for Serilog structured logs, making it effortless to debug .NET web applications, microservices, and background services directly on your local machine.

💡 Why Zync Log?

| Feature | Zync Log | LogExpert | Notepad++ | | ---------------------- | :------: | :-------: | :-------: | | Serilog native support | ✅ | ❌ | ❌ | | Analytics dashboard | ✅ | ❌ | ❌ | | Correlation timeline | ✅ | ❌ | ❌ | | One command install | ✅ | ❌ | ❌ | | Works offline | ✅ | ✅ | ✅ |

No cloud account. No configuration files. Just point at your log folder and go.

🚀 Quick Start

Install globally

npm install -g @zync-log/zync-log

Run

zync-log

The browser opens automatically and the dashboard is ready to explore your logs.

Point to your log folder

Serilog / ASP.NET Core — pass the folder where your app writes daily .log files:

# Windows
zync-log "D:\MyApp\Logs"

# macOS
zync-log "/Users/you/MyApp/Logs"

# Linux
zync-log "/var/log/myapp"

Typical Serilog file layout Zync Log understands out of the box:

Logs/
  log-20260630.txt
  log-20260629.txt
  ...

You can also pick a folder from the in-app Settings screen if you run zync-log with no arguments.

📦 How It Works

┌─────────────────────────────────────────────────────┐
│  Terminal                                            │
│  $ zync-log "D:\MyApp\Logs"                          │
│         │                                            │
│         ▼                                            │
│  Starts  ZyncLog.Api  (ASP.NET Core, port 4521)     │
│         │                                            │
│         ▼                                            │
│  Opens  http://localhost:4521  in your browser       │
│         │                                            │
│         ▼                                            │
│  React Dashboard streams and renders your logs ⚡    │
│  Open Analytics for charts, heatmaps & insights 📈  │
└─────────────────────────────────────────────────────┘

• The backend is a self-contained ASP.NET Core 8 binary (no .NET runtime required).
• The frontend is a pre-built React + Vite SPA bundled inside the API.
• Logs are parsed and streamed over Server-Sent Events (SSE) for instant rendering.

⚡ First-Class Serilog Structured Log Support

Zync Log is designed from the ground up to parse and showcase Serilog structured log files clearly and beautifully.

🔹 Correlation Tracking ID Visualization

Every log entry with a Correlation ID, TraceId, or ConnectionId is highlighted with a distinct, clickable tag in the UI. Clicking any Correlation Tracking ID opens a Correlation Timeline drawer on the right side of the screen.

The timeline shows the full end-to-end request flow in chronological order, with each step labeled by source type:

• API1 (blue) — your main application / entry service
• API2 (green) — downstream or external API calls
• Database (purple) — SQL, Entity Framework, and repository activity
• Error (red) — error or fatal events in the chain

Expand any step to see the full message, service name, HTTP request details, properties, and stack traces — the same rich detail you get in the main log view.

🔹 Exact Log Level Filters

Filter your logs in real time using dedicated, color-coded level buttons:

• All — View complete stream of all log severity levels
• Info — Informational diagnostic events
• Warn — Warnings and potential application issues
• Error — Application exceptions and runtime failures
• Debug — Verbose development and step-by-step debug events
• Fatal — Critical system failures and fatal errors

🔹 Automatic Property Extraction & Key-Value Parsing

Serilog structured output parameters (e.g. {UserId: 42, RequestPath: "/api/orders"}) and context tags (e.g. (SourceContext: OrderService)) are automatically extracted and formatted into clean key-value badges and inspectable detail modals.

🔹 Multi-Line Exception Stack Trace Collapsing

Multi-line exception stack traces generated by Serilog are automatically linked to their parent log event, neatly collapsed in the UI with copy-to-clipboard functionality to keep your log view clean and readable.

🎯 Key Features

🗂️ Multi-Source Log Support

• Local folder — Point to any log directory on your machine.
• UNC / network paths — Full support for mapped drives and network shares (\\server\logs).
• Auto-detect — Automatically scans common ASP.NET and IIS log paths without manual configuration.
• Live mode — Auto-refreshes for active log streams in real time.

🔍 Powerful Search & Filtering

• Full-text keyword search across messages, properties, and exceptions.
• Filter by exact log level buttons: All, Info, Warn, Error, Debug, Fatal.
• Filter by date — automatic daily log file detection.
• Saved searches — Save frequently used filter combinations.
• Search history — Recent queries tracked automatically.

⚡ Ultra-Fast Streaming Performance

• Logs stream on-the-fly via SSE — rendering begins within milliseconds even for massive multi-gigabyte log files.
• FastLogReader engine uses compiled static Regex patterns and zero-allocation memory buffers for 3–5× faster parsing.
• In-memory caching via LogCacheService ensures repeated date switches are instantaneous.

📊 Log Statistics & Insights

• Live log level heatmap and count breakdown rendered above the log table.
• Floating ⚡ Next Error button for jumping directly to the next Error or Fatal log entry.
• One-click access to the full Log Analytics Dashboard (see below).

📈 Log Analytics Dashboard

Turn a day of logs into clear charts and actionable insights — without leaving the app or losing your place in the log stream.

How to open

1. Select a date from the dropdown and wait for logs to load.
2. Click the Analytics button in the top toolbar (next to Live and Refresh).

The analytics view opens instantly as an overlay. Your logs stay loaded in the background — click Back to Logs anytime and continue exactly where you left off.

Note: Analytics always reflects the currently selected date — the same logs you see in the log viewer for that day.

What you get

Summary at a glance

Four headline cards show the big picture for the selected day:

| Card | What it shows | | ---------------------- | --------------------------------------------- | | Total Log Lines | How many log entries were loaded for the date | | Total Errors | Count of Error-level events | | Total Warnings | Count of Warning-level events | | Time Range Covered | First and last log timestamp for that day |

Log Volume Over Time

An hourly chart of how many logs were written throughout the day. A peak volume marker highlights the busiest hour so you can spot traffic spikes quickly.

Log Level Distribution

A donut chart breaking down how your logs split across Info, Warn, Error, Debug, and Fatal — with percentages for each level.

Top Errors

The 10 most frequent error messages, ranked by how often they appear. Click any error to jump back to the log viewer with that message pre-filled in search — so you can inspect every matching line immediately.

Noisiest Modules

See which services, classes, or source contexts produced the most log lines. Helpful for finding chatty components or modules that flood your logs.

Recent Critical Errors

A live feed of the latest Error and Fatal entries. Click Jump to line on any item to scroll directly to that log in the main viewer.

Error Heatmap (by Hour)

A GitHub-style contribution grid for errors:

• Rows = days
• Columns = hours (0–23)
• Color intensity = how many errors occurred in that hour (light purple → bright purple → red for high counts)

Click any cell to open a popup with the error messages from that specific day and hour.

Why it's fast

Analytics are computed directly from the logs already loaded in your browser — no extra round-trips to the server, no waiting for a separate page to load. Stats update in the background as logs stream in, so opening Analytics feels instant even with tens of thousands of log lines.

🗂️ Supported Log Formats

Zync Log seamlessly handles standard Serilog text templates and JSON formatted logs:

2026-06-27 10:45:12.345 +05:30 [INF] (CorrelationId: 8f9b2c1a-4e3d-2c1b) OrderService — Processing order {OrderId: 1042, Amount: 99.99}

The parsing engine automatically separates:

• Timestamp: ISO and standard date-time formats with timezone offset handling
• Level: Color-coded badges for Info, Warn, Error, Debug, Fatal
• Correlation Tracking ID: Interactive tag for full request lifecycle tracing
• SourceContext: Logger context / class name
• Properties: Custom structured properties attached to the log event
• Exceptions: Stack traces and inner exceptions

🖥️ Platform Support

| Platform | Status | | ------------------- | ------------------ | | Windows (x64) | ✅ Fully supported | | macOS (arm64 / x64) | ✅ Fully supported | | Linux (x64) | ✅ Fully supported |

The API binary is a self-contained .NET 8 executable — no separate .NET installation is required.

🛠️ CLI Reference

zync-log [logDirectory]

| Argument | Description | Default | | -------------- | ----------------------------------------------------------------- | --------------------- | | logDirectory | Absolute path to the folder containing your .log / .txt files | Empty (choose via UI) |

🔌 API Endpoints

The embedded API exposes a clean REST + SSE interface:

| Method | Route | Description | | -------- | ------------------------------- | -------------------------------------------------------------------------- | | GET | /api/logs/dates | List available log dates in the configured directory | | GET | /api/logs/stream | Stream log entries over SSE (date, level, search, customPath query params) | | GET | /api/logs/search | Search logs with advanced query syntax | | GET | /api/logs/saved-searches | List saved search queries | | POST | /api/logs/saved-searches | Save a search query | | DELETE | /api/logs/saved-searches/{id} | Delete a saved search | | GET | /api/logs/search-history | Retrieve recent search history | | GET | /api/logs/correlation/{id} | Get all log entries matching a CorrelationId | | GET | /api/system/pick-folder | Open native OS folder picker |

🗂️ Project Repositories

Zync Log is built across three open source repositories. If you want to explore the source code, contribute, or report issues specific to a part of the project — here is where to go:

| Repository | What it contains | GitHub | | ------------ | --------------------------------------------------------------------- | ------------------------------------------------------------------ | | zync-log | 📦 npm CLI package — installs and launches the log viewer (this repo) | github.com/zync-ui/zync-log | | zync-web | ⚛️ React + Vite frontend — the log viewer UI rendered in your browser | github.com/zync-ui/zync-web | | zync-api | ⚙️ ASP.NET Core 8 backend — log parsing, SSE streaming, and REST API | github.com/zync-ui/zync-api |

The @zync-log/zync-log npm package automatically bundles the latest production builds of both zync-web and zync-api into a single install — so users only need one command to get everything running. The individual repositories exist for contributors who want to work on a specific layer of the project.

🤝 Contributing

Issues and pull requests are welcome at github.com/zync-ui/zync-log.

📄 License

MIT © Sabari raj p