Add execution time tracking and display for each ReAct step

[FatBy]

Description

When the AI executes a multi-step task, it would be helpful to see how long each step took. This helps users understand performance bottlenecks and LLM response times.

Current Behavior

• Execution steps are shown in the Task Monitor
• No timing information displayed

Expected Behavior

• Each step shows its duration (e.g., "2.3s")
• Total task execution time shown at completion
• Optionally: a simple bar chart of step durations

Suggested Approach

1. Record Date.now() at step start/end in LocalClawService.ts
2. Add duration field to execution step data
3. Display in Task Monitor UI (src/components/houses/TaskHouse.tsx)

[Yojitkataria]

Hi! @FatBy I'd like to work on this issue.

I plan to add timing for each execution step in LocalClawService and display the duration in the Task Monitor UI.

Please let me know if this approach sounds good or if you have any suggestions. Thanks!

[FatBy]

Thanks for the feedback!

In addition to the timing, I'd also like to suggest adding Token usage tracking for each step. Monitoring the number of tokens consumed (both prompt and completion) would provide valuable insights into cost and performance alongside the duration metrics.

I can implement this by collecting the token counts from the model responses and displaying them in the Task Monitor UI as well. Does this sound like a good addition?

[Yojitkataria]

Thanks for the suggestion!

I’d like to start with implementing step duration tracking first to ensure that works correctly.

After that, I can look into adding token usage tracking as a follow-up if needed.

Please let me know if that sounds good!