Machine Learning (ML) is the dope new thing that everyone’s talking about, because it’s really good at learning from data so that it can predict similar things in the future. Doing ML by hand is pretty annoying since it usually involves matrix math which is zero fun in JavaScript (or if you ask me: anywhere 😅). Thankfully, TensorFlow.js is here to help! It’s an open source library that has a lot of built-in Machine Learning-y things like models and algorithms so that you don’t have to write them from scratch.
Is your problem a Machine Learning problem?
Machine Learning is good at classifying and labelling data. The premise of every machine learning problem is:
- Someone gives us some data that was generated according to a secret formula. This data could be a bunch of points (that are generated based on some math equation), but could also be fun, like images (the secret formula could be “some of these images are chihuahuas and some are blueberry muffins) or bus schedules.
- By looking at this data we were given, we approximate the secret formula so that we can correctly predict a future data point. For example, if we’re given a photo, we will eventually be able to confidently say whether it’s a dog or a muffin.
A fun demo!
If you want to get started, predicting numbers tends to be easier than predicting images, so in this example we’re trying to fit a curve to a bunch of data (this is the same example from the TensorFlow site but with waaaaay more code comments and a prettier graph).
We are given a bunch of points (for x between -1 and 1, calculate a y according to y = a * x^3 + b * x^2 + c * x + d – we know this is the secret formula but we don’t know the values of those a,b,c,d coefficients.) Our goal is to learn these coefficients, so that if we’re given a new x value, we can say what the y value should be.
The blue dots are the training points we were given. The red dots would be our guesses, based on our initial, default coefficients (hella incorrect!). Once you click the train button, the green dots show how our coefficients are getting better. After you see the default example, check what happens if you change the shape of the data, or we are given fewer data points or fewer iterations!
It looks like this, you can play with it here!
How it works
Most machine learning algorithms follow this pattern:
- We have to figure out the “features” of the secret formula that generated the data we were given, so that we can learn them. In my opinion, this is like 80% of the complexity of solving an ML problem. In this example, we were told the shape of the secret formula (it’s a cubic!), so the features we have to learn are the coefficients in the polynomial. For something more complex like the “is this a dog or a blueberry muffin” problem, we’d have to look at pixels and colours and formations and what makes a dog a dog and not a muffin.
- Once we figure out these features (in our case, those a,b,c,d coefficients), we initialize them to some random values. We could now use them to make predictions, but they would be teeeeeerrible because they’re just random.
- (I’m just going to use our actual example from now on and not dogs)
- We start looking at every piece (x,y) of training data we were given. We take the x value, and based on these coefficients we have estimated, we predict what the y value would be. We then look at the correct y value from the original training data, calculate the difference between the two, and then adjust our coefficients so that our predicted value gets closer to the correct one.
- (this, with more math sprinkled in is called “stochastic gradient descent”. “Stochastic” means probabilistic, and “gradient descent” should make you think of walking down a hill, towards a sink hole — the higher the hill, the bigger the prediction error, which is why you want to descend towards the error-free hole.)
- This part of code is actually pretty messy (because matrices and derivatives), and TensorFlow does this for us!
- We keep doing this until we use up all the data, and then repeat the entire process so that we iterate over the same data over and over again until at the end we’ve pretty much learnt the coefficients!
The code
You can look at the code for the demo on Glitch. I tried to comment most lines of the code with either what the algorithm or TensorFlow are doing (especially when TensorFlow is actually doing a looooot of heavy lifting behind the scenes). I hope it helps!
Originally published at meowni.ca.
Top comments (22)
Great article but I have to wonder; why would they build a JS version of Tensorflow? As far as I'm aware most ML is done on-server and while JS is great for building applications, it hardly seems powerful enough to do ML with.
It working on node.js aside (which is on the server), having a JS version lowers the barrier of entry, imo -- spinning up a quick demo just to figure out if you're even interested in this makes it waaaaaay more approachable to ML beginners
Yeah. In our country (Philippines), there are waaaaaayyy more JavaScript developers than Python developers because that's what's taught in school. So introducing this will really make it easier for more developers to get into the ML space. 🎉
+1 this makes it available to a huge audience without them needing to learn a new language and platform at the same time.
ALSO!! With WebAssembly and WebGL, the browser is continuing to become a legitimate platform. It's less and less accurate to think of JS as just an interpreted language, its APIs, optimizations, and tooling are making it a viable target for abstract machine code and even code that runs on a GPU. In that regard, this makes total sense, and as I think about it, I'm surprised it didn't happen sooner!
It's a revolutionary development for me because I use JavaScript for everything! 😂
From web, mobile, desktop, even VR -- I use JavaScript to build all of those things.
Now that JavaScript has the powers of TensorFlow.js (which is easier to use than the previous Deeplearn.js), we are now able to bring the power of ML and AI to all of those platforms, effectively democratizing AI. 🎉
The reason to bring Tensorflow to the browser is mostly to work with pre trained models. What is CPU intensive is training the model. Anyway you can do both things in JS. But IMO, using JS to train a model is not an efficient approach.
Imagine cutting the time to send an image from the browser to the server, make an enquiry, send it back to the browser. the beauty of clientside processing
Well, why not?
Also they are supporting node.js now
Every language has its strengths. Math is not JS's strength so why use it for something that's inherently math-heavy?
if I'm not mistaken, tensorflow utilizes WebGL to operate on hardware (mainly GPU) so the performance hit by js is not aggressive.
Also, it can be a learning platform for people that are more used to JS, it can start here and move to another language later.
Also saying "Math is not JS's strength' is somewhat of an invalid statement. We shouldn't establish strengths of a language based on popular opinion. We should consider how the interpreters themselves operate with a language. It's possible to find research that shows node.js being considerably faster than python which by pop culture is good with math. In the end if your task is math heavy you will need to adapt the language to your needs and have a strong understanding about how it works. If you do that it won't matter that much which language you'll use to get your results and bring people on the ML band wagon.
Couple of sources:
I think the JS ecosystem is so big I'd assume it would have a library for everything. Maybe it's not the ideal language for lots of things but these days it's the universal tool.
(Not sure if I'm replying to the intended comment, I'm somewhat confused by the lack of a reply button on certain comments)
This isn't really a fair comparison. Nodejs is a V8-based javascript runtime that does just-in-time compilation and python is just a language. There are Python runtimes that also do just-in-time compilation, so a fair comparison would involve comparable runtimes.
They're planning to have Node support soon so it would be easier to work with GPUs. That's what I heard. Right now, this version is built for running in the browser. 😁
Atwood’s law 🤗
I love where Tensorflow is going. It seems like this power is becoming more and more accessible every day. And it's definitely posts like this which help the process along. Thanks a lot Monica!
Between fast.ai, the host of paid courses, the seemingly never ending blog posts that go into fantastic detail, and the publicly available papers for Arxiv, making a start in deep learning is surprisingly democratic and open. It’s very neat.
For folks curious about the performance of tensorflow.js in the browser, take a look at the team's Google I/O talk which contains a few benchmarks (and some neat demos). youtube.com/watch?v=OmofOvMApTU
Because tf.js uses webGL and the GPUs on the user's machine, it's surprisingly capable!
Loving the TensorFlow ecosystem right now. Especially TensorFlow.js! 🔥
Talked about it during the TensorFlow Dev Summit Extended Manila here in the Philippines. 😁
The Layers API is awesome but it would be great if they also ship the Estimators API. That would be super cool. 😎
Thank you for the article and the demo app you wrote. It gave my a simple problem that I could understand, and the how and why you did the things to solve it.
I've been wanting to work with Google's Cloud Machine Learning Engine which is also based on tensorflow. Your demo is giving me something I can poke and prod to gain some understanding of the issues before I tackle Google's.
I'd like to work with the technology from the stand point of how to identify an appropriate problem, define it well, setup the inputs for something like Google's, and work with the output. I'll let Google handle the math. ;o)
I'd like to build something using JavaScript to access their api. I also like how you displayed the output. I've been looking for a simple tool like the plotly.js you used. Please don't look too close at any code I write I may borrow some of yours. ;o)
I haven't found good articles on using, and coding, AI this way. You explain things very well. Have you considered writing something for this perspective?
Thank you again.
This is a great project. But I don't understand it fully yet. ¯\(ツ)/¯
Gotta train myself more about how training a computer works.
Really nice. Im experimenting tensorflow in Py. Gonna give a try to js too