Apex charts buggy since recently (HA 2024.05?)

[HABO7405]

Checklist

• [ x] I updated the card to the latest version available
• [ x] I cleared the cache of my browser
• [ x] I verified that I'm really running the lastest version in my browser console
• [ x] I checked if there is another issue opened with the same problem

Describe the bug
Apex chart 'buggy' since recently. Opening the tabs in the dashboard with an Apex-chart on it:

• the desktop browser gets very busy: it takes seconds before the chart displays
• the mobile HA-app takes seconds to display, after displaying, the HA-app gets black and stops responding

After creating a number of charts (about 9 in one dashboard with 13 tabs) about a month ago, the charts worked fine (no significant browser- / app-claim). It took a bit time, but everything was quite responsive. Since then I made no change to the charts.

Please advise on additional information needed to assess the issue.

Last changes:

• added a Z-wave-stick (Aeotec)
• updated to HA 2024.05

Version of the card
Version: 2.0.4

To Reproduce
This is an example of the configuration I used:

   - type: custom:apexcharts-card
    graph_span: 72h
    yaxis:
      - id: _temperatuur
        decimals: 0
        apex_config:
          tickAmount: 6
      - id: _luchtvochtigheid
        decimals: 0
        opposite: true
        apex_config:
          tickAmount: 4
    apex_config:
      chart:
        zoom:
          type: x
          enabled: true
          autoScaleYaxis: false
        dropShadow:
          enabled: true
        toolbar:
          show: true
          autoSelected: zoom
        xaxis.type: datetime
        height: 150px
    color_list:
      - '#E60000'
      - '#0096C7'
    all_series_config:
      stroke_width: 3
      opacity: 0.3
      type: area
    header:
      show: true
      title: Keuken
      show_states: true
      colorize_states: true
    series:
      - entity: sensor.aqara_temp_hum_keuken_temperatuur
        yaxis_id: _temperatuur
        data_generator: ''
        curve: smooth
        name: Temperatuur
      - entity: sensor.aqara_temp_hum_keuken_luchtvochtigheid
        yaxis_id: _luchtvochtigheid
        data_generator: ''
        curve: smooth
        invert: false
        name: Luchtvochtigheid

Screenshots

Expected behavior
Responsive

Desktop (please complete the following information):

• Browser [Chrome]
• Version [124.0.6367.78]

Smartphone (please complete the following information):

• Device: [iPhone13 pro]
• OS: [IOS 17.4.1]
• Browser [Chrome]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[ChrisMarriott38]

I have noticed similar issues. One being this was a perfect gradient before. But now all the colours are overlaid on the entire time, it doesn't seem to factor in the unit blocks for the colour change now.

type: custom:apexcharts-card
experimental:
color_threshold: true
apex_config:
chart:
height: 200
stroke:
width: 2
series:

• entity: sensor.lux_battery
  show:
  in_header: false
  legend_value: false
  color_threshold:
  • value: 100
    color: rgb(255, 0, 201)
  • value: 80
    color: green
  • value: 60
    color: rgb(0, 252, 255)
  • value: 40
    color: orange
  • value: 20
    color: red

Can see all thresholds are overlapping.

[Din-BH]

I also face issues after the said HA upgrade. Charts take forever to load which for some charts crashes my viewer.

[midadami]

Same, some charts definitely take longer to load than usual. In my case the results once loaded (5s to load right now) display correctly.

[mrlordziemniak]

same here!!! HA is very laggy now!