Håkan Silfvernagel

Machine learning in the browser with TensorFlowjs

A simple model drew a straight line, but the data was curved. See how adding more layers unlocked an accurate prediction, all within the browser using TensorFlow.js.

Machine learning in the browser with TensorFlowjs
#1about 3 minutes

Understanding the fundamentals of machine learning

Machine learning is defined as pattern recognition in historical data, with supervised learning being a common approach for tasks like prediction and clustering.

#2about 2 minutes

Exploring the TensorFlow library and tensor data structures

TensorFlow is an open-source library that uses tensors, which are multi-dimensional arrays like scalars, vectors, or matrices, to perform computations.

#3about 5 minutes

Loading and visualizing car data with TensorFlow.js

A JSON dataset of car information is loaded and visualized as a scatter plot to identify the negative correlation between horsepower and miles per gallon.

#4about 10 minutes

Building and training a simple sequential model

A sequential model is defined, compiled with an optimizer and loss function, and then trained on normalized and shuffled car data to predict MPG.

#5about 6 minutes

Improving model predictions with additional layers

The initial linear model is improved by adding more dense layers to the neural network, which better captures the non-linear relationship in the data.

#6about 1 minute

Converting and using pre-trained Keras models

Existing models, such as a Keras H5 file, can be converted into the TensorFlow.js layers format using the command-line converter for use in the browser.

#7about 2 minutes

The benefits of running machine learning in the browser

Running machine learning on the client-side eliminates server roundtrips, enhances data privacy, and provides easy access to device sensors like cameras and microphones.

#8about 4 minutes

Building an image classifier with a pre-trained model

A web application is built to classify images by loading a pre-trained MobileNet model that has been converted for TensorFlow.js.

#9about 1 minute

Real-world applications of TensorFlow.js in production

Companies like Uber, Airbnb, and Google's Magenta project use TensorFlow.js for visual debugging, client-side document detection, and music composition.

#10about 2 minutes

Conclusion and further learning resources

Additional resources for learning more about TensorFlow include official documentation, Coursera courses, and the AI 42 online school.

Related jobs
Jobs that call for the skills explored in this talk.

Featured Partners

Related Articles

View all articles
DC
Daniel Cranney
The State of WebDev AI 2025 Results: What Can We Learn?
Introduction The 2025 edition of The State of WebDev AI offers a detailed snapshot of how developers are using AI today, which tools have gained the most traction over the past year, and what these trends suggest about the future of the industry. In...
The State of WebDev AI 2025 Results: What Can We Learn?
CH
Chris Heilmann
With AIs wide open - WeAreDevelopers at All Things Open 2025
Last week our VP of Developer Relations, Chris Heilmann, flew to Raleigh, North Carolina to present at All Things Open . An excellent event he had spoken at a few times in the past and this being the “Lucky 13” edition, he didn’t hesitate to come and...
With AIs wide open - WeAreDevelopers at All Things Open 2025

From learning to earning

Jobs that call for the skills explored in this talk.

Machine Learning Engineer

Machine Learning Engineer

Machine Learning Engineerjla Resourcing Ltd
Charing Cross, United Kingdom

£70-75K
Azure
NoSQL
Scrum
Python
+6