Advice to improve loading time

[gabrielg478]

The more I dig into this card, the more I love it, but also the more question I have.

I have a view with five yearly statistics about my car: odometer, energy charged, etc...

So far I display it with ApexCharts, but I would like to migrate on SGCC card. The date selector will be a very nice feature once I'll reach more than a year of datas.

Everything is working fine, but I was wondering if there was a way to improve loading time. The "ApexCharts" version loads in about 2 seconds, and the "SGCC" version loads in about 4 seconds. Of course more features means more processing, but I was wondering if 4 seconds seems reasonnable for 5x7 months of datas or if I can improve someting.

As per the wiki I activated auto_scale_points and avoided extra features like points and label. I tried with/without date selector without noticeable difference. I also tried to remove card_mod without noticable difference.

Here's a screenshot of what it looks like, and the code for one card. I'm running on HA Green, memory usage never exceed 20%.

type: custom:statistics-graph-chart-card
card_header: Kilométrage
card_header_size: 20px
card_shadow: false
card_border: false
show_now_line: false
brush_zoom: false
hours_to_show: 8460
points_per_hour: 1
auto_scale_points: true
tooltip_match_axis: false
tooltip_order: default
height: 225
bar_spacing: 20
min_bound_range: 0
lower_bound: "0"
y_axis_font_size: 12
y_axis_font_opacity: 1
x_axis_color: "#ffffff"
x_axis_date_color: "#ffffff"
x_grid_style: solid
x_grid_width: 0
x_grid_color: "#ffffff"
y_grid_style: dashed
y_grid_width: 2
y_grid_color: "#ffffff"
y_grid_opacity: 0.2
date_picker_default_mode: year
date_picker_modes:
  - year
entities:
  - entity: sensor.skoda_enyaq_kilometrage
    graph_type: bar
    show_extrema_max: false
    show_extrema_min: false
    extrema_show_timestamp: false
    aggregate_func: change
    show_trend_icon: false
    show_color_dot: false
    show_extrema: never
    hide_name: true
    color: "#488fc2"
    state_size: "20"
    point_colors: "#a4b3c1"
    icon_color: "#9d436f"
    state_color: "#eef2f6"
    gradient: false
    show_fill: false
    tooltip_name: Kilométrage
    show_line: false
    decimals: 0
    primary_state_as: last
annotations: []
card_mod:
  style: |
    ha-card {
      border-radius: var(--border-radius-1) !important;
      box-shadow: var(--box-shadow-off) !important;
      background: var(--custom-button-infobox) !important;
    }
      svg.sgc-svg rect.sgc-bar {
        fill-opacity: 0.5 !important;
        stroke-width: 1.5 !important;
        stroke: rgba(72, 143, 194, 1.0) !important;
        stroke-opacity: 1 !important;
      }
view_layout:
  grid-area: main1

[cataseven]

Yes I am working on performance right now. Especially on LTS I need to improve

[cataseven]

@gabrielg478 Can you please test with test-release-3.34v2?

Cheers

[gabrielg478]

Hi,

@cataseven Sorry but I must say I did not saw a huge improvement in loading time with 3.34v2. ;-)

But everything display as expected.