JavaScript on Commentary of Takao

Reemplazando localStorage: localForage como wrapper de IndexedDB

Fri, 20 Feb 2026 00:00:00 +0900

Introducción

El almacenamiento del lado del cliente es fundamental. localStorage tiene límites dolorosos: ~5 MB, API síncrona, solo strings.

IndexedDB: Potente pero complejo

Ofrece almacenamiento virtualmente ilimitado, API asíncrona, datos estructurados y consultas indexadas. Pero es notoriamente verboso.

localForage: Lo mejor de ambos mundos

Wrapper ligero que envuelve IndexedDB (con WebSQL y localStorage como respaldo) tras una API simple basada en promesas, inspirada en localStorage.

await localforage.setItem('user', { name: 'Alice', role: 'admin' });
const user = await localforage.getItem('user');

Detección del mejor driver disponible: 1. IndexedDB, 2. WebSQL, 3. localStorage. Para la mayoría de necesidades de almacenamiento, localForage es la elección pragmática.

Potenciando tus expresiones regulares con el flag v

Wed, 15 Oct 2025 00:00:00 +0900

Introducción

ES2024 introduce el flag v, un superconjunto del flag u que permite notación de conjuntos, resta de clases, intersección y coincidencia de emojis Unicode.

Resta de clases (`--`)

const re = /[\p{Letter}--[aeiouAEIOU]]/v; // letras excepto vocales

Intersección (`&&`)

const re = /[\p{Letter}&&\p{Script=Greek}]/v; // solo letras griegas

Clases anidadas

El flag v permite anidar clases con corchetes, eliminando secuencias de escape confusas.

Coincidencia de emojis

Nuevas propiedades: \p{RGI_Emoji}, \p{Basic_Emoji}, \p{Emoji_Keycap_Sequence}, etc.

Migración desde flag u

El flag v es estrictamente un superconjunto pero tiene cambios disruptivos: \d dentro de clase no está permitido, -- y && son operadores.

Novedades emocionantes en ECMAScript 2025 (ES16)

Thu, 15 May 2025 00:00:00 +0900

Introducción

Cada año, el comité TC39 actualiza las especificaciones ECMAScript. Para ECMAScript 2025 (ES16), varias propuestas han alcanzado Stage 3 o 4.

Promise.try

Unifica el manejo de errores síncronos y asíncronos. Si el callback lanza una excepción síncrona, Promise.try() la captura y retorna una Promise rechazada, permitiendo un solo .catch().

Iterator Helpers

Añade .map() y .filter() a todos los objetos iterables (Set, Map, etc.). Evaluación perezosa: los elementos se procesan solo cuando se solicitan.

Patrones a evitar con async/await en JavaScript

Sat, 15 Feb 2025 00:00:00 +0900

Introducción

async/await hizo la programación asíncrona más intuitiva, pero puede ocultar problemas de rendimiento y errores.

Antipatrón 1: Serialización innecesaria

No uses await secuencial para tareas independientes. Usa Promise.all para ejecución en paralelo.

Antipatrón 2: Bloques try-catch anidados

El anidamiento profundo derrota el propósito de async/await. Usa un solo bloque try-catch al más alto nivel.

Antipatrón 3: async callbacks en forEach

forEach con async callback ejecuta los callbacks síncronamente. Usa for...of para secuencial o Promise.all con map para paralelo.

Métodos de arrays JavaScript: De básicos a patrones avanzados

Thu, 12 Dec 2024 00:00:00 +0900

Los arrays de JavaScript son el pilar de la manipulación de datos en el desarrollo web moderno. Con ES2023 introduciendo alternativas inmutables a métodos mutantes, es momento de revisar cómo trabajamos con arrays.

Panorama de métodos de array

Los métodos se dividen en mutantes y no mutantes. ES2023 introdujo cuatro métodos inmutables: toSorted(), toReversed(), toSpliced(), with(). Estos crean nuevos arrays sin modificar el original, ideal para React o Redux.

Map, Filter y Reduce en profundidad

map transforma cada elemento, filter selecciona elementos, reduce es el más versátil. Una anti-patrón común es encadenar map seguido de filter cuando un solo flatMap sería suficiente.

Typed Arrays en JavaScript: Procesamiento de datos binarios en el navegador

Tue, 10 Sep 2024 00:00:00 +0900

El tipo Number nativo de JavaScript es ineficiente para datos binarios. Los Typed Arrays (ES2015) traen gestión de memoria tipo C al navegador.

ArrayBuffer

Buffer binario raw de longitud fija. No se puede leer/escribir directamente — debe usarse una vista.

Vistas TypedArray

Int8Array, Uint8Array, Float32Array, etc. Cada vista interpreta los bytes como un tipo numérico específico. subarray() crea una subvista sin copia.

DataView para estructuras complejas

Permite lectura/escritura en offsets arbitrarios con tipo y endianness explícitos. Ideal para formatos binarios como BMP, PNG, WAV.

API Proxy y Reflect de JavaScript: Patrones de metaprogramación

Tue, 04 Jun 2024 00:00:00 +0900

Proxy y Reflect permiten interceptar y personalizar operaciones fundamentales en objetos: acceso a propiedades, asignación, enumeración, invocación de funciones y llamadas a constructores.

Los 13 traps de Proxy

Desde get/set (lectura/escritura) hasta apply/construct (llamadas de función/constructor). Cada trap debe cumplir invariantes.

API Reflect

Los métodos de Reflect reflejan cada trap de Proxy. Usar Reflect dentro de traps asegura propagación correcta del argumento receiver.

Validación e integridad

El trap set puede imponer restricciones de esquema. Proxy de solo lectura bloquea todos los traps de mutación.

Novedades de ES2024 en JavaScript

Tue, 12 Mar 2024 00:00:00 +0900

ES2024 (ES15) introduce nuevas funcionalidades al lenguaje, centradas en async, arrays y gestión de datos.

Promise.withResolvers()

Crea una promesa con sus funciones resolve y reject expuestas externamente. Útil para promisificar APIs callback sin anidar constructores.

Array Grouping

Object.groupBy() y Map.groupBy() agrupan elementos de un array según una función callback. Reemplaza implementaciones manuales con reduce.

Well-formed Unicode Strings

String.prototype.isWellFormed() y toWellFormed() para manejar cadenas Unicode mal formadas. Previene errores en APIs que requieren Unicode válido.

Profundizando en el Event Loop de JavaScript: Microtasks, Macrotasks y más

Mon, 19 Feb 2024 00:00:00 +0900

El event loop de JavaScript es uno de los conceptos más importantes y menos entendidos. A pesar de ser single-threaded, su event loop permite concurrencia no bloqueante mediante un sistema de colas.

Call Stack

Estructura LIFO. Principio de run-to-completion: cada función se ejecuta hasta completarse antes de que otro código la interrumpa.

Cola de Macrotasks

Origen: setTimeout, setInterval, I/O, eventos UI. El event loop toma UNA macrotask por iteración, la ejecuta, luego procesa la cola de microtasks.

Patrones avanzados de Promises en JavaScript: Dominio del flujo asíncrono

Tue, 05 Dec 2023 00:00:00 +0900

Las Promises son fundamentales en JavaScript moderno. Más allá de cadenas básicas .then(), existen patrones avanzados para control de concurrencia, manejo de errores y cancelación.

Combinadores de Promises

Promise.all resuelve cuando todas resuelven. Promise.allSettled cuando todas se settling (nunca rechaza). Promise.race con la primera que se settling. Promise.any con la primera que resuelve.

Control de concurrencia

Un limitador de concurrencia encola tareas y asegura que solo un número específico se ejecute simultáneamente. El patrón pMap con Promise.race soporta contrapresión.

JavaScript on Commentary of Takao

Reemplazando localStorage: localForage como wrapper de IndexedDB

Introducción

IndexedDB: Potente pero complejo

localForage: Lo mejor de ambos mundos

Potenciando tus expresiones regulares con el flag v

Introducción

Resta de clases (--)

Intersección (&&)

Clases anidadas

Coincidencia de emojis

Migración desde flag u

Novedades emocionantes en ECMAScript 2025 (ES16)

Introducción

Promise.try

Iterator Helpers

Patrones a evitar con async/await en JavaScript

Introducción

Antipatrón 1: Serialización innecesaria

Antipatrón 2: Bloques try-catch anidados

Antipatrón 3: async callbacks en forEach

Métodos de arrays JavaScript: De básicos a patrones avanzados

Panorama de métodos de array

Map, Filter y Reduce en profundidad

Typed Arrays en JavaScript: Procesamiento de datos binarios en el navegador

ArrayBuffer

Vistas TypedArray

DataView para estructuras complejas

API Proxy y Reflect de JavaScript: Patrones de metaprogramación

Los 13 traps de Proxy

API Reflect

Validación e integridad

Novedades de ES2024 en JavaScript

Promise.withResolvers()

Array Grouping

Well-formed Unicode Strings

Profundizando en el Event Loop de JavaScript: Microtasks, Macrotasks y más

Call Stack

Cola de Macrotasks

Patrones avanzados de Promises en JavaScript: Dominio del flujo asíncrono

Combinadores de Promises

Control de concurrencia

Resta de clases (`--`)

Intersección (`&&`)