MicroLighter: un resaltador de sintaxis de 2 KB que usa la API de CSS Custom Highlights
Introducing MicroLighter
Dave Rupert presenta MicroLighter, un resaltador de sintaxis de cliente ligero y sin dependencias que aprovecha la API de CSS Custom Highlights para evitar la mutación del DOM. Con solo 2 KB (minificado y comprimido), soporta gramáticas de Textmate y carga idiomas bajo demanda. Los temas usan light-dark() para combinar estilos claro y oscuro, y las funciones adicionales se delegan en un elemento personalizado <micro-lighter>. Rupert explica cómo su blog rompió el resaltado y por qué eligió este enfoque, destacando las limitaciones de ::highlight() (sin itálicas ni negritas) y la ventaja de no inyectar spans.
Usar la API de Highlight significa que evito cualquier mutación del DOM y el alcance de la biblioteca se reduce a: escanear bloques de código con patrones regex y enviar CSS.highlights.set(categoría, textRanges) para resaltar los bloques de código.