<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<p>On 07/09/2023 13:02, Peter Bennett wrote:<br>
</p>
<blockquote type="cite"
cite="mid:53f39c6f-3dba-adb0-7480-78db3500c3c4@gmail.com">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<p><br>
</p>
<div class="moz-cite-prefix">On 9/6/23 17:01, Paul Harrison wrote:<br>
</div>
<blockquote type="cite"
cite="mid:65b55e79-c61b-a6d9-63df-693de8b46cff@mythqml.net">
<p>You should also be able to use your browsers debug tools to
see how long each network operation takes as well.</p>
<p><br>
</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px;
margin-right:0px; -qt-block-indent:0; text-indent:0px;">Big
disclosure I haven't been able to test the latest WebApp but
when Stuart and I started the initial development the WebApp
was very fast but as we added more stuff it started to slow
down dramatically for me but not for Stuart! I was seeing
regular delays of 10 to 15 seconds to update the screen. We
never figured out why I was seeing it and not Stuart or what
the cause was. Angular does shift most processing to the
client end ie the machine running the browser rather than what
is more traditional with stuff like php where most of the
processing is done at the server end. At the time I was using
a 16 core Ryzen 7 so it can't be lack of processing power on
the client end. I was running the BE in a ESXI virtual machine
which may have contributed to the slow down since the WebApp
does sent many requests to the backends services API but I
never found any evidence to support that idea.</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px;
margin-right:0px; -qt-block-indent:0; text-indent:0px;"><br>
</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px;
margin-right:0px; -qt-block-indent:0; text-indent:0px;">If Jan
is seeing many of the screens showing very slow update times
then she may be seeing the same thing I was. If it's just one
screen then it's likely something else. One thing you need to
know with Angular is that it is basically one giant web page
that has the entire WebApp on it. Angular just hides and shows
stuff based on what the user clicks on once the page is
loaded. It does mean that the initial loading is always slow
since the browser has to pull the several hundred megabyte? of
data for the entire WebApp before it shows the page you want.
At least that is the way I believe it works. <br>
</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px;
margin-right:0px; -qt-block-indent:0; text-indent:0px;"><br>
</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px;
margin-right:0px; -qt-block-indent:0; text-indent:0px;"><br>
</p>
</blockquote>
<p>While developing the code I have found in some cases
unacceptably long responses, in particular with upcoming shows
and recorded list. In both cases I fixed it by switching to a
virtual list with lazy load. That was an immediate huge
improvement. I have the code ready to switch videos to a virtual
list with lazy load. I want to make sure that the problem the
user is experiencing is on the angular side, not the server
side. Lazy load will not help if the server is taking a long
time to produce the list.</p>
<p>Peter<br>
</p>
</blockquote>
<p><br>
</p>
<p>I made some time to at least get a working backend running again
so I could test the latest code. For me there are still some long
delays like when switching to some tabs or if a page refresh is
done. I tried both Firefox and Chromium browsers both work the
same.</p>
<p><br>
</p>
<p>Using the browser debug tools I found something interesting. More
often than not one of the requests sent to the backend will result
in a 10 second wait before it receives any data. I'd be interested
to know if anyone else can see these 10 second delays.</p>
<p><br>
</p>
<p>If while viewing one of the WebApp pages you open the debug
tools, right click and select 'Inspect' in the context menu or
press Ctrl+Shift+I, click the network tab in the debug window,
then click refresh or press F5 on the WebApp window. You should
see the list of requests update. Look for any with a tortoise
symbol in the Filename column, those are the requests that the
browser thinks where slow. If you click one of them you can see
the timings. For me the slowest requests always spend just over 10
seconds waiting. The file that is slow isn't always the same one
it seems to be random which one is slow, although I think all so
far have been in the root directory like main.js in the linked
screenshot. <br>
</p>
<p><a class="moz-txt-link-freetext" href="https://mythqml.net/img/Screenshots/WebApp-timings.jpg">https://mythqml.net/img/Screenshots/WebApp-timings.jpg</a></p>
<p><br>
</p>
<p>Paul H. <br>
</p>
</body>
</html>