Skip to content

zrnge/neural-playground

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 

Repository files navigation

Neural Playground

Vanilla JS HTML5 CSS3 Zero Dependencies License MIT

Developed by Zrnge | TRY IT NOW

A stunning, comprehensive, browser-based neural network simulator built entirely from scratch in vanilla JavaScript. This project serves as an educational tool to understand the inner workings, mathematics, and architectures of powerful AI models.

No external libraries (like TensorFlow or PyTorch) are used. Every matrix multiplication, forward pass, and backpropagation step is implemented by hand to demystify how these black-box models work.

🌟 What's New in v2.0

  • Modern UI Redesign: A beautiful "Glassmorphism" aesthetic with animated gradients, frosted-glass panels, and glowing neon accents.
  • Layman Explanations: Every model now features a "TL;DR" summary, making complex math accessible to beginners.
  • Cutting-Edge Models: Added interactive simulators for Diffusion Models (Stable Diffusion) and Mixture of Experts (GPT-4 architecture).

🧠 Architectures Included

Core Architectures

  • Vanilla RNN: Learn how recurrent neural networks process sequential data.
  • LSTM: Interactive visualization of Forget, Input, Cell, and Output gates.
  • CNN: Draw on a canvas and watch convolutional filters extract features in real-time.

Advanced Generative Models

  • Vanilla GAN: Observe the minimax game between a Generator and Discriminator.
  • DCGAN / Pix2Pix / CycleGAN: Educational diagrams on image-to-image translation.
  • StyleGAN: Advanced generation demonstrating mapping networks and AdaIN.
  • Diffusion Models: Interactive slider showing Forward Diffusion (adding noise) and an animated Reverse Diffusion (denoising generation).

Modern NLP Models

  • Transformer: Visualizing Self-Attention mechanisms (Query, Key, Value matrices) and attention heatmaps.
  • Mixture of Experts (MoE): Animated routing of tokens to specialized "Expert" networks, demonstrating how massive LLMs achieve efficiency.

🚀 How to Run

  1. Clone or download this repository.
  2. Simply open index.html in any modern web browser, or host it directly via GitHub Pages.
  3. No server setup, no npm installs, no dependencies required. Everything runs locally in your browser.

🛠️ Built With

  • HTML5 / CSS3 (Glassmorphism, CSS Variables, CSS Animations)
  • Vanilla JavaScript (ES6)
  • HTML5 Canvas API for high-performance matrix visualizations.

📜 License

MIT License. Feel free to use this for educational purposes, adapt it, and learn from it!

About

A stunning, comprehensive, browser-based neural network simulator built entirely from scratch in vanilla JavaScript. This project serves as an educational tool to understand the inner workings, mathematics, and architectures of powerful AI models.

Topics

Resources

License

Stars

1 star

Watchers

0 watching

Forks

Contributors

Languages