# How to: Visualizing Your Neural Networks

## Metadata

- **Published:** 12/3/2023
- **Duration:** 9 minutes
- **YouTube URL:** https://youtube.com/watch?v=qh6oTF1Dj38
- **Channel:** nerding.io

## Description

🚀 Elevate Your AI Game with Netron! 🧠💻

Dive into the world of AI with our latest video, where we explore Netron - a powerhouse tool for visualizing neural networks, deep learning, and machine learning models. Netron isn't just any visualizer; it supports a wide range of formats, including ONNX, TensorFlow Lite, Core ML, Keras, and more, even extending experimental support to PyTorch, TensorFlow, and others.

🔍 Want to see AI models in action? Netron's got you covered. Sample model files are available for a hands-on experience with formats like ONNX, TensorFlow Lite, and Keras. Just download or open them using the browser version. Also, we will look at an ONNX file converted to be used in the browser. Lastly, we use ChatGPT Vision to explain the visual concepts in further detail.

📰 FREE eBooks & News: https://sendfox.com/nerdingio
👉🏻  Ranked #1 Product of the Day:  https://www.producthunt.com/posts/ever-efficient-ai
📞 Book a Call: https://calendar.app.google/M1iU6X2x18metzDeA


🎥 Chapters
00:00 Introduction
00:37 Netron
01:56 Browser View
02:39 Connections
03:55 Electron
04:58 Onnx
06:25 Bert
07:47 GPT Vision
09:28 Conclusion

🔗 Links
https://github.com/lutzroeder/netron
https://github.com/lutzroeder/netron/blob/main/source/tflite.js
https://netron.app/?url=https://media.githubusercontent.com/media/onnx/models/main/vision/classification/squeezenet/model/squeezenet1.0-3.onnx
https://netron.app/?url=https://huggingface.co/thelou1s/yamnet/blob/main/lite-model_yamnet_tflite_1.tflite
https://netron.app/?url=https://raw.githubusercontent.com/AlexeyAB/darknet/master/cfg/yolo.cfg
https://chat.openai.com/c/826fefcb-ca8e-4e23-ad88-810bc934c6c

⤵️ Let's Connect
https://everefficient.ai
https://nerding.io
https://twitter.com/nerding_io
https://www.linkedin.com/in/jdfiscus/
https://www.linkedin.com/company/ever-efficient-ai/

## Key Highlights

### 1. Neutron: Visualizing Neural Network Architecture

Neutron is a tool for visualizing neural networks, supporting formats like ONNX and TensorFlow Lite. It allows users to explore model logic, connections, and attributes, enhancing understanding of the model's inner workings.

### 2. Browser-Based Visualization with WebAssembly

The video demonstrates how to use ONNX models in the browser via WebAssembly (WASM). This enables client-side model execution without needing server-side APIs, showcasing a Chrome extension example using a sentiment analysis model.

### 3. Leveraging ChatGPT Vision for Model Explanation

The video explores using ChatGPT Vision to analyze screenshots of neural network architectures (YOLO, BERT).  ChatGPT Vision can identify layers, parameters, and functions, aiding in understanding complex models when documentation is lacking.

### 4. Converting Models to ONNX for Browser Compatibility

The presenter highlights the ability to convert models, such as those originally in TensorFlow format, into the ONNX format. This conversion is crucial for enabling efficient execution within a browser environment using WebAssembly.


## Summary

## Video Summary: How To: Visualizing Your Neural Networks

**1. Executive Summary:** This video introduces Netron, a powerful visualization tool for neural networks, deep learning, and machine learning models. It showcases how Netron can be used to understand model architecture, logic, and connections, even demonstrating its capabilities through browser-based implementations and leveraging ChatGPT Vision for deeper analysis.

**2. Main Topics Covered:**

*   **Introduction to Netron:** Overview of Netron as a visualizer for neural networks supporting various formats like ONNX, TensorFlow Lite, and others.
*   **Browser-Based Visualization:** Demonstrates using Netron in a browser, accessing sample models directly from URLs, and exploring their structure interactively.
*   **Model Connections and Attributes:** Explains how to examine connections between nodes in the network and view the attributes of each node.
*   **Local Application (Electron):** Shows how to use the Netron desktop application to visualize models stored locally, specifically an ONNX model used in a Chrome extension.
*   **ONNX Conversion and WebAssembly:** Highlights the process of converting TensorFlow models to ONNX for browser compatibility using WebAssembly, enabling client-side model execution.
*   **ChatGPT Vision Integration:** Explores using ChatGPT Vision to analyze screenshots of model architectures (YOLO, BERT), interpreting layers, parameters, and functions.

**3. Key Takeaways:**

*   Netron simplifies understanding complex neural network architectures by providing a visual representation of models.
*   Netron supports a wide range of formats, making it a versatile tool for various machine learning projects.
*   Browser-based Netron allows easy access and exploration of models without the need for local installation.
*   Converting models to ONNX format facilitates browser-based execution through WebAssembly.
*   ChatGPT Vision can assist in interpreting model architectures and understanding the function of individual layers and parameters, especially useful when documentation is lacking.

**4. Notable Quotes or Examples:**

*   "[Netron allows you to] actually see what is the logic that is happening here. You can click and dive into some of the more details of like what are the attributes, the connections which we'll kind of go through." - JD, Video Presenter
*   Demonstration of visualizing ONNX, TensorFlow Lite, and YOLO models directly in the browser.
*   Explanation of how the ONNX model (originally Tensorflow) from the Chrome extension runs client-side in the browser via WebAssembly.
*   ChatGPT Vision identifying layers and parameters in a YOLO architecture screenshot.
*   ChatGPT Vision explaining Layer Normalization and token ID processes in an ONNX BERT model screenshot.

**5. Target Audience:**

*   Machine learning engineers and researchers
*   AI developers working with neural networks
*   Individuals seeking to understand and visualize model architectures
*   Developers interested in browser-based AI applications and WebAssembly.


## Full Transcript

hey everyone welcome to nerding iio I'm JD and today we're going to take a look at what a machine learning model actually looks like so we're going to use a visualizer tool called Neutron or Neutron hopefully I'm saying that correctly and we can actually look at the diagram of some of its logic and the connectors along with it so we can look at some of our favorite but then we're also going to look at uh Chrome extension that we put together and how we can actually use that Onyx file in the browser through WM and what that model actually looks like all right so the tool that we're going to look at is Neutron or it could be Neutron um hopefully I'm saying one of those correctly but I came across this on GitHub and it is a uh viewer for Dural networks deep learning and machine learning models it has a list of support so I've used Onyx a few times uh I think T the tensorflow light is also really awesome has a few other ones but it even lists tensorflow JS which I thought was really cool since we do a lot of things with AI and specifically in JavaScript so here is kind of an example of what it looks like uh the they have multiple different installs so you can do we'll take a look at the Mac but it also has a browser which we're going to look at and then uh different examples that you can just see through here one of the benefits of actually visualizing this is the ability to actually see what is the logic that is happening here you can click and dive into some of the uh more details of like what are the attributes the com and uh even the connections which we'll kind of go through so what we're going to do is we're actually just going to view this in the browser to start and then we'll show a local example so if you click any one of these models you can actually see what it is and you're able to kind of zoom in zoom out uh and then when you click on the Node you can actually see the properties over here of what's happening so this one is a an onx uh squeez nut file they also have example of a light file which if you zoom out you can see the logic from the top and how it's going all the way down into the bottom here as uh part of its decision tree so you can see the 2DS it's Wast and bias and even the logic up here of how it's uh shaping splitting and then doing uh the packing so what I meant by the the connectors is you can actually hover over the lines and it'll show you what the inputs are what kind of uh type it is and then the different outputs that it's going to as your high Hing over them you can kind of see it light up over here in red uh when it's over those particular inputs so the other one we'll look at is Yolo and this one is more of uh like you'll see the convolution I also liked that it had the weights and biases right at the beginning so you can kind of see the inputs the floats uh and the weights as the um the uh iterables or not iterables here so again this one's pretty straight which I found really interesting but the cool thing about this again is it's a great way to learn but you can also see what the model is doing what it's looking like and uh in in a visual way the other cool thing I saw was this tlight file that's actually in the code for Neutron specifically so Neutron is uh running it's a JavaScript uh application runs an electron which is why I can also run on the browser right here we're looking at like how it's pulling in the uh tlight or TF light file so the tensorflow light file how it's going through the factory of making this information even the binary reader for the buffer and then using the schema to Define what is uh what's actually happening here so I I just wanted to look at the guts of this a little real quick if you haven't already please remember to like And subscribe it helps more than you know we also have a link to our newsletter which gives different kinds of code and updates and we even have a link if you want to expand on this course specifically where we talk about hugging face models being used in a Chrome extension so go ahead and smash that like And subscribe all right so now we'll take a look at the uh application itself so if we go ahead we're going to pull in our model Onyx what I wanted to show you though was that what we're actually pulling this from is a Chrome extension that we put together in a hugging face course specifically for Chrome extensions if you're interested the link is below but you can see that you have this public folder which is the Chrome extension itself we have a wasm folder you have models and you have this NLP Town Bert uh Bert sentiment and so you can see this Onyx file what's interesting about this is this didn't start off as an onyx file it started off as a tensorflow file and you can actually use their conversion to take one model and convert it into Onyx which then allows you to use uh wasm which is web accessibility or or not web accessibility sorry web assembly to uh to get the the file to load in the browser again this is loading in the browser it's not using uh an API so what we'll do is we're going to take a look at this model and go ahead and pull it in I'm going to pause here for a second while it's loading all right and so now that we have this loaded we can see the file path of where our Onyx file is we can zoom in we can zoom out it's a little slower uh at least on my machine running the onx uh sorry running electron but then you can actually click same as you would in the um the web version and get the property information so again now we can look at what the logic is happening in this model and how it's put together the other thing I thought was pretty crazy with this one is you have an attention mask that basically has connectors for the entire uh app or Tire model which is pretty massive so you can see how big this NLP uh logic is and you can dive into each section as it goes down the other test that I thought would be fun to do is what if we don't know everything about these models and we want to understand a particular piece of it what we can do is we can actually take a screenshot of the the section of the model or even the properties and have chat GPT Vision explain it to us so what I did was I took the YOLO model just to see if this would actually work and I put it into chat GPT vision and just asked it to explain it it was able able to pick up the fact that it was a convolutional neural net and then started talking about some of the inputs and what each layer was as well as defining the parameters like so weights and bias and what the features were it even went as far as to talk about the uh activation function which is something I I didn't know a ton about so I thought this was cool because you could dive in to it even further it also gives more of an explanation uh talks about how it's only the first view layers so it can't define the entire thing I also ran the Bert example and uh because it had some things like reduce mean just to see what would come back so it recognizes the fact that it's an onyx model I did actually tell it that but talks about the uh file format a little bit more talk specifically about the inputs and the token IDs how this information is getting collected all the way down into like the layer normalization so I thought this was a really cool tool I wanted to share it with everyone because I feel like it's a great way to visually understand how a model is working but then also you can uh leverage chat chbt already everyone thanks for joining us what we learned today was how to actually visualize a data model go through some different variations of it actually look at the Onyx file that we use in a Chrome extension that is getting pulled in through WM and we even use chat gbt Vision to actually explain that graph to us so we have a better understanding of what's actually happening in the execution of the model itself thanks for tuning in and happy nerding

---

*Generated for LLM consumption from nerding.io video library*