TensorFlow.js是Google推出的JavaScript机器学习框架，支持在浏览器和Node.js中直接运行模型。它无需后端服务即可完成AI推理，结合WebGL加速计算，适用于图像分类、手势识别等低延迟或隐私保护场景。通过npm安装@tensorflow/tfjs或引入CDN脚本可快速搭建环境。可用JS训练线性回归模型，如拟合y=2x+1，并进行预测。还能加载预训练的MobileNet模型实现图像分类。性能优化建议包括使用tf.tidy()管理内存、启用WebGL后端、将训练移至Web Worker及模型量化压缩。
想在浏览器或Node.js环境里运行机器学习模型，又不想切换到Python？TensorFlow.js就是为你准备的。它让JavaScript开发者可以直接用JS训练模型、加载预训练模型，甚至做推理预测。下面带你一步步上手实战。
1. 什么是TensorFlow.js？
TensorFlow.js 是Google推出的JavaScript版机器学习框架，支持在浏览器和Node.js中运行。它的核心优势是：无需后端服务，直接在前端完成AI推理；还能结合WebGL加速计算。
常见用途包括图像分类、手势识别、语音处理、推荐系统等，特别适合需要低延迟或保护用户隐私的场景。
2. 环境准备与项目搭建
开始前先确保你有Node.js环境，然后创建项目：
立即学习“Java免费学习笔记（深入）”；
- 新建文件夹并初始化npm：npm init -y
- 安装TensorFlow.js：npm install @tensorflow/tfjs（Node.js）或 npm install @tensorflow/tfjs-node（带CPU/GPU加速）
- 如果是网页使用，也可以通过CDN引入：
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
3. 实战：训练一个简单的线性回归模型
我们用TensorFlow.js拟合一条直线 y = 2x + 1，看看模型能否学会这个规律。
代码示例：
java-api-doc-generator
下载
分析 Java Spring Boot 后端 Controller 代码，自动生成 Markdown 格式的接口文档。当用户说“生成 Java 接口文档”、“生成 API 文档”、“从 Spring 代码生成文档”时触发。
import * as tf from '@tensorflow/tfjs';
<p>// 准备数据
const xs = tf.tensor1d([1, 2, 3, 4, 5]);
const ys = tf.tensor1d([3, 5, 7, 9, 11]); // y = 2x + 1</p><p>// 定义模型
const model = tf.sequential();
model.add(tf.layers.dense({ units: 1, inputShape: [1] }));</p><p>// 编译模型
model.compile({
optimizer: tf.train.sgd(0.01),
loss: 'meanSquaredError'
});</p><p>// 训练模型
async function train() {
await model.fit(xs, ys, {
epochs: 200,
verbose: false
});
console.log('训练完成！');</p><p>// 预测
const result = model.predict(tf.tensor1d([6]));
result.print(); // 应接近 13
}</p><p>train();</p>这段代码会输出类似 [[12.98]] 的结果，说明模型已经学会了规律。
4. 加载预训练模型进行图像分类
除了自己训练，还可以加载已有的模型，比如MobileNet。
- 安装mobilenet：npm install @tensorflow-models/mobilenet
- 在HTML中放一张图片，并用模型识别
示例代码：
import * as tf from '@tensorflow/tfjs';
import * as mobilenet from '@tensorflow-models/mobilenet';
<p>async function recognizeImage() {
const img = document.getElementById('myImage');
const model = await mobilenet.load();
const predictions = await model.classify(img);
console.log(predictions);
}</p>控制台会输出可能的类别和置信度，比如“吉娃娃”、“遥控器”等。
5. 性能优化小贴士
在浏览器中运行模型要注意性能：
- 尽量使用 tf.tidy() 避免内存泄漏
- 大模型可启用WebGL后端：await tf.setBackend('webgl');
- 训练过程放在Web Worker中，防止阻塞UI
- 模型太大时考虑量化压缩或使用TensorFlow Lite转换
基本上就这些。TensorFlow.js降低了前端搞AI的门槛，很多功能开箱即用。动手试试，把智能带到用户浏览器里。
