Flooplan is slow on Android Home Assistant app

[done7k]

Since September 2023 I notice my floor plan is slow on my mobile (Android 11).
I have installed Floor Plan v. 1.0.39 now and use 'Home Assistant' android app v 2023.10.2.
Right before that it was very good. it still works fine on iPad and Firefox either PC or this mobile device. But it significantly slow via the app. All other functionalities of my Lovelace are fine. But the floor plan just too slow to react. Before the last app upgrade it was even crashing when attempted displaying the floor plan.

Does anyone noticed the same behavior? Is there any issues in the app while working with SVG? Should I open an issue in the app forum?

[exetico]

Hi done7k,

Thank you for the possible bug report.

Could you plese try and revert pack to a previous version, and see if it changes anything? I'd also recommend you to clear cache and temporary files in your browser and Home Assistant app.

Version 1.0.37 can be found here:
https://raw.githubusercontent.com/ExperienceLovelace/ha-floorplan/1.0.37/dist/floorplan.js

You'd need to replace the code manually, or use HACS:

[OzGav]

Is the app accessing your instance in the same way as your browser? For example, is one using the local IP and the other the cloud or external URL?

[done7k]

absolutely the same local IP if I am home or the same external URL if I am away.

[OzGav]

I don’t know why this would be for you. What functions are you using in your floorplan? Maybe you are doing something no one else is?

[done7k]

Oooops. you are right! I completely forgot , I use a custom function to draw a house shadow basing on sun position. it looks it became too heavy since this September. Hmmm. I have just commented the call of this function and it is fast again... here is the code... seems I will need to redo the func.. it looks nice...

return {
      getShadow: (entity, entities, hass) => {
        function getline (xx, yy, blur, c) {
          var x = Math.abs(xx);
          var y = Math.abs(yy);
          const xs = (xx < 0) ? -1 : 1;
          const ys = yy < 0 ? -1 : 1;
          var line = "";
          var coef = (x >= y) ? y/x : x/y;
          var fmax = (x >= y) ? x : y;
          for (let i = 0; i < fmax; i++) {
            var j = Math.round( i * coef );
            var oo = c["o"] * i / fmax;
            var shadow_color = `rgb(${c["r"]} ${c["g"]} ${c["b"]} / ${oo.toFixed(2)})`;

            line += x >= y ?
              `drop-shadow(${i*xs}px ${j*ys}px ${blur} ${shadow_color}) `:
              `drop-shadow(${j*xs}px ${i*ys}px ${blur} ${shadow_color}) ` ;
          };
          // console.log("getShadowlog2:: " +line);
          return line;
        };
        var shadow_color = "rgb(70 70 70 / 0.4)";
        var color = {r:70, g:70, b:70, o:0.3};

        var blur = "0px";
        var offset = 30;
        var shl = 15;
        var az = entity.attributes.azimuth;
        var deg = az + offset;
        if (deg > 360) { deg = deg - 360; }
        var x = Math.round(-1 * shl * Math.cos(deg * Math.PI / 180) );
        var y = Math.round(-1 * shl * Math.sin(deg * Math.PI / 180));

        //console.log("getShadowlog:: " +
        //  "azimuth=" + az + " " +
        //  "deg=" + deg + " " +
        //  "x=" + x + " " +
        //  "y=" + y);
        // getline(x,y,blur,shadow_color);


        // return `filter: drop-shadow(${x}px ${y}px ${blur} ${shadow_color})`;

        return `filter: ${getline(x ,y, blur, color)}`;

[OzGav]

Great that we have got to the bottom of it. Please mark this as answered. Very cool idea of yours BTW

[done7k]

Yes, ok.. I made the shadow length shorter line: var shl = 11; and it is pretty ok now.. Thanks!