Wasm

Gracias a WebAssembly podemos ejecutar código de otros lenguajes de programación desde el navegador web con JavaScript. La ventaja de WASM es que, aparte de ser rápido, permite programar en otro lenguaje y aprovechar las librerías presentes en el mismo. Personalmente he usado Golang con WebAssembly para crear un generador de credenciales, códigos QR y códigos de barras. Todo el procesamiento y generación de imágenes se hace con Go, para luego exportar los resultados a JavaScript. En este post voy a documentar **cómo exportar un arreglo de tipo byte ([]**byte) de Go a un Uint8Array de JavaScript, ya que, como te lo dije anteriormente, esto sirve cuando creamos un archivo binario con Go y queremos exportarlo a JavaScript. Además, un Uint8Array sí puede ser transportado a través de un WebWorker usando el structured clone algorithm. ...

En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly (con Golang) en Vue 3 con Vite y Pinia. Voy a explicar cómo comunicar las funciones de WASM con JavaScript y viceversa, dejando mucho código del lado de Golang con WASM. Toma en cuenta que es una documentación muy específica a mi modo de trabajo. No esperes un tutorial paso a paso. ...

Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al final todos los archivos estáticos que hay que servir deben estar en la carpeta dist, pero si quieres servirla en Apache déjame darte algunos consejos. ...

Anteriormente te he hablado de SQLite en el navegador web, ya sea con Svelte o JavaScript puro. Hoy voy a mostrarte otra cosa: cómo invocar a SQLite3 desde WASM o WebAssembly. Al final vamos a estar invocando la API de SQLite3 de JS desde WebAssembly. Te enseñaré cómo es mi entorno de trabajo y cómo usar SQLite3 con WebAssembly. ...

En este post te mostraré cómo usar SQLite3 directamente en el navegador web usando la librería original escrita en C a través de WebAssembly y el OPFS para alojar la base de datos. De este modo tendremos SQLite3 original en la web para trabajar en el navegador con JS del lado del cliente. Podremos hacer esto con JavaScript puro o con cualquier framework; pero te mostraré un ejemplo básico y bien explicado de SQLite3 con JavaScript. Luego te enseñaré un ejemplo con Tailwind, Svelte y Progressive Web apps. ...

Estoy muy emocionado porque después de tanto tiempo y gracias al Origin Private File System podremos tener SQLite3 en los navegadores, con todas sus ventajas y todo contenido desde una página web. Si quieres puedes ver el hola mundo sin Svelte, es decir, con JS puro y aprender cómo usar SQLite3 en el navegador web sin servidores. Ya había leído eso hace tiempo pero tenías que hacer unas cosas “experimentales”. El punto es que ando aprendiendo un poco de Svelte con Tailwind haciendo una app de notas (a las que les agregaré encriptación) y me dio curiosidad por ver si SQLite3 ya estaba “portado” totalmente, porque si bien ya existía con WebAssembly no había manera de crear archivos binarios en el navegador web. Entonces encontré a: https://developer.chrome.com/blog/sqlite-wasm-in-the-browser-backed-by-the-origin-private-file-system/ Y vi que ya era posible. Lo siguiente era hacerlo funcionar con SvelteKit que usa a su vez Vite para todo su entorno. Te contaré cómo lo hice y de dónde me he guiado. ...

Acabo de publicar un post sobre las ventajas y usos de WebAssembly en donde prometí que traería un ejemplo con Go. De hecho ya tenía el ejemplo desde antes, pero no iba a poner toda la definición de WebAssembly aquí. En fin, veamos cómo utilizar Go para compilar a WebAssembly y llamar al código desde JavaScript. Pero no te confundas, WebAssembly no es JavaScript, es código que se ejecuta directamente en el navegador, solo que JavaScript le dice al navegador cómo usarlo. ...

Al probar WebAssembly en un servidor apache instalado con XAMPP e intentar cargar un archivo con extensión wasm aparecía el siguiente error: Uncaught (in promise) TypeError: Failed to execute ‘compile’ on ‘WebAssembly’: Incorrect response MIME type. Expected ‘application/wasm’ Esto es porque Apache no sabe de qué tipo son los archivos wasm, y no los sirve con el MIME correcto. Vamos a ver dos soluciones a esto. ...

WebAssembly es una tecnología relativamente nueva (se ha hablado de WebAssembly desde el 2015) que traerá muchas cosas nuevas a la web y a la forma en la que se programan las cosas. En este post voy a dar una definición y análisis de WebAssembly desde mi punto de vista, analizando sus usos y explicación, además de algunas ventajas. ...