TL;DR

This PR aims to improve the performance of the console tab. The goal was to at least be able to confidently display 10k logs and make the experience as smooth as possible. The dependency tanstack-virtual for solidjs was added to make sure we only render the DOM elements which are necessary for the view.

Acceptance criteria

• General handling of 10k + logs
• Switching between tabs without breaking (for example from console -> sources -> console / note that the calls tab is currently not working with a large number of spans, so please try to test the other tabs when switching, PR for the calls tab is coming)
• Filtering should be smooth with logs coming in and when inactive
• Console tab should work fine with cached logs when disconnected

Let me know

If there is anything odd in general please let me know.

Help with testing this

In my testing I just spammed events from my tauri app. Please feel free to be more creative with testing:

let mut count = 0;
// Infinite loop
loop {
    count += 1;
    tokio::time::sleep(Duration::from_millis(1)).await;
    window
        .emit(
            format!("test{}-event", count).as_str(),
            &EventPayload {
                key: "count",
                value: count.to_string(),
            },      
    ).unwrap();
    tracing::debug!("test{}-event", count);

    if count == 15000 {
        // Exit this loop
        break;
    }
}

Fixes DT-112