diff --git a/runtime/fundamentals/configuration.md b/runtime/fundamentals/configuration.md index 679a48c22..0de06123c 100644 --- a/runtime/fundamentals/configuration.md +++ b/runtime/fundamentals/configuration.md @@ -738,6 +738,27 @@ this requires an explicit opt-in with `-P` and is not loaded by default. If you're ok with this risk, then this feature will be useful for you. +## Compile config + +The `"compile"` block configures +[`deno compile`](/runtime/reference/cli/compile/) without requiring you to +repeat flags on every invocation. You can declare which extra files or +directories to bundle into the executable, and which paths to exclude: + +```jsonc title="deno.json" +{ + "compile": { + "include": ["names.csv", "data", "worker.ts"], + "exclude": ["data/secrets", "**/*.test.ts"] + } +} +``` + +`--include` and `--exclude` flags on the command line are merged with these +lists rather than replacing them. The `"compile"` block can also carry +`permissions` (see +[Test, bench, and compile permissions](#test-bench-and-compile-permissions)). + ## An example `deno.json` file ```json diff --git a/runtime/reference/cli/compile.md b/runtime/reference/cli/compile.md index 4a164615d..547dff184 100644 --- a/runtime/reference/cli/compile.md +++ b/runtime/reference/cli/compile.md @@ -30,6 +30,40 @@ deno compile --allow-read --allow-net jsr:@std/http/file-server -p 8080 ./file_server --help ``` +## Framework detection + +Starting in Deno 2.8, `deno compile .` (or `deno compile `) detects +common web frameworks and produces an entrypoint that knows how to start them. +The detected build script is run first, so the compiled binary always contains a +fresh build. + +Supported frameworks: + +- Next.js +- Astro +- Fresh (1.x and 2.x) +- Remix +- SvelteKit +- Nuxt +- SolidStart +- TanStack Start +- Vite (SSR mode) + +```sh +# In a Next.js / Astro / Fresh / etc. project +deno compile . + +# Or pointing at a specific app directory +deno compile ./apps/web +``` + +Generated entrypoints use `import.meta.dirname` so framework asset paths resolve +correctly against the [virtual filesystem](#including-data-files-or-directories) +inside the compiled binary. + +If the project doesn't match any supported framework, `deno compile` will error +out. + ## Cross Compilation You can cross-compile binaries for other platforms by using the `--target` flag. @@ -114,6 +148,23 @@ const dataFiles = Deno.readDirSync(import.meta.dirname + "/data"); Note this currently only works for files on the file system and not remote files. +### Configuring `include` / `exclude` in `deno.json` + +The `--include` and `--exclude` paths can be set declaratively in `deno.json` so +you don't have to repeat them on every `deno compile` invocation: + +```jsonc title="deno.json" +{ + "compile": { + "include": ["names.csv", "data", "worker.ts"], + "exclude": ["data/secrets", "**/*.test.ts"] + } +} +``` + +CLI flags are merged with the config: `--include` and `--exclude` add to the +lists in `deno.json` rather than replacing them. + ## Workers Similarly to non-statically analyzable dynamic imports, code for diff --git a/runtime/reference/web_platform_apis.md b/runtime/reference/web_platform_apis.md index 5f5c7e15d..f9788380c 100644 --- a/runtime/reference/web_platform_apis.md +++ b/runtime/reference/web_platform_apis.md @@ -489,6 +489,83 @@ const worker = new Worker(import.meta.resolve("./worker.js"), { }); ``` +## OffscreenCanvas + +Starting in Deno 2.8, the +[`OffscreenCanvas`](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas) +API is available. `OffscreenCanvas` is a canvas that lives outside any DOM and +can be used anywhere (including Web Workers) for off-thread rendering and image +generation. + +### Supported rendering contexts + +`OffscreenCanvas#getContext` accepts two of the spec-defined context ids: + +- `"bitmaprenderer"`: returns an + [`ImageBitmapRenderingContext`](https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmapRenderingContext) + for displaying an `ImageBitmap` produced via `createImageBitmap`. +- `"webgpu"`: returns a + [`GPUCanvasContext`](https://developer.mozilla.org/en-US/docs/Web/API/GPUCanvasContext) + for rendering with WebGPU. + +Calling `getContext` with `"2d"`, `"webgl"`, or `"webgl2"` returns `null`; these +contexts are not implemented in Deno. + +### Example: encoding an image to PNG + +Decode an image into an `ImageBitmap`, place it on an `OffscreenCanvas` via the +`bitmaprenderer` context, and write the result to disk: + +```ts +const data = await Deno.readFile("./input.jpg"); +const bitmap = await createImageBitmap(new Blob([data])); + +const canvas = new OffscreenCanvas(bitmap.width, bitmap.height); +const ctx = canvas.getContext("bitmaprenderer")!; +ctx.transferFromImageBitmap(bitmap); + +const blob = await canvas.convertToBlob({ type: "image/png" }); +await Deno.writeFile( + "./output.png", + new Uint8Array(await blob.arrayBuffer()), +); +``` + +Typical uses: + +- producing thumbnails, format conversions, or social-card images at request + time without spinning up a headless browser, +- running off-thread image work inside a Web Worker, +- driving WebGPU rendering targets that don't need a window. + +## Geometry Interfaces + +Starting in Deno 2.8, the +[Geometry Interfaces Module Level 1](https://drafts.fxtf.org/geometry/) types +are available as globals. These are the same types you'd find in a browser: + +- [`DOMMatrix`](https://developer.mozilla.org/en-US/docs/Web/API/DOMMatrix) / + [`DOMMatrixReadOnly`](https://developer.mozilla.org/en-US/docs/Web/API/DOMMatrixReadOnly): + 4×4 transform matrices for 2D and 3D operations. +- [`DOMPoint`](https://developer.mozilla.org/en-US/docs/Web/API/DOMPoint) / + [`DOMPointReadOnly`](https://developer.mozilla.org/en-US/docs/Web/API/DOMPointReadOnly): + points in 2D / 3D space. +- [`DOMRect`](https://developer.mozilla.org/en-US/docs/Web/API/DOMRect) / + [`DOMRectReadOnly`](https://developer.mozilla.org/en-US/docs/Web/API/DOMRectReadOnly): + axis-aligned rectangles. +- [`DOMQuad`](https://developer.mozilla.org/en-US/docs/Web/API/DOMQuad): a + quadrilateral defined by four points. + +```ts +const m = new DOMMatrix().translateSelf(10, 20).scaleSelf(2); +const p = new DOMPoint(1, 1).matrixTransform(m); +console.log(p.x, p.y); // 12 22 +``` + +These types are useful for graphics work; applying transforms to canvas +drawings, computing layout math, or porting browser code that depends on +geometry types. + ## Deviations of other APIs from spec ### Cache API