WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
WeAreDevelopers LIVE • May 26, 2021

Machine learning in the browser with TensorFlowjs

Håkan Silfvernagel

Want to build privacy-first AI without learning Python? Discover how to train and deploy machine learning models directly in the browser using TensorFlow.js.

Pause
Mute Enter Fullscreen
#1 about 2 min

Overview of machine learning in the browser with TensorFlow

Using machine learning models natively in the browser provides powerful client-side capabilities.

#2 about 3 min

Core concepts and use cases of machine learning

Supervised learning and pattern recognition enable sophisticated predictive and clustering applications.

#3 about 2 min

Fundamentals of tensors and the TensorFlow library

Tensors represent data mathematically while TensorFlow handles the underlying distributed computing operations.

#4 about 5 min

Visualizing source data with the TensorFlow visualization component

Fetching JSON data and rendering scatter plots helps identify correlations before training.

#5 about 4 min

Defining a sequential neural network model architecture

Creating a sequential model with dense layers establishes the architecture to process numerical inputs.

#6 about 4 min

Formatting and normalizing data into tensor structures

Converting JavaScript data shapes into tensors and applying min-max scaling ensures optimal training conditions.

#7 about 4 min

Compiling and training the machine learning model

Selecting an optimizer and defining a loss function prepares the model for multi-epoch training.

#8 about 6 min

Testing model predictions and addressing data non-linearity

Generating new tensors tests predictions while adding hidden layers captures non-linear data relationships.

#9 about 2 min

Converting existing Keras models to TensorFlow format

Command line utilities can translate pre-trained Python machine learning models for browser compatibility.

#10 about 2 min

Advantages of running machine learning directly in the browser

Client-side execution removes server round-trips, enhances data privacy, and accesses raw device sensors.

#11 about 5 min

Building an image classifier with a pre-trained model

Loading a converted MobileNet model enables developers to quickly predict classes for user-uploaded images.

#12 about 2 min

Real-world implementations of browser-based machine learning

Major platforms leverage client-side models for visual debugging, intuitive content moderation, and algorithmic music composition.

#13 about 3 min

Learning resources and community platforms for artificial intelligence

Recommended courses, API documentation, and online study groups help advance foundational machine learning skills.

Matching moments

1:20 min

Introduction to TensorFlow.js for browser machine learning

Alexandru Hang Alexandru Hang · Europe 2026 Virtual

2:36 min

Implementing and training the prediction model in TensorFlow.js

Eliran Natan · LIVE

2:46 min

The case for native AI in web browsers

Maxim Salnikov Maxim Salnikov · World Congress 2025

3:36 min

Exploring machine learning and image classification in JavaScript

Carly Richmond Carly Richmond · World Congress 2025

7:51 min

Integrating embedded machine learning models into the Firefox browser

Chris Heilmann +2 · LIVE

2:17 min

Accelerating local machine learning models via WebNN

Christian Liebel Christian Liebel · World Congress 2026 Europe

More from WeAreDevelopers LIVE

WeAreDevelopers LIVE - Is CSS Catching Up to Flash? thumbnail
1:03:33
8 days ago

WeAreDevelopers LIVE - Is CSS Catching Up to Flash?

Chris Heilmann, Daniel Cranney, Bramus Van Damme

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along thumbnail
1:21:17
15 days ago

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along

Chris Heilmann, Daniel Cranney, Krzysztof Cieślak

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak thumbnail
4:23
17 days ago

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak

Chris Heilmann, Daniel Cranney

WeAreDevelopers LIVE - Open Source Agent Toolkits thumbnail
1:00:38
22 days ago

WeAreDevelopers LIVE - Open Source Agent Toolkits

Chris Heilmann, Daniel Cranney, Eddie Jaoude

Fake or News - AI Music Detectors, Translating Ancient Languages & Tiny Heads in Teslas - Eddie Jaoude thumbnail
6:16
24 days ago

Fake or News - AI Music Detectors, Translating Ancient Languages & Tiny Heads in Teslas - Eddie Jaoude

Chris Heilmann, Daniel Cranney

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas thumbnail
5:46
29 days ago

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas

Chris Heilmann, Daniel Cranney, Marc Plogas

Upcoming sessions on this topic

Open session

World Congress 2026 North America

September 24, 2026 · 10:20–10:50

Stage 1

The Browser Is Becoming an AI Runtime

Ajit Varma, Will Bryk, Julia Love

Ajit Varma
Will Bryk
Julia Love
Open session

World Congress 2026 North America

September 25, 2026 · 15:30–16:00

Stage 6

Small LLM in your Browser: Huge Opportunities for Web Applications

Daniel Ostrovsky

UI/UX Architect at Payoneer | AI Architect | Full Cycle Development Expert | Public Speaker | Open Source Contributor |

Daniel Ostrovsky
Open session

World Congress 2026 North America

September 24, 2026 · 14:10–14:40

Stage 5

Edge AI: Running Agentic Intelligence Where Internet Can't Reach

Nitin Eusebius

AWS - Principal Solutions Architect

Nitin Eusebius
Open session

World Congress 2026 North America

September 24, 2026 · 14:10–14:40

Stage 7

Designing High-Performance AI APIs: Lessons from Serving Millions of Real-Time Requests

Wayne Liu

Chief Growth Officer and Americas President of Perfect Corp.

Wayne Liu
Open session

World Congress 2026 North America

September 25, 2026 · 15:30–16:00

Stage 7

Trust, But Verify: Continuous GPU Validation at Scale

Kyle Bell

VP of AI at TensorWave

Kyle Bell
Open session

World Congress 2026 North America

September 25, 2026 · 14:50–15:20

Stage 4

Intelligence in Motion: Building the Next Generation of AI-Powered Apps on Zoom's Developer Platform

Brendan Ittelson

Chief Ecosystem Officer of Zoom

Brendan Ittelson

Related videos

Run AI models in the browser: Real life scenarios and implementations thumbnail
33:15
Europe 2026 Virtual • 3 months ago

Run AI models in the browser: Real life scenarios and implementations

Alexandru Hang

Is it (F)ake?! Image Classification with TensorFlow.js thumbnail
25:43
World Congress 2025 • about 1 year ago

Is it (F)ake?! Image Classification with TensorFlow.js

Carly Richmond

AI in the Open and in Browsers - Tarek Ziadé thumbnail
53:54
Coffee With Developers • 9 months ago

AI in the Open and in Browsers - Tarek Ziadé

Tarek Ziadé

How Web AI Can Power the Agentic Web - Jason Mayes (Google) thumbnail
20:57
Coffee With Developers • 4 months ago

How Web AI Can Power the Agentic Web - Jason Mayes (Google)

Jason Mayes

Building Your Own Classification Model with JavaScript - Coffee with Developers - Carly Richmond thumbnail
36:29
Coffee With Developers • over 1 year ago

Building Your Own Classification Model with JavaScript - Coffee with Developers - Carly Richmond

Carly Richmnd

Privacy-first in-browser Generative AI web apps: offline-ready, future-proof, standards-based thumbnail
30:13
World Congress 2025 • about 1 year ago

Privacy-first in-browser Generative AI web apps: offline-ready, future-proof, standards-based

Maxim Salnikov

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.