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:
- Consumes a stream of log events (assume you receive events one-by-one via a callback like
onEvent(event)or via a mocked interval). - Maintains an in-memory aggregation keyed by
category. - For each category, displays:
- frequency: total number of events seen for that category
- last update time: the most recent
timestampseen for that category
- 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 →