feat(run/serve): zero-config JSX with an in-binary Preact runtime#35194
Open
bartlomieju wants to merge 2 commits into
Open
feat(run/serve): zero-config JSX with an in-binary Preact runtime#35194bartlomieju wants to merge 2 commits into
bartlomieju wants to merge 2 commits into
Conversation
When a project sets jsxImportSource to react (or preact) but the library is not declared, deno run now installs it automatically (react plus react-dom, or preact) using the existing deno add machinery, before building the module graph. This makes JSX work without a manual deno install. Skips when the package is already declared in a deno.json, and only handles known JSX libraries.
Default the JSX import source to a reserved deno-jsx:preact sentinel that the graph loader serves from an embedded Preact bridge, so `deno run foo.tsx` and `deno serve foo.tsx` work with no deno.json and no manual install, and `new Response(<App />)` renders to HTML.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
JSX does not work out of the box in Deno today. Running a bare
.tsxfilewith no configuration falls back to the classic transform and fails with
React is not defined, and even a project that configures the recommendedautomatic runtime in deno.json still has to manually
deno installthe JSXlibrary before anything renders. On top of that, the ergonomic
new Response(<App />)form returns[object Object]because a raw vnode hasno HTML representation. This PR makes JSX work with zero configuration and zero
manual install by baking a small Preact-based JSX runtime into the binary.
Zero-config default via an in-binary bridge
The default JSX import source now resolves to a reserved
deno-jsx:preactsentinel rather than
react. The base emit/check compiler options default tothe automatic runtime (
"jsx": "react-jsx","jsxImportSource": "deno-jsx:preact"), andjsx_import_source_configtreats the no-config case(no
jsxset anywhere) as the automatic runtime pointing at that sentinel. Anexplicit
jsxImportSource(e.g.react) always takes precedence, and anexplicit classic
"jsx": "react"still emitsReact.createElementunchanged.The
deno-jsx:scheme is reserved (notnpm:) so it never triggers an npmregistry version lookup for a package that does not exist. The graph resolver
passes
deno-jsx:specifiers through verbatim, and aJsxBridgeLoaderwrappedaround the module-graph loader intercepts that scheme and returns an embedded
module instead of going to the network. The embedded bridge (
cli/jsx_bridge.jsand its dev variant) wraps Preact's
jsx-runtimeand attaches a non-enumerabletoStringthat renders the vnode withpreact-render-to-string. That is whatmakes
new Response(<App />)return real HTML rather than[object Object].The bridge's own imports are ordinary
npm:preact/npm:preact-render-to-stringspecifiers, so they resolve and download throughthe normal npm path on first run; no
deno.jsonis created and nonode_modulesis required.End-to-end, with no deno.json, no node_modules, and nothing installed:
deno serveworks the same way for a module that exportsdefault { fetch }. Both paths were verified against the built binary.Why Preact
Preact is Fresh-aligned, complete, and React-compatible through
preact/compat. It is exposed only through the in-binary bridge, not as aseparate npm/jsr package. Crucially,
preact-render-to-stringdoes not readprocess.env.NODE_ENV, so unlike React it does not require--allow-envtorender. React hits a separate
NODE_ENV/--allow-envpapercut (see below),and using Preact for the zero-config default sidesteps it entirely.
Explicit-config auto-install (the original v1 behavior)
When a project explicitly configures
jsxImportSource: "react"(orpreact)but has not declared the library,
maybe_jsx_auto_installstill installs itvia the existing
deno addmachinery before the graph is built (React alsopulls in
react-dom). This now runs for bothdeno runanddeno serve. Itis a no-op when the package is already declared and when the import source is
the zero-config sentinel (which needs no install).
Limitations
toStringrendering is synchronous (preact-render-to-string'srender).Async Suspense would require an explicit
await renderAsync(...)..tsxunder the automatic runtime has no.d.tsfor thein-binary bridge, so the JSX runtime is treated as untyped;
deno runisunaffected since it does not type check by default.