[Bug]: Frontend doesn't show devices or settings but Z2M continues to function

[jamesrossell]

What happened?

Issue Description:

We encountered a significant issue where zigbee2mqtt appeared to struggle with processing the configuration.yaml file when it included base64 encoded images under the icon: and data: keys for each device entity. The inclusion of these encoded images significantly increased the file size and complexity, potentially leading to problems with file parsing or memory constraints during the application's runtime.

Steps to Reproduce:

Add multiple device entries in the configuration.yaml file for zigbee2mqtt. For each device, include a base64 encoded image directly in the file under the icon: and data: keys. Attempt to run or process the configuration through zigbee2mqtt. Expected Behavior: The application should be able to handle large configuration files, including those with base64 encoded images, without issues in parsing or performance degradation.

Actual Behavior: The presence of base64 encoded images in the configuration file led to difficulties in processing the file, which could include errors in parsing, increased memory usage, or the inability to load the configuration properly.

Workaround/Solution: The immediate solution was to remove the icon: and data: keys along with their base64 encoded images from each device entry in the configuration.yaml file. This significantly reduced the file size and complexity, allowing zigbee2mqtt to process the configuration without any issues.

Suggested Fix: Consider implementing a mechanism to handle large configuration files more efficiently or provide guidelines on the inclusion of image data within configuration files to prevent similar issues. An alternative approach could be to reference images externally rather than embedding them directly into the configuration file.

What browsers are you seeing the problem on?

Firefox, Chrome, Microsoft Edge

Relevant stacktrace

No response

Did you download state.json.zip?

I will not attach state.json.zip

[mrskycriper]

Got the same issue today, those 512x pngs are pushed it over the edge. The current approach is indeed problematic

[jb1228]

Wish I saw this a week ago!

I have been pulling my hair out trying to figure out why the frontend was not loading completely. There was nothing to indicate any issues/errors in the logs or web console, and the backend continued to function.

I finally tried deleting all the icon properties in the devices.json file just to eliminate any chance of encoding/formatting issues, large file size, etc.; and it started working again.

After removing the icon data, the devices.json file size when from 4.2 MB down to 5 KB.

For reference, here is what I am currently using:

• Zigbe2MQTT v1.38.0
  • Frontend v0.7.1
• Home Assistant 2024.6.4
• Total Devices: 73

[mrskycriper]

Wish I saw this a week ago!

I have been pulling my hair out trying to figure out why the frontend was not loading completely. There was nothing to indicate any issues/errors in the logs or web console, and the backend continued to function.

I finally tried deleting all the icon properties in the devices.json file just to eliminate any chance of encoding/formatting issues, large file size, etc.; and it started working again.

After removing the icon data, the devices.json file size when from 4.2 MB down to 5 KB.

For reference, here is what I am currently using:

• Zigbe2MQTT v1.38.0

  • Frontend v0.7.1

• Home Assistant 2024.6.4

• Total Devices: 73

I'll look into this issue in July, when I get some free time. Images probably should be cached as files with only URIs in the config file.