کاوش مدل های ML با TensorFlow.js برای برنامه های مرورگر 🚀

Summarize this content to 400 words in Persian Lang
یادگیری ماشینی (ML) دیگر محدود به سرورهای پشتیبان یا محیط‌های با منابع سنگین نیست. به لطف TensorFlow.js، اکنون می توانید قدرت ML را مستقیماً به مرورگر بیاورید. این امکان‌های هیجان‌انگیز را برای برنامه‌های تعاملی بی‌درنگ و بدون نیاز به پشتیبان باز می‌کند. بیایید شیرجه بزنیم!

چرا TensorFlow.js؟ 🤖

TensorFlow.js یک کتابخانه منبع باز است که به شما امکان می دهد مدل های ML را با استفاده از جاوا اسکریپت بسازید، آموزش دهید و در مرورگر مستقر کنید. در اینجا دلیلی است که باید آن را در نظر بگیرید:

بدون Backend مورد نیاز است – محاسبات را مستقیماً در مرورگر انجام دهید.

تعامل زمان واقعی – از داده های محلی استفاده کنید و بازخورد فوری ارائه دهید.

سازگاری بین پلتفرم – روی هر دستگاهی با مرورگر کار می کند.

اهرم سخت افزار – از WebGL برای شتاب GPU استفاده کنید.

شروع 🌐

نصب و راه اندازی

برای شروع استفاده از TensorFlow.js، می توانید آن را از طریق CDN یا npm اضافه کنید:

CDN:

src=]]>”https://cdn.jsdelivr.net/npm/@tensorflow/tfjs”>

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

npm:

npm install @tensorflow/tfjs

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

گردش کار پایه

در اینجا یک گردش کار ساده برای ایجاد یک برنامه مرورگر مبتنی بر ML آورده شده است:

وارد کردن TensorFlow.js.
یک مدل بارگیری یا ایجاد کنید.
داده های ورودی را از قبل پردازش کنید.
پیش بینی کنید

ساختن اولین مدل شما 💡

بیایید یک مدل رگرسیون خطی ساده برای پیش بینی ایجاد کنیم y ارزش های مبتنی بر x ورودی ها

// Import TensorFlow.js
import * as tf from ‘@tensorflow/tfjs’;

// Step 1: Create a Sequential Model
const model = tf.sequential();

// Step 2: Add a Dense Layer
model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

// Step 3: Compile the Model
model.compile({
optimizer: ‘sgd’,
loss: ‘meanSquaredError’
});

// Step 4: Prepare Training Data
const xs = tf.tensor2d([1, 2, 3, 4], [4, 1]);
const ys = tf.tensor2d([1, 3, 5, 7], [4, 1]);

// Step 5: Train the Model
model.fit(xs, ys, { epochs: 500 }).then(() => {
// Step 6: Make Predictions
model.predict(tf.tensor2d([5], [1, 1])).print(); // Should print ~9
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

توضیح

مدل ترتیبی: پشته خطی از لایه ها.

لایه متراکم: لایه کاملا متصل با یک واحد.

بهینه ساز: نزول گرادیان تصادفی (SGD).

عملکرد از دست دادن: میانگین مربعات خطا (MSE).

بارگیری مدل های از پیش آموزش دیده 🎨

TensorFlow.js از بارگیری مدل های از پیش آموزش دیده پشتیبانی می کند. به عنوان مثال، می توانید از مدل MobileNet برای تشخیص تصویر استفاده کنید:

import * as tf from ‘@tensorflow/tfjs’;
import * as mobilenet from ‘@tensorflow-models/mobilenet’;

const img = document.getElementById(‘image’);

mobilenet.load().then(model => {
model.classify(img).then(predictions => {
console.log(‘Predictions:’, predictions);
});
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مثال استفاده

ورودی: عنصر تصویر در HTML

خروجی: پیش بینی ها (به عنوان مثال، “گربه”، “سگ”).

برنامه های کاربردی در دنیای واقعی 🌐

تشخیص شی در زمان واقعی: از TensorFlow.js با وب کم خود برای شناسایی اشیا در زمان واقعی استفاده کنید.

ابزارهای آموزش تعاملی: ابزارهای مبتنی بر مرورگر را برای آموزش مفاهیمی مانند ریاضی یا فیزیک ایجاد کنید.

بازی های مبتنی بر هوش مصنوعی: رفتارهای مبتنی بر ML را به بازی‌های درون مرورگر اضافه کنید.

نکات عملکرد 💡

بهینه سازی مدل ها: از مدل های کوچکتر برای استنتاج سریعتر در مرورگرها استفاده کنید.

GPU اهرمی: اطمینان حاصل کنید که WebGL برای شتاب سخت افزاری فعال است.

بارگذاری تنبل: مدل ها را فقط در صورت نیاز برای صرفه جویی در منابع بارگیری کنید.

کتابخانه ها و منابع محبوب 📈

نتیجه گیری 🏆

TensorFlow.js به توسعه دهندگان این امکان را می دهد که یادگیری ماشین را به طور یکپارچه در برنامه های مرورگر ادغام کنند. چه در حال ساخت یک بازی مبتنی بر هوش مصنوعی یا یک برنامه آموزشی باشید، امکانات بی پایان هستند. آزمایش را از امروز شروع کنید و خلاقیت های خود را با جامعه به اشتراک بگذارید!

سوال یا ایده ای دارید؟ آنها را در نظرات زیر رها کنید! 🔧

"https://cdn.jsdelivr.net/npm/@tensorflow/tfjs">

npm install @tensorflow/tfjs

// Import TensorFlow.js
import * as tf from '@tensorflow/tfjs';

// Step 1: Create a Sequential Model
const model = tf.sequential();

// Step 2: Add a Dense Layer
model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

// Step 3: Compile the Model
model.compile({
  optimizer: 'sgd',
  loss: 'meanSquaredError'
});

// Step 4: Prepare Training Data
const xs = tf.tensor2d([1, 2, 3, 4], [4, 1]);
const ys = tf.tensor2d([1, 3, 5, 7], [4, 1]);

// Step 5: Train the Model
model.fit(xs, ys, { epochs: 500 }).then(() => {
  // Step 6: Make Predictions
  model.predict(tf.tensor2d([5], [1, 1])).print(); // Should print ~9
});

import * as tf from '@tensorflow/tfjs';
import * as mobilenet from '@tensorflow-models/mobilenet';

const img = document.getElementById('image');

mobilenet.load().then(model => {
  model.classify(img).then(predictions => {
    console.log('Predictions:', predictions);
  });
});