TensorFlow.js 101: Aprendizaje automático en el navegador y más allá

Hola a todos. Mi nombre es Jason Mays, soy defensor del desarrollo para TensorFlow.js aquí en Google, y estoy emocionado de hablarles sobre el aprendizaje automático en el navegador y JavaScript. Así que empecemos. Ahora, primero, ¿por qué querrías usar el aprendizaje automático en JavaScript? Esa es una excelente pregunta. Y si miramos aquí, podemos ver que podemos utilizar el aprendizaje automático en cualquier lugar donde se pueda ejecutar JavaScript, y eso es en realidad muchos lugares. El navegador web, el lado del servidor, el escritorio, el móvil e incluso el Internet de las cosas. Y si nos adentramos un poco más en cada una de estas áreas, podemos ver muchas de las tecnologías que ya conocemos y amamos. Los navegadores web comunes en el lado izquierdo, Node.js, React Native para aplicaciones móviles nativas, Electron para aplicaciones de escritorio nativas e incluso Raspberry Pi para el Internet de las cosas. Y JavaScript es uno de los únicos lenguajes que puede ejecutarse en todos estos entornos sin necesidad de complementos adicionales. Y eso por sí solo es muy, muy poderoso. Y con TensorFlow.js, puedes ejecutar, volver a entrenar a través del aprendizaje por transferencia o escribir tus propios modelos desde cero si así lo deseas. Al igual que lo harías en Python en este momento, pero en JavaScript. Y eso significa que puedes crear cualquier cosa que puedas imaginar. Desde realidad aumentada, reconocimiento de sonido, análisis de sentimientos, y mucho, mucho más. Realmente depende de ti lo que crees.

Ahora, con TensorFlow.js, tenemos varias formas diferentes en las que puedes utilizarlo. La primera forma y la más fácil es utilizar nuestros modelos pre-entrenados. Estos son muy fáciles de usar, clases de JavaScript para muchos casos de uso comunes, como podemos ver en la diapositiva actual. Aquí, podemos ver cosas como detección de objetos, segmentación corporal, estimación de postura, detección de puntos de referencia faciales y mucho, mucho más. Incluso se admite el procesamiento de lenguaje natural en el navegador.

Así que veamos algunos de estos en acción. Primero, tenemos el reconocimiento de objetos. Esto utiliza Cocoa SSD en segundo plano y está entrenado en 90 clases de objetos. Puedes ver esto en acción en el lado derecho, donde los perros están resaltados con sus cuadros delimitadores. Incluso podemos saber que hay dos perros en esta imagen, ya que ambos se nos devuelven. Así que veamos esto en acción en vivo para ver cómo funciona en el navegador.

Muy bien, aquí hay una página web que creé que ejecuta este código en vivo en Chrome, y si hago clic en cualquiera de estas imágenes, ahora puedo obtener la detección de objetos para cualquier objeto que encuentre en esas imágenes, incluso si son diferentes tipos de clases de objetos. Pero podemos hacer algo mejor que esto. Podemos habilitar la cámara web y hacer esto en tiempo real. Y puedes verme hablando contigo en este momento, y puedes ver cómo clasifica tanto a mí como a la cama en el fondo a veces mientras te hablo. Y esto es genial, porque no solo se ejecuta a una velocidad de fotogramas muy alta en JavaScript en tiempo real, sino que se ejecuta en el lado del cliente en un navegador. Eso significa que ninguna de estas imágenes de la cámara web se envía a un servidor para su clasificación. Esto no solo ahorra costos, sino que también significa que se preserva mi privacidad, y eso es algo realmente importante en estos días. Y con TensorFlow.js, puedes obtener eso de forma gratuita. A continuación, tenemos la malla facial. Este tiene solo tres megabytes de tamaño y puede reconocer 468 puntos de referencia faciales en el rostro humano. Puedes ver esto en acción en el lado izquierdo de la diapositiva en este momento. Ahora, las personas están comenzando a utilizar esto para casos de uso del mundo real, como L'oreal, y han creado AR Makeup Trion, que permite probarse lápiz labial en tiempo real sin siquiera tener que estar físicamente presente en la tienda. Así que debes tener en cuenta que la mujer del lado derecho no lleva ningún lápiz labial. Estamos utilizando la malla facial para entender dónde están sus labios, y luego usamos sombreadores de WebGL para cambiar el color del lápiz labial que ella desea en su rostro en tiempo real. Así que esto es genial, y estoy seguro de que veremos más cosas como esta en el futuro. Así que veamos la malla facial en acción para ver cómo funciona en el mundo real. Cambiemos a la demostración. Muy bien. Ahora puedes verme hablando contigo con la malla facial funcionando en tiempo real en la Web.

Pero, ¿por qué detenerse ahí? Podemos ir un paso más allá. Al agregar WebRTC a esto, que significa Comunicación en Tiempo Real a través de la Web, incluso puedo teletransportarme. Aquí, puedo segmentar mi cuerpo usando fotos corporales de mi habitación. Puedo transmitir esa segmentación a través de Internet y luego reconstruirla en un espacio físico real utilizando WebXR. Y esto me permite hablar con mis amigos y familiares en los tiempos actuales donde no podemos viajar tanto de una manera más significativa que una llamada de video rectangular. De hecho, tal vez en el futuro, mis futuras presentaciones les sean entregadas de esta forma. ¿Quién sabe? Pero hay cosas muy emocionantes por delante.

Ahora, la segunda forma de usar TensorFlow.js es mediante el aprendizaje por transferencia. Y esto te permite volver a entrenar modelos existentes para trabajar con tus propios datos personalizados. Ahora, por supuesto, si eres un experto en machine learning, puedes hacer esto de forma programática. Pero hoy quiero mostrarte dos formas más sencillas de comenzar. La primera es Teachable Machine. Este es un sitio web que puede realizar tanto el entrenamiento como la inferencia completamente en el navegador web. Esto es ideal para prototipos, para cosas como detección de objetos, estimación de poses y detección de sonido. Creo que en el futuro se admitirán más modelos . Así que, estén atentos. Pero veámoslo en acción para que puedas tener una idea de cómo funciona. Bien. Si vamos a teachablemachine.withgoogle.com. Puedes seguirme si quieres. Podemos seleccionar uno de los tres proyectos disponibles. Hoy vamos a elegir un proyecto de imágenes para reconocer un objeto personalizado. Así que hacemos clic en eso y luego se nos presenta una pantalla como esta. A la izquierda, tenemos una serie de clases para el objeto que queremos reconocer. Si queremos reconocer más de dos cosas, podemos hacer clic en el botón agregar clase si así lo deseamos. Pero hoy solo vamos a reconocer mi rostro o una baraja de cartas. Así que vamos a darles nombres más significativos. Voy a llamar al primer uno Jason para representarme a mí, y la segunda clase la llamaré cartas, que representa las cartas. Todo lo que necesitamos hacer es permitir el acceso a nuestra webcam, y verás una vista previa en vivo que aparecerá en el lado izquierdo para la primera clase. Ahora, solo necesito grabar algunas muestras de mi rostro para asegurarnos de tener algunos datos de entrenamiento para este tipo de clase. Así que vamos a hacer eso. Voy a mover mi cabeza para obtener algo de variedad. Listo. Y podemos ver que tengo cuántas imágenes tengo allí. ¿Unas 38 imágenes de muestra? Perfecto. Ahora voy a hacer lo mismo con la clase número dos, la baraja de cartas, y aquí tengo un buen conjunto de cartas para jugar. Así que, lo que voy a hacer es mantener presionado para grabar nuevamente, pero esta vez voy a obtener aproximadamente

Entonces, cloud AutoML nos permite entrenar modelos de visión personalizados en la cloud. Y podemos implementar el TensorFlow.js al final, lo cual es súper útil. Entonces, todo lo que tienes que hacer es cargar carpetas de imágenes que deseas clasificar en Google Cloud Storage, como puedes ver aquí. Y luego hacer clic en el siguiente botón. Una vez que hagas eso, se te preguntará si deseas optimizar tu modelo para una mayor precisión o predicciones más rápidas o algún tipo de compensación entre ambos. Puedes establecer un presupuesto y dejarlo entrenando durante horas o días, dependiendo de cuántos datos hayas cargado allí. Y te devolverá los mejores resultados. Va a probar muchos hiperparámetros diferentes, muchos tipos diferentes de modelos de visión por computadora e intentará averiguar qué funciona mejor con tus data. Una vez que esté listo, puedes hacer clic en exportar y elegir TensorFlow.js como se muestra aquí en el círculo, lo cual descargará los archivos model.json, que necesitas ejecutar en el navegador web. Y con eso, puedes usarlo en tu propia página web y agregar tu propia experiencia de usuario e interfaz de usuario, y así sucesivamente. Puede que te preguntes, bueno, ¿qué tan difícil es realmente usar este modelo entrenado de calidad de producción? Y en realidad,

Ahora, la tercera forma de usar TensorFlow.js es escribir tu propio código. Y, por supuesto, pasar por eso sería una charla completamente diferente en sí misma. Así que hoy me voy a centrar en los superpoderes y los beneficios de rendimiento de por qué podrías considerar usar TensorFlow.js en el navegador. Primero, quiero darte una visión general de cómo está estructurada nuestra API.

Tenemos dos APIs. Una es la API LES de alto nivel, que es muy similar a Keras si estás familiarizado con Python. De hecho, si usas Keras, básicamente son las mismas firmas de funciones. Así que deberías sentirte como en casa. Y luego, para aquellos que quieren ir a un nivel más bajo, tenemos la API Ops, que es la capa más matemática que te permite hacer cosas como álgebra lineal y demás. Puedes ver cómo se unen en el siguiente diagrama.

En la parte superior, tenemos nuestros modelos predefinidos, que se basan en nuestra API LES. Esa API LES se basa en nuestra API Ops y entiende cómo comunicarse con diferentes entornos, como el lado del cliente. Y con lado del cliente nos referimos a cosas como el navegador web. Ahora, esos entornos en sí mismos pueden ejecutarse en diferentes backends. Y en este caso, podemos ejecutar en cosas como la CPU, que es la forma más lenta de ejecución, WebGL para obtener aceleración de la tarjeta gráfica y Web Assembly o WASM para mejorar el rendimiento en la CPU en dispositivos móviles. Y lo mismo ocurre en el lado del servidor. Podemos ejecutar usando Node.js en el lado del servidor y esto puede comunicarse con las mismas bibliotecas de enlace de TensorFlow CPU y GPU que tiene Python. Así que sí, eso significa que obtienes el mismo soporte AVX y la misma aceleración CUDA que en Python. Y de hecho, como veremos más adelante, esto significa que los beneficios de rendimiento son prácticamente los mismos también. Ejecutamos tan rápido y a veces más rápido que Python para ciertos casos de uso.

Ahora, si eliges seguir desarrollando tu aprendizaje automático en Python, lo cual muchos de ustedes, por supuesto, harán, eso está completamente bien también. Nuestra implementación de Node.js admite la carga de modelos Keras y TensorFlow Saves sin necesidad de conversión. Así que siempre que estés ejecutando en el lado del servidor en Node, no se requiere ninguna conversión para usarlo e integrarlo, por ejemplo, con un equipo web. Muy conveniente. Y luego, si eliges tomar tu modelo saves y quieres ejecutarlo en el navegador web, entonces tendrás que usar nuestro convertidor de línea de comandos de TensorFlow.js para hacerlo. Eso convertirá el formato del modelo saves en el formato .json que necesitamos para ejecutarlo en el navegador web. Y eso solo es necesario si quieres ejecutarlo en el lado del cliente en el navegador. Así que hablemos del rendimiento. Aquí, podemos ver para MobileNet V2, los tiempos promedio de inferencia para GPU y CPU. Mirando los resultados de GPU, puedes ver que para tf.python, obtenemos un resultado de 7.98 milisegundos, y para Node.js, obtenemos 8.81. Así que básicamente están dentro de un milisegundo el uno del otro, lo cual es prácticamente el mismo resultado. Ahora, lo importante a tener en cuenta aquí es que si tienes mucho pre y post-procesamiento, y lo conviertes para que esté escrito en Node.js, obtendrás los beneficios del compilador en tiempo real que es único de JavaScript en tiempo de ejecución. Y esto puede llevar a mejoras significativas de rendimiento fuera de la inferencia por sí sola. Así que veamos cómo Huggingface

Nos permite utilizar el formato de modelo guardado de TensorFlow sin ningún tipo de conversión o penalización de rendimiento. Y podemos ejecutar modelos más grandes de los que podemos hacer en el lado del cliente. Por supuesto, puede haber límites de memoria de GPU a los que te puedes enfrentar si intentas enviar un modelo de un gigabyte a través de la web al dispositivo del cliente. El tercer punto es que te permite programar en un solo lenguaje. Si ya estás utilizando JavaScript, esto es una gran ventaja. Según la encuesta de StackOverflow 2020, actualmente el 67% de los desarrolladores utilizan JavaScript en su desarrollo. Además, hay un gran ecosistema de NPM para Node.js con muchos módulos y bibliotecas que se lanzan constantemente, por lo que también hay un gran soporte de la comunidad. Y luego el quinto punto, el rendimiento, como mencionamos antes, obtenemos las mismas conexiones C que el TensorFlow original en Python, lo que se puede utilizar para obtener una velocidad de inferencia similar, y tenemos el impulso del compilador en tiempo real para el pre y post-procesamiento si decides convertirlo a Node.js. Así que con eso, terminemos con algunos recursos que puedes utilizar para comenzar y aprender más. Si hay una diapositiva que quieras marcar, que sea esta. Aquí puedes ver todos los recursos que necesitas para comenzar con TensorFlow.js. Nuestro sitio web está en la parte superior, donde puedes encontrar muchos recursos y tutoriales para ayudarte en tu camino. Tenemos nuestros modelos disponibles en tensorflow.org.js.models. Hoy solo te he mostrado tres o cuatro, pero hay muchos más disponibles que también puedes utilizar de inmediato para comenzar rápidamente. Somos completamente de código abierto, por lo que también estamos disponibles en GitHub, y animamos a contribuir al proyecto si te sientes ambicioso. Tenemos un grupo de Google para preguntas técnicas más avanzadas que son monitoreadas por el grupo, y por supuesto, también tenemos ejemplos de código en Glitch para ayudarte a comenzar con el código base y comprender cómo tomar datos de una cámara web y pasarlos a algunos de nuestros modelos.

Entonces, con eso, puedes comenzar muy, muy rápido. Ahora, si quieres profundizar, te recomiendo leer 'Deep Learning with JavaScript' de Manning Productions, escrito por personas de mi equipo y del propio equipo de TensorFlow. Es un gran libro y solo necesitas tener conocimientos básicos de JavaScript, no asume conocimientos previos de machine learning y es un gran recurso para ir de cero a héroe.

Y con eso, te animo a unirte a nuestra comunidad. Si revisas el hashtag madewithTF.js en Twitter o LinkedIn, encontrarás cientos de proyectos que la gente está creando cada semana en todo el mundo, y no puedo mostrarlos todos en la presentación de hoy, pero aquí tienes un vistazo de algunas de las grandes cosas que están sucediendo en la comunidad. Así que mi última pregunta para ti es, ¿qué vas a crear? Aquí tienes una última pieza de inspiración de un chico de nuestra comunidad en Tokio, Japón. Es un bailarín, pero ha utilizado TensorFlow.js para crear este video de hip-hop tan genial que puedes ver en la diapositiva. Mi punto es que el aprendizaje automático ahora está al alcance de todos, y estoy muy emocionado de ver cómo todos los demás en el mundo comenzarán a utilizar el aprendizaje automático ahora que es más accesible. Artistas, músicos, creativos... Todos tienen ahora la oportunidad de utilizar el aprendizaje automático, y si lo haces, por favor utiliza el hashtag madewithTF.js para que podamos destacarte en nuestras futuras presentaciones y publicaciones en el blog. Muchas gracias por escuchar, y siéntete libre de mantener contacto. Estoy disponible en Twitter y LinkedIn para más preguntas y espero hablar contigo pronto. ¡Gracias!