How to debug a (randomly) slow live view?

Hi all,

what are the tools and strategies to debug a live view which is randomly slow to reach the connected mount state?
The topbar goes fast until almost the end and then slows down, is that an indicator of something or is that like Windows 98 progress bars?

I know this is quite a broad topic, but do you have any hint?

Thank you

1 Like

Does this happen in every browser?

Yes.

But I just noticed I can’t reproduce that on our deployed instance.

Can the Phoenix live_reload affect the mounting of live views?
It seems I can reproduce it only when I am frequently modifying the code.

That’s a good question. I’ve noticed something similar in development but haven’t investigated it yet. I thought it was something to do with Firefox, but haven’t tried in other browsers.

Also, now that you mention it, I don’t think I’ve seen this in production either.
I don’t have further ideas on how to debug this. I guess adding some logs here and there. Or attaching a debugger might help investigate it.

You could use :eprof Erlang library.

Start phx server in iex.

{:ok, pid} = :eprof.start #start profile process
:eprof.log("log") #create log
{:ok, result} = :eprof.profile([pid], Module, :function, [params])  # start profiling
:eprof.analyze(:total) #profile info

I ran this on a new Pheonix project.
{:ok, result} = :eprof.profile([self()], AppWeb.CoreComponents, :modal, [%{}])

Here were the results:

FUNCTION                                                  CALLS        %  TIME  [uS / CALLS]
--------                                                  -----  -------  ----  [----------]
lists:keyfind/3                                               2     0.00     0  [      0.00]
gb_trees:empty/0                                              1     0.00     0  [      0.00]
gen_server:decode_msg/9                                       1     0.00     0  [      0.00]
gen_server:try_dispatch/3                                     1     0.00     0  [      0.00]
gen_server:handle_common_reply/8                              1     0.00     0  [      0.00]
maps:merge/2                                                  1     0.00     0  [      0.00]
erlang:timestamp/0                                            1     0.00     0  [      0.00]
erlang:ensure_tracer_module_loaded/2                          2     0.03     1  [      0.50]
'Elixir.AppWeb.CoreComponents':'modal (overridable 1)'/1      1     0.03     1  [      1.00]
erlang:trace_pattern/3                                        2     0.06     2  [      1.00]
'Elixir.AppWeb.CoreComponents':modal/1                        1     0.06     2  [      2.00]
gen_server:try_dispatch/4                                     1     0.12     4  [      4.00]
gen_server:handle_msg/6                                       1     0.12     4  [      4.00]
gen_server:loop/7                                             1     0.15     5  [      5.00]
erlang:system_flag/2                                          2     5.25   177  [     88.50]
erts_internal:trace_pattern/3                                 2    94.19  3178  [   1589.00]
--------------------------------------------------------  -----  -------  ----  [----------]
Total:                                                       21  100.00%  3374  [    160.67]
3 Likes

What am I missing here?

iex(5)> :eprof.start
** (UndefinedFunctionError) function :eprof.start/0 is undefined (module :eprof is not available)
    :eprof.start()
    iex:5: (file)

Nevermind, going to have a play with Debugging — Elixir v1.16.1 as my phoenix app goes into the 10s of GBs when I show a db entry. Odd.

Cool. Found it with Observer. God I love Elixir.

It’s me then :slight_smile:

3 Likes