Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Browser package (npm) #21

nturley opened this issue Mar 13, 2021 · 4 comments

Browser package (npm) #21

nturley opened this issue Mar 13, 2021 · 4 comments


Copy link

nturley commented Mar 13, 2021

This was discussed on twitter a few times but I thought it would be helpful to track it here.

Use Cases

  • netlist visualization
    • type verilog in the browser and see the netlist update in real time
  • resource usage visualization
    • I started working on this thing that would fetch fusesoc projects from github, synthesize them and display resource usage as a sunburst diagram
    • Running it client-side prevents users from using it as synthesis-as-a-service, we are using the users CPU cycles, not my CPU cycles
  • Place and route visualization
    • I havent tried this but it would be interesting to play with
  • Simulation with cxxrtl
    • Useful for FPGA workshops where you dont want to deal with machine setup or user hardware


  • As a quick demo of Yosys. Some hardware engineers are not very computer savvy and explaining how to install python and running pip isn't as easy as sending them a link to a webpage. Seeing browser visualizations also makes for an impressive flashy demonstration. Also simply being able to run synthesis in browser demonstrates how light weight yoys is compared to vendor tools.
  • Introductory digital logic workshops are much easier when there is literally zero computer setup required
  • A lot of visualization tools are already in JS (netlistsvg, wavedrom, d3, etc)
  • People keep on doing one-off browser builds of Yosys for their specific use case. It would be nice if there was a good package that was good enough for everyone to use instead of rolling their own.

What's the next best alternative?

  • Grab one of the builds of YosysJS floating around.
  • Jupyter notebooks are really great educational tool, but require learning the jupyter interface and at least a little python


Accessing files is annoying in the browser. In addition to the wasm file, you also need to deal with the users files, the tech library files. So, ideally those would be packaged in a way that is easy to use.

Copy link

This is possible and in scope. I have a prototype already and will look into publishing it as a complete work later.

Copy link

Place and route visualization

Note that Qt nextpnr builds are out of scope at the moment. That's an enormous and highly complex dependency that I am not ready to support.

Simulation with cxxrtl

You'd have to also use clang.wasm targeting wasm. That's possible although the simulation speed might not be so great.

Copy link

If there's anything I can do to help, I'm happy to contribute.

Copy link

Not really, the limiting factor is my time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

No branches or pull requests

3 participants