thomasloven / lovelace-layout-card

🔹 Get more control over the placement of lovelace cards.
MIT License
1.05k stars 125 forks source link

Resource loading race conditions #263

Open Routhinator opened 10 months ago

Routhinator commented 10 months ago

My Home Assistant version: 2023.11.3

Layout-card version (FROM BROWSER CONSOLE): 2.4.4

What I am doing: Using this mod as per instructions

What I expected to happen: Consistent working behaviour

What happened instead: 75% dashboard loading failure rate due to race condition between layout-card and card-mod

Minimal steps to reproduce: Not terribly certain what would be helpful to add here, but I've install both mods as extra modules via yaml config and both URLs are loading correctly without errors.

Caches have been cleared on all clients. Successfully loading is currently a dice roll - if layout-card takes 1-3 ms longer to load than card-mod the loading is broken. It works if layout-card wins the race, and unfortunately layout-card is about 13kb larger, so it OFTEN loses, leading to a 75% fail rate.

Once a client has loaded it successfully and cached both it seems to be fine, but otherwise it's cache-busting roulette and hope you land on black.

I've tried to make sure l put layout-card first however it's not enough to make a difference.. half tempted to try a js wrapper that adds a pause to loading card-mod for 1 second...

Extra module config.

extra_module_url:
  - /local/community/lovelace-layout-card/layout-card.js
  - /local/community/lovelace-card-mod/card-mod.js

Here are screenshots of the behaviour. There are ZERO differences between these, all I did was press CTRL+F5 a few times to get one and then the other. Everything loads successfully in both cases (200 responses across the board) and no errors in the console.

Screenshot from 2023-11-26 16-14-24

Screenshot from 2023-11-26 16-14-35

Error messages from the browser console: There are zero errors in the console, just "Custom element doesn't exist" errors in the UI.


By putting an X in the boxes ([X]) below, I indicate that I: