Feature request: magic command to use viztracer from within jupyter notebook

[ogrisel]

Note sure what would be the best way to implement this, but the usability of viztracer could be greatly improved for datascientists and other Python users who work in interactive envrionments based on Jupyter such as Jupyter Lab and VS Code notebooks.

The setup use case would work as follow in jupyter notebook with the following cells:

# Notebook cell to enable the viztracer <=> jupyter extension
%load_ext viztracer

# Here is a notebook 
biggish_data = prepare_big_datastructure_or_load_from_disk()

# Here is a notebook cell with some code to interactively
# define some complex data processing function.

def some_function(some_data, some_param=0.):
     # do complicated stuff
     ...

# Here is a cell that profiles on
%%viztracer
some_function(biggish_data, some_param=42)

The last cell would execute some_function(biggish_data, some_param=42) while recording the profiling events to a temp file on the disk and then automatically display an iframe with the perfetto viewer of the recorded events right below the code cell with the %%viztracer statement.

If instead one uses %%viztracer --new-tab would open a new browser tab to the viewer instead of using an iframe.

Finally %%viztracer --static-html would embed the legacy static HTML viewer in the output of the cell of the notebok document to make it easier to publish and share the notebook (e.g. on https://nbviewer.jupyter.org) so that other can browse the profiling output without having to run a (local or remote) server (for jupyter and vizviewer).

It would also be possible to pass any viztracer commandline options to the magic command itself, for instance %%viztracer --log_gc --log_subprocess.

This setup is really nice, because prepare_big_datastructure_or_load_from_disk can be very slow and the user might want to iterate quickly by editing the code of some_function in the previous cell based on the result of the previous profiling output without calling prepare_big_datastructure_or_load_from_disk() again each time.

The last 2 cells could be even be collapsed into one for even faster coding iterations:

# Here is a notebook cell with some code to interactively
# define some complex data processing function and profile
# it on the fly:

def some_function(some_data, some_param=0.):
     # do complicated stuff
     ...

%viztracer some_function(biggish_data, some_param=42)

Related jupyter extensions for profilers that can be used for inspiration:

• jupyter supports the %%prun profiler magic based on cProfile from the standard library by default.
• line_profiler can register the %%lprun magic command.
• snakeviz can register the %%snakeviz magic command. It has the --new-tab option I mentioned before.

[gaogaotiantian]

Do you mean this - https://viztracer.readthedocs.io/en/latest/basic_usage.html#jupyter ?

[ogrisel]

That's very nice! Sorry I don't know how I could miss it. I googled it but did not found it on the first try for some reason.

Thank you very much and sorry for the noise :)

[ogrisel]

Just a note: it seems that when I click the button to open the perfetto app, the trace file is not automatically loaded. I have to click on the "Open trace file" button manually and browse my filesystem to open the json file.

I have the same problem with the vizviewer command, so it's not a problem specific to the jupyter integration.

[gaogaotiantian]

Not able to open the trace file with vizviewer (or jupyter button) is definitely a bug(at least a deficiency). I experienced this issue very rarely(but it happened before). I think it might be some racing issue. However, I can't reproduce it on my computer reliably. It would be nice if I have more info to solve the issue - for example, the dev panel(network tab I think?) of chrome for loading the data. Did it send the request to the local viztracer server? Did it receive the response? Basically where does it fail.

It would be a lot to ask you to do this much investigation to solve a VizTracer bug, so feel free to leave it alone, I might figure it out in the future when I can suddenly reproduce the issue more reliably. However, vizviewer is expected to open the specified trace file without any other actions and I put plenty of efforts in it :(

[gaogaotiantian]

Also if you use the "Open trace file" button, maybe you can't see source code when you click on the slice? That would be another huge lost for VizTracer customized front-end. I would just use official perfetto if that's what I want for VizTracer.

[ogrisel]

I use firefox 90.0.2.

• Here is the state of the Firefox dev console after opening the perfetto browser tab via the vizviewer command:

• Here is the state of the console after opening the perfetto browser tab via the notebook button:

Other problem: once I clicked the "VizTracer report" button once in the notebook, the browser tab opens fine. But it I close this tab and click the button again, nothing happens: I have to restart the jupyter kernel again and re-profile again instead of reusing the existing perfetto server that is probably still running in its thread or subprocess in the background.

[ogrisel]

Also if you use the "Open trace file" button, maybe you can't see source code when you click on the slice? That would be another huge lost for VizTracer customized front-end. I would just use official perfetto if that's what I want for VizTracer.

Indeed, there is no source code view when I click on an element of the trace. I just get the "Current selection" tab info:

[gaogaotiantian]

The TypeError in the console looks suspicious. I can't reproduce this on my machine with Chrome or Firefox. I think your browser respects typescript more than mine. I also checked the source of that piece and my code was in theory wrong, it's just not caught by my browser. Thanks for catching that.

I'll try to patch this soon and hopefully you can use vizviewer as it was intended to be used.

The Jupyter issue was triggered by this too as it waits for the front-end to load the trace data once before it closes itself so everything stuck there. I will also put a safe guard there so it will timeout if the front-end failed.

[gaogaotiantian]

@ogrisel I tried to fix the problem in both vizviewer and Jupyter. Could you be kind to test it out with pip install git+https://github.com/gaogaotiantian/viztracer and see if the problem persists? As I can't reproduce the problem on my local machine.

Also please notice that there might be some cache issue so if you see the same TypeError maybe you could click the refresh button on the top right corner to force clear the cache.

[ogrisel]

It's now trying to load the local trace but then I get the following error popup window:

Trace: http://127.0.0.1:9001/localtrace

Viewed on: http://127.0.0.1:9001

Error: RPC framing error
onRpcResponseMessage@http://127.0.0.1:9001/v17.0/frontend_bundle.js:76589:19
onRpcResponseBytes@http://127.0.0.1:9001/v17.0/frontend_bundle.js:76548:18
onMessage@http://127.0.0.1:9001/v17.0/frontend_bundle.js:76871:15

v17.0 62ada0edf15a53b2bd9f2294ece33ccdd8283745
UA: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:90.0) Gecko/20100101 Firefox/90.0

[ogrisel]

I also tried with google chrome and I do not get the problem (the trace loads successfully) accessing the server launched at http://localhost:9001 by the vizviewer localfile.json command.

[ogrisel]

More details:

[ogrisel]

Note that I tried refreshing the cache and I still get the above error.

[ogrisel]

FYI I have also tried to disable all my Firefox extensions and restart firefox and I still get the same problem. I also tried in a private browsing window and also get the same problem.

[gaogaotiantian]

First of all, thanks for putting this much effort into this. I really appreciate it.

This is a deeper issue now and is obviously browser dependent. I could not reproduce this on my local machine and it seems like this is an error in WASM generated by C++. This is a fatal error in the structure which is kind of weird to me.

Could you try to open http://localhost:9001/localtrace directly in your browser? That should send an equivalent request to the backend server and it should just open the json file in your browser. Also is the json file super large? I'm not sure if that'll affect anything. If you can open the json file directly but Perfetto can't load it correctly, then I'm out of ideas at this point. However, if you can't open the file in the browser either, then we can narrow it down to something outside of the Perfetto front-end.

Just to make it clear, as Perfetto is developed by Google, Firefox might not be their priority and I did not find if it's "officially" supported.

I guess the good news is at least it works on Chrome now, so it's still better than before(as long as you can still load the trace explicitly with the button).

[gaogaotiantian]

Also, have you had the error with vizviewer command or through Jupyter notebook? Jupyter notebook might be slightly more fragile than vizviewer.

[ogrisel]

Also, have you had the error with vizviewer command

Yes, I got the error with the vizviewer command.

[ogrisel]

Opening http://localhost:9001/localtrace on firefox works fine but takes a while to return the json events file.

I tried again with a smaller trace file and I can open http://localhost:9001/ from vizviewer on firefox successfully this time. So the problem is only present for very large trace files.

[gaogaotiantian]

Hmm, how large are we talking about? It's possible that Firefox has a different resource limit than Chrome which lead to this issue. If that's the case, then there's probably nothing I can do. Personally I use Chrome as my default browser and for the default trace entries I have never met a case where it fails to load. I'm sorry that this causes inconvenience for you, but it seems like at this point there's not much I can do on viztracer side to solve the issue.

[ogrisel]

I agree, this is probably a limitation of perfetto or firefox. Nothing to do in viztracer.

[laundmo]

I found a workaround, after getting the same RPC framing error:

You can load the json in https://ui.perfetto.dev/ and it works just fine.

So, this does not seem like a issue with Perfetto, rather with a interaction between Perfetto and vizviewer.

[gaogaotiantian]

@laundmo loading trace files from https://ui.pervetto.dev uses a different path than loading from URL, which is what vizviewer uses. I'm not saying that this is definitely a perfetto issue, but this could be even if loading the file works. Actually, did you check whether opening the trace file in vizviewer UI(which is of course perfetto too) works?

Can I ask the environment when you get the RPC framing error? Are you using MacOS + FireFox as well? Also are you using the latest VizTracer? Did it work on Chrome?

The reason I said it's more likely to be a Perfetto issue was because this error comes from a really low level code. Another possibility is that there's a bug in Python TCP server, which serves the trace file through HTTP. At this point, vizviewer really does not do much that could affect this.

One interesting experiment to do is to open the trace file through URL with official perfetto. Serve the localtrace with

vizviewer --server_only result.json

Then open https://ui.perfetto.dev/?url=http://localhost:9001/localtrace and see if this could reproduce the issue. If it did, then it's either Perfetto's issue or Python's TCP server issue(maybe 1% viztracer issue).

Also, it would be useful to know whether this only reproduces on certain OS and certain browsers. @ogrisel said it won't reproduce on Chrome and for large trace file only.

At this point, I really can't think of anything in vizviewer that might cause this issue, and I can't reproduce this on my own computer so it's even harder for me to track it down.

[laundmo]

@gaogaotiantian im unsure what you mean by vizviewer UI

As for the environment, it was Firefox on Windows, with a 100000 entry trace file (it reached the max)

I tried chrome after sending my previous comment, the trace file never loaded, and perfetto looked sort of broken, with the menu button text overlapping and the image not loading.

Then open https://ui.perfetto.dev/?url=http://localhost:9001/localtrace and see if this could reproduce the issue. If it did, then it's either Perfetto's issue or Python's TCP server issue(maybe 1% viztracer issue).

will try this tomorrow

[Dunedan]

Here is a workaround to use Perfetto as included in viztracer with Firefox:

viztracer …  # as usual
echo "{}" > results-empty.json
vizviewer results-empty.json
# In the Perfetto instance which opens in the browser, navigate to the Navigation menu, choose "Open trace file" and open "result.json"

[gaogaotiantian]

Here is a workaround to use Perfetto as included in viztracer with Firefox:

Well if you only need Perfetto, you can simply use https://ui.perfetto.dev/. That of course won't have the customized features like source displaying.