Pular para o conteúdo principal
Nitro Modules · Lexbor · QuickJS

Um sandbox de DOM headless
para React Native

Um ambiente headless de HTML/DOM para React Native, desenvolvido com Nitro Modules, Lexbor e QuickJS.

sandbox.ts
import { JSDOM } from 'react-native-nitro-jsdom'

const dom = JSDOM.create(`
<html>
<body>
<div id="result">0</div>
</body>
</html>
`)

await dom.evaluate(`
document.getElementById('result').textContent = String(2 + 2)
`)

const value = await dom.evaluate(
`document.getElementById('result').textContent`
)
// → "4"

dom.dispose()
Por que esta biblioteca

Tudo que uma WebView oferece, sem a bagagem

Headless e fora da árvore

Sem componente React, sem tela, sem árvore de UI. Faça parsing, mutação e evaluate de HTML inteiramente fora da tela.

Runtime verdadeiramente isolado

Cada JSDOM.create() inicia seu próprio runtime QuickJS, não uma instância compartilhada do Hermes. Sem vazamento de globals entre sandboxes.

Parsing de HTML nativo

Baseado no Lexbor, o parser de HTML compatível com WHATWG mais rápido em C99, sem dependências.

DOM no formato do jsdom

querySelector, textContent, dataset e muito mais espelham o formato do DOM do jsdom, embora o uso seja diferente: tudo passa pelo evaluate() assíncrono, não pelo acesso síncrono a objetos do jsdom.

Bridge JSI síncrona

Powered by Nitro Modules, com chamadas JSI diretas, sem bridge, sem overhead de serialização JSON.

Controle total de memória

Chame dispose() para liberar deterministicamente o documento Lexbor e o runtime QuickJS, sem esperar o GC.

Por baixo dos panos

Uma chamada síncrona, dois motores nativos

evaluate() é a única porta de entrada para o sandbox: tudo o resto acontece nativamente, fora da bridge do JS.

TypeScript (consumidor)
chamada JSI síncrona, sem bridge, sem JSON
Nitro Module (camada de binding em C++)
Lexbor (C99)
  • Parsing de HTML compatível com WHATWG
  • Árvore DOM em memória
  • querySelector / querySelectorAll
  • serialize() → string HTML
QuickJS (C)
  • Runtime JS isolado por instância
  • Bindings de DOM → delega para o Lexbor
  • setTimeout / setInterval, event loop próprio
  • Executa scripts arbitrários do usuário
A alternativa

Por que não usar simplesmente uma WebView oculta?

RecursoWebView (oculta)react-native-nitro-jsdom
Requer um componente React
Roda headless / fora da árvore
Instâncias isoladasComplexoNativo
Execução de JS arbitrário
API completa de DOMProgressiva
Controle de memóriaLimitadoTotal (dispose())
Overhead de performanceAltoBaixo

Pronto para colocar seu primeiro DOM em um sandbox?

Instale a biblioteca e rode seu primeiro evaluate() em minutos.