Cinq façons d'utiliser l'IA générative en JavaScript
Le développement de l'apprentissage automatique et de l'IA est traditionnellement dominé par Python et de ce fait, l'écosystème de didacticiels, de bibliothèques et d'exemples est principalement dominé par Python. Cependant, avec la montée en puissance du concept AI Engineer, nous voyons de plus en plus de développeurs Web full-stack commencer à travailler sur l'IA, et avec elle la demande d'outils compatibles JavaScript/Typescript augmente. En fait, en février 2024, Jared Palmer de Vercel affirmait même que « l'ingénieur IA du futur est un ingénieur TypeScript ».
Dans cet article de blog, nous examinerons cinq façons dont vous, en tant que développeur JavaScript, pouvez utiliser différents outils d'IA générative sans perfectionner vos compétences Python.
API cloud
Si vous débutez tout juste et surtout si vous envisagez d'utiliser un Large Language Model (LLM) comme les modèles GPT d'OpenAI ou les modèles Claude d'Anthropic en utilisant directement leurs API peut être un excellent début.
Interagir avec le modèle en un seul appel.
fetch("https://api.openai.com/v1/chat/completions", { body: JSON.stringify({ "model": "gpt-4o-mini", "messages": [ { "role": "system", "content": "You are a helpful assistant." }, { "role": "user", "content": "Who won the world series in 2020?" }, { "role": "assistant", "content": "The Los Angeles Dodgers won the World Series in 2020." }, { "role": "user", "content": "Where was it played?" } ] }), headers: { Authorization: `Bearer ${process.env.OPENAI_API_KEY}`, "Content-Type": "application/json" }, method: "POST" })
En fait, l'API « Chat Completions » d'OpenAI est devenue le standard de facto pour de nombreux autres fournisseurs de modèles. Des fournisseurs comme Groq ou Together.ai offrent une compatibilité OpenAI, ce qui signifie qu'il vous suffit de modifier l'URL pour passer à un autre fournisseur et choisir un modèle différent.
Si vous cherchez à utiliser d'autres modèles, il existe également des fournisseurs comme Replicate qui se spécialisent dans l'hébergement de modèles open source avec une API REST cohérente et exposent même des API pour affiner certains modèles sur leur plate-forme.
Docker
Bien que les API Cloud soient idéales pour démarrer, vous ne souhaitez parfois pas compter sur un fournisseur hébergé dans le cloud pour votre cas d'utilisation. Par exemple, vous souhaitez peut-être exécuter explicitement un modèle comme Llama 3 8B directement sur votre ordinateur local ou vous souhaitez utiliser une bibliothèque open source comme Unstructured.io écrite en Python et l'utiliser dans votre projet JavaScript sans payer pour l'hébergement. API.
Certains projets fournissent pour cette raison un conteneur Docker qui exposera une API HTTP lors de son exécution. Par exemple, vous pouvez démarrer le conteneur Docker API non structuré en exécutant :
docker run -p 8000:8000 -d --rm --name unstructured-api downloads.unstructured.io/unstructured-io/unstructured-api:latest --port 8000 --host 0.0.0.0
Une fois le conteneur exécuté, vous disposez désormais d'une version localhost de l'API non structurée que vous pouvez utiliser pour fragmenter des documents afin de les stocker ultérieurement dans votre base de données vectorielles.
const form = new FormData(); const buffer = // e.g. `fs.readFileSync('./fileLocation'); const fileName = 'test.txt'; form.append('file', buffer, { contentType: 'text/plain', name: 'file', filename: fileName, }); const response = await fetch('http://localhost:8000/general/v0/general', { method: 'POST', body: form, headers: { Accept: "application/json", "Content-Type": "multipart/form-data" }, })
De même, vous pouvez utiliser le conteneur Docker llama.cpp ou Ollama pour exécuter des API locales pour vos modèles LLM tels que Llama 3.
Si vous travaillez avec une équipe ML qui a formé son propre modèle ou si vous souhaitez héberger n'importe quel modèle hors Huggingface et utiliser la même approche de conteneur Docker, vous pouvez également consulter cog de Replicate. Il enveloppe Docker et est spécialement conçu pour créer des conteneurs Docker pour les modèles ML.
Tout cela fonctionne très bien si vous disposez d'une surface relativement petite de tâches que vous souhaitez effectuer et que la composabilité est limitée.
Bibliothèques natives JavaScript
Maintenant, celle-ci est peut-être l'option la plus évidente, mais la meilleure option reste de choisir une bibliothèque ou un outil qui a été écrit nativement en JavaScript ou TypeScript et heureusement, cet écosystème continue de croître.
La plupart des fournisseurs de modèles d'API cloud proposent un SDK natif JavaScript incl. OpenAI, Anthropic et Google.
De plus, deux des frameworks LLM open source les plus populaires, Langchain et LlamaIndex, fournissent des versions TypeScript de leurs frameworks. Vercel propose également le SDK ai qui est construit à partir de zéro en mettant davantage l'accent sur le rapprochement des LLM et des expériences front-end qu'ils alimentent. Même si la documentation est fortement axée sur le framework Next.js de Vercel, le SDK fonctionne également avec d'autres frameworks.
import { openai } from '@ai-sdk/openai'; import { generateText } from 'ai'; const { text } = await generateText({ model: openai('gpt-4o'), prompt: 'Write a vegetarian lasagna recipe for 4 people.', });
Cependant, étant donné que la plupart d'entre eux intègrent finalement d'autres outils et frameworks sous forme d'intégrations, vous vous retrouvez encore souvent avec des fonctionnalités plus limitées que leurs homologues Python. Par exemple, la version Python de Langchain propose 18 intégrations différentes de transformateurs de documents tandis que la version JavaScript en compte 5.
API LLM natives
Maintenant, celui-ci est encore plus tourné vers l’avenir. Google Chrome a récemment publié un ensemble expérimental d'API dans les canaux Chrome Dev et Chrome Canary qui exposent l'accès à un modèle Gemini Nano exécuté localement.
const session = await window.ai.createTextSession(); await session.prompt("Translate the following to German: Hello how are you?") // " Hallo, wie gehts"
Étant donné que le modèle est si petit par rapport aux modèles de pointe, y compris les plus petits comme le GPT-4o mini ou le Llama 3.1 8B, vous aurez probablement plus de mal à le faire de manière fiable. Cependant, avec le rythme de développement du modèle, cela changera probablement rapidement.
While this API is still experimental and only spearheaded by Chrome, the trend of local LLMs might change this quickly as more companies get interested. Mozilla, for example, recently announced that they are focused on moving "local AI" forward incl. creating a new dedicated accelerator program and Apple is already using local models for their new Apple Intelligence feature.
If you want to give the window.ai API a shot, check out Google's explainer repository as well as the chrome-ai package for Vercel's ai SDK to get started.
Pythonia
One interesting approach to using Python tools in JavaScript is pythonia. It's one half of the JSPyBridge project that creates an interface to call JavaScript from Python and Python from JavaScript by facilitating the interprocess communication so that you can write code in the language of your choice.
It uses inter-process communication (IPC) and JavaScript Proxies to enable you to almost use identical code when calling a Python library in JavaScript than in Python and then actually executing it in Python.
For example, here's a code snippet taken from the getting started guide of the Python library haystack-ai:
from haystack import Pipeline, PredefinedPipeline pipeline = Pipeline.from_template(PredefinedPipeline.CHAT_WITH_WEBSITE) result = pipeline.run({ "fetcher": {"urls": ["https://haystack.deepset.ai/overview/quick-start"]}, "prompt": {"query": "Which components do I need for a RAG pipeline?"}} ) print(result["llm"]["replies"][0])
By using the pythonia npm package we can write the same equivalent code:
import { python } from "pythonia"; const haystack = await python("haystack"); const { Pipeline, PredefinedPipeline } = await haystack; const template = await PredefinedPipeline("chat_with_website"); const pipeline = await Pipeline.from_template(template); const result = await pipeline.run({ fetcher: { urls: ["https://haystack.deepset.ai/overview/quick-start"] }, prompt: { query: "Which components do I need for a RAG pipeline?" }, }); console.log((await result.valueOf()).llm.replies[0]); python.exit();
You might notice that this code is slightly longer and heavily uses await. That's because of the IPC communication. pythonia does a lot of optimizations behind the scenes to effectively communicate between the channels. For example, the actual data is not being sent back from Python to Node.js unless you call valueOf(). However, outside of that the code is very similar and is using native Python libraries.
Performance of pythoia
One concern for you might be performance and while it would be slower than entirely running in Python, the actual performance might surprise you. If you want to use a Python library, like RAGatoille, but the rest of your system is written in JavaScript, really the only alternative to pythonia is exposing the library through an HTTP API and using fetch to bridge the systems.
If we run a benchmark where we use the haystack-ai code snippet from above and run it both using pythonia and expose it using FastAPI, both requests are slow because of their calls to OpenAI but pythonia actually slightly wins the race.
Overall while there is a performance hit of using pythonia over using only native Python, given the long-running nature of most generative AI calls, the overhead becomes relatively negligible especially when compared to making local HTTP requests.
Conclusion
While more and more JavaScript developers are getting into the Generative AI space, we still have ways to go to catch up to an ecosystem that has the breadth of the Python space. Cloud APIs, running local Docker containers, and bridging projects such as pythonia are great options to tap into this space without moving all of your logic into Python. Ultimately it's up to us though to either grow the space of available AI JavaScript tools by contributing to existing open-source projects or even starting new ones if you want to maintain a project. In the meantime, AI tools such as GitHub Copilot, Cursor, or Codeium can help you with writing some Python code.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds











Différents moteurs JavaScript ont des effets différents lors de l'analyse et de l'exécution du code JavaScript, car les principes d'implémentation et les stratégies d'optimisation de chaque moteur diffèrent. 1. Analyse lexicale: convertir le code source en unité lexicale. 2. Analyse de la grammaire: générer un arbre de syntaxe abstrait. 3. Optimisation et compilation: générer du code machine via le compilateur JIT. 4. Exécuter: Exécutez le code machine. Le moteur V8 optimise grâce à une compilation instantanée et à une classe cachée, SpiderMonkey utilise un système d'inférence de type, résultant en différentes performances de performances sur le même code.

Python convient plus aux débutants, avec une courbe d'apprentissage en douceur et une syntaxe concise; JavaScript convient au développement frontal, avec une courbe d'apprentissage abrupte et une syntaxe flexible. 1. La syntaxe Python est intuitive et adaptée à la science des données et au développement back-end. 2. JavaScript est flexible et largement utilisé dans la programmation frontale et côté serveur.

Le passage de C / C à JavaScript nécessite de s'adapter à la frappe dynamique, à la collecte des ordures et à la programmation asynchrone. 1) C / C est un langage dactylographié statiquement qui nécessite une gestion manuelle de la mémoire, tandis que JavaScript est dynamiquement typé et que la collecte des déchets est automatiquement traitée. 2) C / C doit être compilé en code machine, tandis que JavaScript est une langue interprétée. 3) JavaScript introduit des concepts tels que les fermetures, les chaînes de prototypes et la promesse, ce qui améliore la flexibilité et les capacités de programmation asynchrones.

Les principales utilisations de JavaScript dans le développement Web incluent l'interaction client, la vérification du formulaire et la communication asynchrone. 1) Mise à jour du contenu dynamique et interaction utilisateur via les opérations DOM; 2) La vérification du client est effectuée avant que l'utilisateur ne soumette les données pour améliorer l'expérience utilisateur; 3) La communication de rafraîchissement avec le serveur est réalisée via la technologie AJAX.

L'application de JavaScript dans le monde réel comprend un développement frontal et back-end. 1) Afficher les applications frontales en créant une application de liste TODO, impliquant les opérations DOM et le traitement des événements. 2) Construisez RestulAPI via Node.js et Express pour démontrer les applications back-end.

Comprendre le fonctionnement du moteur JavaScript en interne est important pour les développeurs car il aide à écrire du code plus efficace et à comprendre les goulots d'étranglement des performances et les stratégies d'optimisation. 1) Le flux de travail du moteur comprend trois étapes: analyse, compilation et exécution; 2) Pendant le processus d'exécution, le moteur effectuera une optimisation dynamique, comme le cache en ligne et les classes cachées; 3) Les meilleures pratiques comprennent l'évitement des variables globales, l'optimisation des boucles, l'utilisation de const et de locations et d'éviter une utilisation excessive des fermetures.

Python et JavaScript ont leurs propres avantages et inconvénients en termes de communauté, de bibliothèques et de ressources. 1) La communauté Python est amicale et adaptée aux débutants, mais les ressources de développement frontal ne sont pas aussi riches que JavaScript. 2) Python est puissant dans les bibliothèques de science des données et d'apprentissage automatique, tandis que JavaScript est meilleur dans les bibliothèques et les cadres de développement frontaux. 3) Les deux ont des ressources d'apprentissage riches, mais Python convient pour commencer par des documents officiels, tandis que JavaScript est meilleur avec MDNWEBDOCS. Le choix doit être basé sur les besoins du projet et les intérêts personnels.

Les choix de Python et JavaScript dans les environnements de développement sont importants. 1) L'environnement de développement de Python comprend Pycharm, Jupyternotebook et Anaconda, qui conviennent à la science des données et au prototypage rapide. 2) L'environnement de développement de JavaScript comprend Node.js, VScode et WebPack, qui conviennent au développement frontal et back-end. Le choix des bons outils en fonction des besoins du projet peut améliorer l'efficacité du développement et le taux de réussite du projet.
