Neural Network Playground from Scratch (JS Machine Learning)

I really like the concept of neural networks - it feels like we've spent so much time trying to surpass human capacities that we've come full circle. But I feel like a lot of people who are being exposed to these new technologies have no idea what's going on under the hood (including me!). So here's my attempt at elucidating some of the mystery of all of this - here's the demo: https://www.pierrequereuil.com/neural, keep reading for the semi-technical explanation.

A Really Quick Intro to Machine Learning

Pretty much, as I understand it, neural networks are a subset of machine learning which is a subset of artificial intelligence. All of those have pretty broad and debatable definitions, but I think this is a good simple way to think about them:

  • artificial intelligence: actions performed by a computer that could be considered intelligent by human standards. Ex: Google Translate / Face ID / PAC-MAN ghosts.
  • machine learning: AI developed through statistical methods. These models do not deduce or calculate an answer but rather try to determine the most likely one. It's like if instead of learning why 2 + 2 = 4, the teacher just slapped you until you got it right.
  • neural networks: machine learning models that emulate the human brain. They're made up of nodes which start out at randomized values, then they're modified as make it learn different things (for instance, how to recognize a handwritten "1"). brain

Essentially, machine learning means trying to determine a continuous pattern based on discrete data points. This can start out as simple as a regression line (pictured below), where the inputs to the model are the x values of the data points, and the outputs are y. Given the xs and the ys for the blue dots, we want the model to predict every y for every single potential x, creating the regression line. reg

Neural Networks from Scratch

My code is largely inspired from this Medium article by Omar Aflak, covering writing neural networks from scratch in python. However, since this app is written in Typescript, and since I felt like it would be a better exercise to rewrite everything, my neural network code is equivalently written in Typescript on Github. If you're interested on running this, feel free to start out with the xor function to demo a simple example of it working (and a great way to test if your own code is working too!) In this case, the input is A and B and we're trying to make the model learn A XOR B:

xor

Playground GUI

The next step was to have a way to interact with our neural network. I was heavily inspired by the Tensorflow Neural Network Playground, which I just found really cool as an easy explanation for machine learning. Except I wanted to give it a little more complexity. The idea is, you can place dots of different colors on a canvas. Then, you can adjust the layers of the model as well as some parameters (activation function, learning rate, features fed into it). When you run it, the model will slowly attempt to learn the pattern you are describing. Some patterns may need more hidden layers, sinusoidal features, different learning rates... I love experimenting with it and seeing what works best for the problem you give it. I hope you'll have as much fun fiddling around with it as I do.

example