Crea tu propio tiempo de ejecución de JavaScript

Rate this content
Bookmark

En esta charla, crearemos un pequeño tiempo de ejecución de JavaScript desde cero en Rust. Aprovecharemos el mismo ecosistema de componentes que utiliza Deno para mostrar que crear un tiempo de ejecución personalizado que se ajuste a tus necesidades es simple y divertido en 2023

FAQ

Bartek es un miembro del equipo de Deno que comenzó a contribuir al proyecto en 2018 y se convirtió en empleado de la compañía a fines de 2019. Actualmente lidera el equipo de CLI de Deno.

Deno es un tiempo de ejecución de JavaScript y TypeScript que permite importar código desde sistemas de archivos, servidores remotos y NPM. Está construido usando Rust, a diferencia de Node.js que utiliza C++. Deno maneja la transpilación y verificación de TypeScript automáticamente y viene con varias herramientas integradas para facilitar el desarrollo.

Deno utiliza Rust para el código nativo y el motor de JavaScript V8. También integra varias API web y tiene un robusto sistema de crates que permite la reutilización de paquetes, similar a los paquetes npm en Node.js.

Run.js es un pequeño tiempo de ejecución de JavaScript desarrollado como parte de un proyecto de Deno. Consiste en 140 líneas de Rust y 37 líneas de JavaScript, y soporta módulos ES, operaciones de archivos y una API básica de fetch.

Crear un tiempo de ejecución personalizado con Deno implica combinar diferentes crates y APIs según las necesidades. Deno proporciona la infraestructura necesaria y permite a los usuarios seleccionar y configurar las características deseadas para su propio runtime.

Deno ofrece un entorno seguro y productivo con herramientas integradas como Formatter, TestRunner y Linter. Su arquitectura basada en Rust y la integración con numerosas API web facilitan el desarrollo y la personalización de runtimes, además de proporcionar un manejo eficiente de los recursos.

Deno CLI está diseñado para desarrollo local y despliegue en servidores propios o Lambdas, mientras que Deno Deploy está orientado a implementaciones en contenedores nativos en la nube. Ambos runtimes son similares pero no idénticos, ofreciendo flexibilidad según los requisitos del usuario.

Bartek Iwanczuk
Bartek Iwanczuk
21 min
17 Apr, 2023

Comments

Sign in or register to post your comment.

Video Summary and Transcription

Esta charla presenta Deno, un tiempo de ejecución personalizado de JavaScript similar a Node.js, y analiza los beneficios de utilizar un tiempo de ejecución personalizado. Explora el proceso de construcción de un tiempo de ejecución personalizado con Deno en Rust, incluida la integración con Cargo y la capacidad de combinar y combinar cajas y APIs. La charla también cubre la implementación de la función setTimeout en Run.js y Runtime.js, y proporciona ejemplos de cómo solucionar errores e implementar funciones adicionales. En general, la charla destaca la flexibilidad y las posibilidades de crear tiempos de ejecución personalizados con Deno.

Available in English: Roll you own JavaScript runtime

1. Introducción a Deno y Custom JavaScript Runtime

Short description:

Hola, gente. Soy Bartek del equipo de Deno. Hablaremos sobre la creación de un Custom JavaScript Runtime, basado en nuestra experiencia con Run.js. Deno es un tiempo de ejecución de JavaScript y TypeScript, similar a Node.js. Admite la importación de códigos fuente, la transpilación de TypeScript y tiene muchas herramientas. Deno también proporciona soporte para muchas API web.

Hola, gente. Mi nombre es Bartek, y soy del equipo de Deno, y bienvenidos a su propio tiempo de ejecución de JavaScript. Un poco sobre mí. Comencé a contribuir a Deno en 2018, y luego me convertí en empleado de la compañía a fines de 2019, y he estado con la compañía desde entonces. Actualmente lidero el equipo de CLI de Deno, y si tienen alguna pregunta o seguimiento, no duden en comunicarse a través de uno de los enlaces proporcionados aquí. Entonces, en esta charla, vamos a hablar un poco sobre cómo crear o desarrollar su propio tiempo de ejecución personalizado de JavaScript. No vamos a hacer esto desde cero. Esta charla se basa en un par de publicaciones de blog que hicimos en el pasado. Creamos un pequeño tiempo de ejecución de JavaScript llamado Run.js, y pueden seguir los enlaces y la grabación aquí si desean aprender un poco más sobre la historia del proyecto. Bueno, en nuestra opinión, es bastante fácil comenzar si desean crear su propio tiempo de ejecución de JavaScript. Gracias a las tecnologías que podemos usar ahora, que son el motor para ejecutar JavaScript, pero también parte de la infraestructura que el equipo de Deno proporciona. Entonces, sin más preámbulos, vamos a meternos de lleno en esto. Pero antes de hacerlo, necesitamos aprender un poco más sobre Deno en sí mismo. Deno es un tiempo de ejecución de JavaScript y TypeScript. Su objetivo es ser divertido y productivo de usar. Deno admite la importación de códigos fuente desde un sistema de archivos, desde servidores remotos utilizando los protocolos HTTP o HTTPS, y también admitimos importaciones de NPM utilizando estos especificadores de columna de NPM. Deno es un tiempo de ejecución de TypeScript en el sentido de que no es necesario compilar explícitamente sus fuentes de TypeScript a JavaScript antes de ejecutarlas. Deno puede encargarse de eso por ustedes. Puede transpilar las fuentes, pero también puede verificar los tipos. Deno está construido utilizando Rust y el motor de JavaScript, por lo que en cierto sentido es muy similar a Node.js porque ambos utilizamos el mismo motor de JavaScript. Sin embargo, Deno utiliza Rust para su código nativo, mientras que Node.js utiliza C++. Deno viene con todo incluido. Tenemos muchas herramientas que les permiten comenzar en segundos. Tenemos Formatter, TestRunner, Linter. Incluso pueden crear un binario autocontenido, es decir, empaquetarán todo el código fuente que proporcionen y luego les dará un solo archivo ejecutable. Es algo similar al paquete PKG MPM que pueden usar. Deno también está muy involucrado en las API web. Tenemos muchas de ellas, especialmente Fetch, TextEncoder, TextDecoder, Blob. También tenemos soporte para la API de WebStreams y la API de WebWorker. Hay muchas, muchas más de estas API y les sugiero que visiten el MDM

2. Deano in Rust: Construyendo Runtimes Personalizados

Short description:

Deano en Rust fue una decisión importante para el proyecto, ya que permitió un desarrollo rápido y aprovechó un vasto ecosistema de crates de alta calidad. Construir Deano es fácil con la integración de Cargo, y los archivos binarios precompilados ahorran tiempo. El sistema de crates de Rust permite la organización modular del código, y Deano ofrece dos runtimes: CLI para desarrollo local y Deano deploy para implementación en la nube. Los usuarios pueden combinar crates y APIs para crear runtimes personalizados. El runtime de ejemplo run.js ya admite módulos ES, transpilación, E/S de archivos, APIs de consola y una API básica de fetch.

Consulten la página de la API en la que estén interesados y vean si Deano admite la API. Deano en Rust es, bueno, necesitamos entender un poco de historia aquí en que la primera iteración de Deano, el primer prototipo, no se escribió realmente en Rust. En cambio, se escribió en Go. Sin embargo, debido a la naturaleza de Go, que es recolectado por basura al igual que JavaScript, se decidió que deberíamos alejarnos de Go para evitar una situación en la que dos recolectores de basura compitan entre sí. Así que Deano se escribió en Rust, que es un lenguaje de bajo nivel o lenguaje de sistemas que no tiene un recolector de basura. Y puedo decir que esta es probablemente la decisión más influyente que se haya tomado para el proyecto Deano. Rust nos permite avanzar muy rápidamente y nos permite aprovechar un enorme ecosistema de crates disponibles. La mayoría de las crates son de muy alta calidad, por ejemplo, una crate http que implementa el protocolo http está muy bien probada y tiene una gran cobertura, por lo que tenemos mucha confianza en usarla y cumplir con el protocolo definido. Y por último, pero no menos importante, construir Deano es realmente muy sencillo. Dado que Deano está completamente integrado con Cargo, que es la herramienta de construcción o sistema de construcción de Rust, es solo un comando para compilar todo el binario de Deano, incluido V8, pero no realmente. No te obligamos a compilar V8 tú mismo, en su lugar lo hacemos en nuestra canalización de CI para que puedas usar archivos binarios precompilados, lo que te ahorra muchos problemas, ya que V8 es un proyecto enorme que lleva bastante tiempo compilar. Otra cosa es que Deano no es un monolito. Rust te proporciona una forma sencilla de separar las piezas de tu código en lo que se llaman crates. Las crates son equivalentes a los paquetes npm, por lo que son bibliotecas autocontenidas y reutilizables que puedes descargar y usar cuando quieras y Deano, el CLI que puedes descargar, en realidad es una colección de estas crates que están entrelazadas y están diseñadas para funcionar muy bien juntas. Por lo tanto, una de las consecuencias es que en realidad, en Deano aquí en la empresa Deano, en realidad no enviamos solo un runtime. En realidad enviamos dos runtimes diferentes. Tenemos el CLI de Deano, pero también tenemos Deano deploy, que es nuestra oferta en la nube. Estos runtimes son muy similares, sin embargo, no son idénticos. El CLI de Deano está orientado al desarrollo local y a implementar tu código en tu propio servidor o Lambdas, mientras que Deano deploy está orientado a ser implementado en contenedores nativos en la nube y similares. Por lo tanto, como usuario, puedes elegir qué crates y APIs necesitas y luego puedes combinarlos para crear tu propio runtime que se adapte a tus necesidades. Volviendo a nuestro ejemplo de runtime run.js. ¿Qué puede hacer en este momento? Bueno, son solo 140 líneas de Rust y 37 líneas de JavaScript, por lo que no es mucho código, pero ya tiene soporte para módulos ES. Puede transpilar JavaScript a TypeScript sobre la marcha justo antes de la ejecución, similar a cómo lo hace Deno. Tenemos una API para leer un archivo, una API para escribir un archivo y eliminar un archivo. Tenemos algunas APIs de consola rudimentarias, por lo que podemos hacer console.log y console.error, y tenemos una API básica de fetch, por lo que se parece a fetch, pero solo puede hacer solicitudes GET. Sin embargo, con solo 180 líneas de Rust y JavaScript, creo que esto es bastante fenomenal. Permítanme darles una demostración rápida del runtime run.js. Estoy en el repositorio que ya se les ha proporcionado y podemos ejecutar cargo run --example.ts. Por lo tanto, ejecutaremos un archivo TypeScript aquí y obtendremos hello run.js y también el contenido de fetch. Entonces, si decidimos inspeccionar nuestro archivo example.ts, podemos ver que usa console.log, luego tenemos una interfaz. Entonces

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Escalando con Remix y Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Escalando con Remix y Micro Frontends
Top Content
¿Tienes un producto grande construido por muchos equipos? ¿Estás luchando para lanzar a menudo? ¿Se convirtió tu frontend en un monolito inmantenible masivo? Si, como yo, has respondido sí a cualquiera de esas preguntas, ¡esta charla es para ti! Te mostraré exactamente cómo puedes construir una arquitectura de micro frontend con Remix para resolver esos desafíos.
Componentes de Full Stack
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Componentes de Full Stack
Top Content
Remix es un marco de trabajo web que te ofrece el modelo mental simple de una aplicación de múltiples páginas (MPA) pero el poder y las capacidades de una aplicación de una sola página (SPA). Uno de los grandes desafíos de las SPA es la gestión de la red que resulta en una gran cantidad de indirecciones y código defectuoso. Esto es especialmente notable en el estado de la aplicación que Remix elimina por completo, pero también es un problema en los componentes individuales que se comunican con un punto final de backend de un solo propósito (como una búsqueda de combobox, por ejemplo).
En esta charla, Kent demostrará cómo Remix te permite construir componentes de interfaz de usuario complejos que están conectados a un backend de la manera más simple y poderosa que hayas visto. Dejándote tiempo para relajarte con tu familia o lo que sea que hagas para divertirte.
TypeScript y React: Secretos de un matrimonio feliz
React Advanced Conference 2022React Advanced Conference 2022
21 min
TypeScript y React: Secretos de un matrimonio feliz
Top Content
TypeScript y React son inseparables. ¿Cuál es el secreto de su exitosa unión? Bastante código extrañamente extraño. Aprende por qué useRef siempre se siente extraño, cómo manejar los genéricos en los hooks personalizados y cómo los tipos de unión pueden transformar tus componentes.
Haciendo JavaScript en WebAssembly Rápido
JSNation Live 2021JSNation Live 2021
29 min
Haciendo JavaScript en WebAssembly Rápido
Top Content
JavaScript en el navegador se ejecuta muchas veces más rápido de lo que lo hacía hace dos décadas. Y eso sucedió porque los proveedores de navegadores pasaron ese tiempo trabajando en intensivas optimizaciones de rendimiento en sus motores JavaScript.Debido a este trabajo de optimización, JavaScript ahora se está ejecutando en muchos lugares además del navegador. Pero todavía hay algunos entornos donde los motores JS no pueden aplicar esas optimizaciones de la manera correcta para hacer las cosas rápidas.Estamos trabajando para resolver esto, comenzando una nueva ola de trabajo de optimización de JavaScript. Estamos mejorando el rendimiento de JavaScript para entornos completamente diferentes, donde se aplican reglas diferentes. Y esto es posible gracias a WebAssembly. En esta charla, explicaré cómo funciona todo esto y qué vendrá a continuación.
Depuración de JS
React Summit 2023React Summit 2023
24 min
Depuración de JS
Top Content
Como desarrolladores, pasamos gran parte de nuestro tiempo depurando aplicaciones, a menudo código que ni siquiera escribimos. Lamentablemente, a pocos desarrolladores se les ha enseñado cómo abordar la depuración, es algo que la mayoría de nosotros aprendemos a través de la experiencia dolorosa. La buena noticia es que _puedes_ aprender a depurar de manera efectiva, y hay varias técnicas y herramientas clave que puedes usar para depurar aplicaciones de JS y React.
Los tipos más útiles de React
React Day Berlin 2023React Day Berlin 2023
21 min
Los tipos más útiles de React
Top Content
No pensamos en React como si tuviera sus propios tipos. Pero los tipos de React son una parte fundamental del marco de trabajo - supervisados por el equipo de React, y coordinados con las principales lanzamientos de React.En esta charla de codificación en vivo, veremos todos los tipos que te has estado perdiendo. ¿Cómo obtienes el tipo de props de un componente? ¿Cómo sabes qué ref toma un componente? ¿Deberías usar React.FC? ¿Y qué pasa con JSX.Element?Te irás con un montón de ideas emocionantes para llevar a tus aplicaciones de React, y esperamos que con una nueva apreciación por las maravillas de React y TypeScript trabajando juntos.

Workshops on related topic

React, TypeScript y TDD
React Advanced Conference 2021React Advanced Conference 2021
174 min
React, TypeScript y TDD
Top Content
Featured WorkshopFree
Paul Everitt
Paul Everitt
ReactJS es extremadamente popular y, por lo tanto, ampliamente soportado. TypeScript está ganando popularidad y, por lo tanto, cada vez más soportado.

¿Los dos juntos? No tanto. Dado que ambos cambian rápidamente, es difícil encontrar materiales de aprendizaje precisos.

¿React+TypeScript, con los IDEs de JetBrains? Esa combinación de tres partes es el tema de esta serie. Mostraremos un poco sobre mucho. Es decir, los pasos clave para ser productivo, en el IDE, para proyectos de React utilizando TypeScript. En el camino, mostraremos el desarrollo guiado por pruebas y enfatizaremos consejos y trucos en el IDE.
Mejores Prácticas y Consejos Avanzados de TypeScript para Desarrolladores de React
React Advanced Conference 2022React Advanced Conference 2022
148 min
Mejores Prácticas y Consejos Avanzados de TypeScript para Desarrolladores de React
Top Content
Featured Workshop
Maurice de Beijer
Maurice de Beijer
¿Eres un desarrollador de React tratando de obtener los máximos beneficios de TypeScript? Entonces esta es la masterclass para ti.En esta masterclass interactiva, comenzaremos desde lo básico y examinaremos los pros y contras de las diferentes formas en que puedes declarar componentes de React usando TypeScript. Después de eso, pasaremos a conceptos más avanzados donde iremos más allá de la configuración estricta de TypeScript. Aprenderás cuándo usar tipos como any, unknown y never. Exploraremos el uso de predicados de tipo, guardias y comprobación exhaustiva. Aprenderás sobre los tipos mapeados incorporados, así como cómo crear tus propias utilidades de mapa de tipo nuevo. Y comenzaremos a programar en el sistema de tipos de TypeScript usando tipos condicionales e inferencia de tipos.
Uso de CodeMirror para construir un editor de JavaScript con Linting y AutoCompletado
React Day Berlin 2022React Day Berlin 2022
86 min
Uso de CodeMirror para construir un editor de JavaScript con Linting y AutoCompletado
Top Content
WorkshopFree
Hussien Khayoon
Kahvi Patel
2 authors
Usar una biblioteca puede parecer fácil a primera vista, pero ¿cómo eliges la biblioteca correcta? ¿Cómo actualizas una existente? ¿Y cómo te abres camino a través de la documentación para encontrar lo que quieres?
En esta masterclass, discutiremos todos estos puntos finos mientras pasamos por un ejemplo general de construcción de un editor de código usando CodeMirror en React. Todo mientras compartimos algunas de las sutilezas que nuestro equipo aprendió sobre el uso de esta biblioteca y algunos problemas que encontramos.
Consejos y Trucos Profundos de TypeScript
Node Congress 2024Node Congress 2024
83 min
Consejos y Trucos Profundos de TypeScript
Top Content
Workshop
Josh Goldberg
Josh Goldberg
TypeScript tiene un sistema de tipos poderoso con todo tipo de características sofisticadas para representar estados de JavaScript salvajes y extravagantes. Pero la sintaxis para hacerlo no siempre es sencilla, y los mensajes de error no siempre son precisos al decirte qué está mal. Vamos a profundizar en cómo funcionan muchas de las características más poderosas de TypeScript, qué tipos de problemas del mundo real resuelven, y cómo dominar el sistema de tipos para que puedas escribir código TypeScript verdaderamente excelente.
Pruebas de Aplicaciones Web utilizando Cypress
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Pruebas de Aplicaciones Web utilizando Cypress
WorkshopFree
Gleb Bahmutov
Gleb Bahmutov
Este masterclass te enseñará los conceptos básicos de cómo escribir pruebas de extremo a extremo utilizando Cypress Test Runner.
Cubriremos la escritura de pruebas, abarcando todas las características de la aplicación, estructurando las pruebas, interceptando solicitudes de red y configurando los datos del backend.
Cualquier persona que conozca el lenguaje de programación JavaScript y tenga NPM instalado podrá seguir el masterclass.
Construye un potente DataGrid en pocas horas con Ag Grid
React Summit US 2023React Summit US 2023
96 min
Construye un potente DataGrid en pocas horas con Ag Grid
WorkshopFree
Mike Ryan
Mike Ryan
¿Tu aplicación React necesita mostrar eficientemente muchos (y muchos) datos en una cuadrícula? ¿Tus usuarios quieren poder buscar, ordenar, filtrar y editar datos? AG Grid es la mejor cuadrícula de JavaScript en el mundo y está llena de características, es altamente eficiente y extensible. En esta masterclass, aprenderás cómo empezar con AG Grid, cómo podemos habilitar la ordenación y el filtrado de datos en la cuadrícula, la representación de celdas y más. Saldrás de esta masterclass gratuita de 3 horas equipado con el conocimiento para implementar AG Grid en tu aplicación React.
Todos sabemos que crear nuestra propia solución de cuadrícula no es fácil, y seamos honestos, no es algo en lo que deberíamos estar trabajando. Estamos enfocados en construir un producto e impulsar la innovación. En esta masterclass, verás lo fácil que es empezar con AG Grid.
Prerrequisitos: React y JavaScript básicos
Nivel de la masterclass: Principiante