Wes Bos & Scott Tolinski - Full Stack JavaScrip...

Zpravodajství

Technologické zprávy

Technika

740: Local AI Models in JavaScript - Machine Learning Deep Dive With Xenova

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

Scott and Wes are joined by special guest Xenova to explore local AI models in JavaScript. From Hugging Face to Transformers.js and practical applications like real-time speech recognition and object detection, this episode dives deep into the world of machine learning. <h3 class="code-line" data-line-start="2" data-line-end="3"><a id= "Show_Notes_2"></a>Show Notes</h3> <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <a href="#t=00:00">00:00</a> Welcome to Syntax!</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <a href="#t=00:41">00:41</a> Brought to you by <a href="www.sentry.io/syntax">Sentry.io</a></li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <a href="#t=01:05">01:05</a> Who is Xenova?</li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="#t=02:08">02:08</a> What is Hugging Face?</li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href="#t=03:29">03:29</a> What is Transformers.js?</li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="#t=06:16">06:16</a> How was the library developed?</li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href= "https://github.com/ajayyy/SponsorBlock">SponsorBlock</a></li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <a href="#t=09:04">09:04</a> How is it able to run?</li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <a href="#t=10:09">10:09</a> Do they have to run in Python and how does Onnx work?</li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <a href="https://onnx.ai/">Onnx.ai</a></li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <a href="https://huggingface.co/docs/optimum/index">Hugging Face Optimum</a></li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="#t=14:19">14:19</a> What are some things you can do with this tech?</li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <a href="#t=16:15">16:15</a> Vision tools.</li> <li class="has-line-data" data-line-start="17" data-line-end="18"> <a href="#t=17:38">17:38</a> This is actually running locally.</li> <li class="has-line-data" data-line-start="18" data-line-end="19"> <a href="#t=18:35">18:35</a> <a href= "https://huggingface.co/spaces/Xenova/doodle-dash">Doodle Dash</a></li> <li class="has-line-data" data-line-start="19" data-line-end="20"> <a href="#t=21:09">21:09</a> They currently run on CPU, what is required to make it run on GPU?</li> <li class="has-line-data" data-line-start="20" data-line-end="21"> <a href="#t=24:44">24:44</a> Can you run in JavaScript?</li> <li class="has-line-data" data-line-start="21" data-line-end="22"> <a href="#t=28:32">28:32</a> How it works with image vectors.</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> <a href="#t=34:23">34:23</a> Why would people want to run it in another language?</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> <a href="#t=35:55">35:55</a> Resizing images in the browser instead of on the server.</li> <li class="has-line-data" data-line-start="24" data-line-end="25"> <a href="#t=38:55">38:55</a> Applications distributed on the web vs running locally.</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> <a href="#t=43:54">43:54</a> Electron has Node and Chrome, where would you run Transformers.js?</li> <li class="has-line-data" data-line-start="26" data-line-end="27"> <a href="#t=44:32">44:32</a> The API of Transformers.js</li> <li class="has-line-data" data-line-start="27" data-line-end="28"> <a href="#t=46:30">46:30</a> Object Detection.</li> <li class="has-line-data" data-line-start="28" data-line-end="29"> <a href= "https://huggingface.co/spaces/Xenova/semantic-image-search-client"> Semantic Image Search Client</a></li> <li class="has-line-data" data-line-start="29" data-line-end="30"> <a href= "https://huggingface.co/spaces/Xenova/video-object-detection">Real-Time Object Detection</a></li> <li class="has-line-data" data-line-start="30" data-line-end="31"> <a href= "https://huggingface.co/spaces/Xenova/remove-background-web">Background Removal Tool</a></li> <li class="has-line-data" data-line-start="31" data-line-end="32"> <a href="#t=48:33">48:33</a> What is the easiest way to get started?</li> <li class="has-line-data" data-line-start="32" data-line-end="33"> <a href="#t=51:26">51:26</a> Real-time speech recognition on the horizon?</li> <li class="has-line-data" data-line-start="33" data-line-end="34"> <a href="#t=52:08">52:08</a> Will we ever be able to run Stable Diffusion via JavaScript?</li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <a href="#t=56:10">56:10</a> The <a href= "https://webllm.mlc.ai/">Web LLM</a>.</li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <a href="#t=57:22">57:22</a> Practical applications for YouTube.</li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href="#t=59:39">59:39</a> What we want to build for Syntax.fm.</li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="#t=01:06:43">01:06:43</a> Mean pooling, why it’s necessary.</li> <li class="has-line-data" data-line-start="38" data-line-end="39"> <a href="#t=01:09:30">01:09:30</a> Stopping YouTube spam comments.</li> <li class="has-line-data" data-line-start="39" data-line-end="40"> <a href="#t=01:10:34">01:10:34</a> K-Means Clustering.</li> <li class="has-line-data" data-line-start="40" data-line-end="41"> <a href= "https://discuss.huggingface.co/t/short-text-clustering/5829">Text Clustering</a></li> <li class="has-line-data" data-line-start="41" data-line-end="42"> <a href="#t=01:13:49">01:13:49</a> Quantization.</li> <li class="has-line-data" data-line-start="42" data-line-end="44"> <a href="#t=01:17:35">01:17:35</a> Sick Picks + Shameless Plugs.</li> </ul> <h3 class="code-line" data-line-start="44" data-line-end="45"> <a id="Sick_Picks_44"></a>Sick Picks</h3> <ul> <li class="has-line-data" data-line-start="46" data-line-end="48"> Xeonva: <a href= "https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API">WebGPU</a></li> </ul> <h3 class="code-line" data-line-start="48" data-line-end="49"> <a id="Shameless_Plugs_48"></a>Shameless Plugs</h3> <ul> <li class="has-line-data" data-line-start="50" data-line-end="52"> Xenova: <a href="https://twitter.com/xenovacom">Xenova on X</a></li> </ul> <h3 class="code-line" data-line-start="52" data-line-end="53"> <a id="Hit_us_up_on_Socials_52"></a>Hit us up on Socials!</h3> Syntax: <a href="https://twitter.com/syntaxfm">X</a> <a href= "https://www.instagram.com/syntax_fm/">Instagram</a> <a href= "https://www.tiktok.com/@syntaxfm">Tiktok</a> <a href= "https://www.linkedin.com/company/96077407/admin/feed/posts/">LinkedIn</a> <a href="https://www.threads.net/@syntax_fm">Threads</a> Wes: <a href="https://twitter.com/wesbos">X</a> <a href= "https://www.instagram.com/wesbos/">Instagram</a> <a href= "https://www.tiktok.com/@wesbos">Tiktok</a> <a href= "https://www.linkedin.com/in/wesbos/">LinkedIn</a> <a href= "https://www.threads.net/@wesbos">Threads</a> Scott:<a href="https://twitter.com/stolinski">X</a> <a href= "https://www.instagram.com/stolinski/">Instagram</a> <a href= "https://www.tiktok.com/@stolinski">Tiktok</a> <a href= "https://www.linkedin.com/in/stolinski/">LinkedIn</a> <a href= "https://www.threads.net/@stolinski">Threads</a> Randy: <a href="https://twitter.com/randyrektor">X</a> <a href= "https://www.instagram.com/randyrektor/">Instagram</a> <a href= "https://www.youtube.com/@randyrektor">YouTube</a> <a href= "https://www.threads.net/@randyrektor">Threads</a>

Scott and Wes are joined by special guest Xenova to explore local AI models in JavaScript. From Hugging Face to Transformers.js and practical applications like real-time speech recognition and object detection, this episode dives deep into the world of machine learning.
 Show Notes  00:00 Welcome to Syntax!
 00:41 Brought to you by Sentry.io

 01:05 Who is Xenova?
 02:08 What is Hugging Face?
 03:29 What is Transformers.js?
 06:16 How was the library developed?
 SponsorBlock

 09:04 How is it able to run?
 10:09 Do they have to run in Python and how does Onnx work?
 Onnx.ai

 Hugging Face Optimum

 14:19 What are some things you can do with this tech?
 16:15 Vision tools.
 17:38 This is actually running locally.
 18:35 Doodle Dash

 21:09 They currently run on CPU, what is required to make it run on GPU?
 24:44 Can you run in JavaScript?
 28:32 How it works with image vectors.
 34:23 Why would people want to run it in another language?
 35:55 Resizing images in the browser instead of on the server.
 38:55 Applications distributed on the web vs running locally.
 43:54 Electron has Node and Chrome, where would you run Transformers.js?
 44:32 The API of Transformers.js
 46:30 Object Detection.
  Semantic Image Search Client

 Real-Time Object Detection

 Background Removal Tool

 48:33 What is the easiest way to get started?
 51:26 Real-time speech recognition on the horizon?
 52:08 Will we ever be able to run Stable Diffusion via JavaScript?
 56:10 The Web LLM.
 57:22 Practical applications for YouTube.
 59:39 What we want to build for Syntax.fm.
 01:06:43 Mean pooling, why it’s necessary.
 01:09:30 Stopping YouTube spam comments.
 01:10:34 K-Means Clustering.
 Text Clustering

 01:13:49 Quantization.
 01:17:35 Sick Picks + Shameless Plugs.
  Sick Picks  Xeonva: WebGPU

  Shameless Plugs  Xenova: Xenova on X

  Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
 Wes: X Instagram Tiktok LinkedIn Threads
 Scott:X Instagram Tiktok LinkedIn Threads
 Randy: X Instagram YouTube Threads

Aplikace Youradio Talk

740: Local AI Models in JavaScript - Machine Learning Deep Dive With Xenova

Poslechněte si podcast