cswork / libraryOpen practice workspace

Interview questions · Elastic

Implement log aggregation in React

This question evaluates a candidate's front-end development and real-time data-aggregation skills, specifically React component state management, handling streaming updates, choosing appropriate in-memory data structures (e.g., Map), and timestamp parsing/comparison for per-category frequency and last-update tracking.

React Coding: Log stream aggregation

You are building a small React feature that displays real-time statistics from a log stream.

Log event format

Each incoming event has:

  • category: string (e.g., "auth", "payments")
  • timestamp: ISO-8601 string or epoch milliseconds (time the event occurred)

Example event:

{ "category": "auth", "timestamp": "2025-12-15T10:15:30Z" }

Requirements

Implement a React component (or a small set of components) that:

  1. Consumes a stream of log events (assume you receive events one-by-one via a callback like onEvent(event) or via a mocked interval).
  2. Maintains an in-memory aggregation keyed by category.
  3. For each category, displays:
    • frequency: total number of events seen for that category
    • last update time: the most recent timestamp seen for that category
  4. Renders the aggregation as a table/list that updates live as events arrive.

Constraints / notes

  • Use a Map (or justify an alternative) to store per-category stats.
  • Handle new categories appearing at any time.
  • Clarify how you handle timestamps (e.g., parse/compare) and what you display if there are no events.

Community answers

Nothing here yet.

Join in on CSWork →