delay the first chart init at the end of the loop to avoid too many animations happening at once

ui/src/css/logs.css

@@ -42,7 +42,7 @@
     /* chart inited */
     &:has(.uplot) {
         height: auto;
-        max-height: 200px; /* fallback for interpolate-size */
+        max-height: 180px; /* fallback for interpolate-size */
     }
     .uplot {
         padding-bottom: var(--smSpacing);

ui/src/logs/logsChart.js

@@ -71,6 +71,7 @@ export function logsChart(logsSettings) {
             initChart(el, [timestamps, totals], logsSettings);
         } catch (err) {
             if (!err?.isAbort) {
+                clearTimeout(placeloderChartTimeoutId);
                 logsSettings.isChartLoading = false;
                 // only log to avoid showing multiple errors with the logs listing
                 // app.checkApiError(err)

ui/src/logs/logsList.js

@@ -92,6 +92,7 @@ export function logsList(logsSettings) {
             logsSettings.hasListItems = data.logs.length > 0;
 
             if (!logsSettings.isFirstLoadReady) {
+                await new Promise((r) => setTimeout(r, 0));
                 logsSettings.isFirstLoadReady = true;
             }
         } catch (err) {