The Unreasonable Effectiveness of Quarto

John Paul Helveston

posit::conf(2026)
Houston, TX

Handwriting practice sheets

This is a dashboard session, but we are starting with a handwriting worksheet. The worksheet is deliberately simple because it makes the underlying problem obvious.

Prompt:

“Make a one-page handwriting practice sheet
with sentences about pokemon”

I want these sentences with this layout

Content entangled with Format

Quarto disentangles

Content and Format

Quarto disentangles Content and Format

Modularized content via parameters

handwriting-practice.qmd

(written by Claude Code)

---
params:
  data_file: "data/minecraft.csv"
format: pdf
---

```{r}
sentences <- read.csv(params$data_file)$sentence
for (s in sentences) {
  cat(sprintf("\\practiceblock{%s}\n\n", s))
}
```

minecraft.csv

(written by Me)

sentence
Minecraft is a popular building game.
Players mine for resources underground.
You can build almost anything you want.
Creepers are sneaky and dangerous enemies.
Diamonds are the best ore to find.
Players must survive through the first night.
The Nether is a hot and scary place.

_quarto.yml

project:
  type: website

website:
  sidebar:
    contents:
      - about.qmd
      - vmt-daily.qmd
      - vmt-age.qmd
      - depreciation.qmd
      - ...

_quarto.yml

project:
  type: website

website:
  sidebar:
    contents:
      - about.qmd
      - vmt-daily.qmd
      - vmt-age.qmd
      - depreciation.qmd
      - ...

Charts built with {vehicletrends}

A cohesive framework:

→ URLs to each page
→ URLs to each header
→ Navigation
→ Consistent layout
→ Easy deployment

_quarto.yml

project:
  type: website

website:
  sidebar:
    contents:
      - about.qmd
      - vmt-daily.qmd
      - vmt-age.qmd
      - depreciation.qmd
      - ...

Charts built with {vehicletrends}

Modularity

Efficiency

Correctness

Each page is its own canvas

Code chunks are all you need

Things to put in the canvas

JavaScript graphics via or packages

R via {echarts4r}

vehicles |>
  group_by(vehicle_type) |>
  e_charts(year) |>
  e_scatter(avg_price)

Python via {plotly}

px.scatter(
  vehicles,
  x = "year",
  y = "avg_price",
  color = "vehicle_type"
)

“The page doesn’t care which visualization library I’m using.”

Things to put in the canvas

Widgets that talk to each other:
crosstalk + plotly, or ojs

Model year

Vehicle type

The important point is composition: widgets can remain independent components and still communicate. Quarto provides the page that contains them.

Things to put in the canvas

Put ‍ ‍ in a box!

Shinylive – no server

```{shinylive-r}
#| standalone: true
#| viewerHeight: 800

# <Shiny app code>
```

A real Shiny server

```{r}
htmltools::tags$iframe(
  src    = "https://app.share.connect.posit.cloud/",
  height = "700px",
  width  = "100%",
  style  = "border: none;"
)
```

Shiny shows how far the canvas can stretch.

“At the extreme, the thing inside the canvas can itself be a complete application, whether it runs through shinylive or a Shiny server”

Things to put in the canvas

Put any widget in a box!

• 276 lines of hand-written MapLibre
• 1.64 GB of tiles built with {pmtiles} (thanks Kyle Walker!)
• Lives in it’s own repo
• Hosted on GitHub pages

vehicletrends

penguins dashboard

Modularity

Efficiency

Correctness

EV Sales

Sales of electric vehicles grew 20% in 2025, reaching over 20 million sales globally.

Now pivot from “what can the canvas contain?” to “why does this architecture matter for an AI agent?” Introduce the source-versus-rendered-artifact comparison.

EV Sales

Sales of electric vehicles grew 20% in 2025, reaching over 20 million sales globally.

---

Quarto (.qmd)

---
format: pdf
---

## EV Sales

Sales of **electric vehicles** grew
20% in 2025, reaching over
_20 million_ sales globally.

125 characters

PDF (via LaTeX)

\documentclass{article}
\usepackage[T1]{fontenc}
\usepackage{geometry}
\geometry{margin=1in}

\begin{document}

\section*{EV Sales}

Sales of \textbf{electric vehicles} grew
20\% in 2025, reaching over
\emph{20 million} sales globally.

\end{document}

252 characters

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>EV Sales</title>
<style>
body { font-family: Georgia, serif;
       max-width: 40em; margin: 3em auto; }
h2 { font-size: 1.6em; }
</style>
</head>
<body>
<h2>EV Sales</h2>
<p>Sales of <strong>electric vehicles</strong> grew
20% in 2025, reaching over <em>20 million</em>
sales globally.</p>
</body>
</html>

377 characters

EV Sales

Sales of electric vehicles grew 20% in 2025, reaching over 20 million sales globally.

---

Word (word/document.xml)

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<w:document xmlns:w="http://schemas.openxmlformats.org/
                     wordprocessingml/2006/main">
  <w:body>
    <w:p>
      <w:pPr><w:pStyle w:val="Heading2"/></w:pPr>
      <w:r><w:t>EV Sales</w:t></w:r>
    </w:p>
    <w:p>
      <w:r><w:t xml:space="preserve">Sales of </w:t></w:r>
      <w:r><w:rPr><w:b/></w:rPr><w:t>electric vehicles</w:t></w:r>
      <w:r><w:t xml:space="preserve"> grew 20% in 2025, reaching over </w:t></w:r>
      <w:r><w:rPr><w:i/></w:rPr><w:t>20 million</w:t></w:r>
      <w:r><w:t xml:space="preserve"> sales globally.</w:t></w:r>
    </w:p>
  </w:body>
</w:document>

663 characters 😱

Use the experiment as evidence for the broader claim: the same underlying content can explode into much larger rendered representations. Source is the compact interface.

This is the empirical punchline of the token section. Smaller source representations mean less context to move around and reason about.

Small pieces have small context windows

vehicletrends.us/            lines
├── index.qmd                    7
├── about.qmd                  101
├── vmt-daily.qmd              216
├── vmt-age.qmd                351
├── depreciation.qmd           324
├── percent-listings.qmd       620
├── percent-dealers.qmd        199
├── market-concentration.qmd   292
├── hhi-explained.qmd          331
├── registrations.qmd          349
├── nearest-vehicles.qmd        34
├── tech-stack.qmd              60
├── cite.qmd                    50
├── LICENSE.qmd                 26
└── 404.qmd                     21

depreciation.qmd

  ## Depreciation by body style
 
  Used trucks hold their value better
- than any other body style.
+ than any other body style, and the
+ gap has widened every year since 2022.

Small pieces have less to agree upon

The input that defines it

The output that consumes it

The reactive that connects them

The code chunk

Modularity

Efficiency

Correctness

Source: BBC

There is no version that throws an error

Source: BBC

Same map from source

library(tidyverse)
library(rnaturalearth)
library(sf)

funding <- read_csv("data/africa-funding.csv")

africa <- ne_countries(continent = "Africa", returnclass = "sf")
stopifnot(all(funding$name %in% africa$name))

funded <- africa |>
  inner_join(funding, by = "name") |>
  mutate(
    lon = st_coordinates(st_point_on_surface(geometry))[, "X"],
    lat = st_coordinates(st_point_on_surface(geometry))[, "Y"]
  )

ggplot(africa) +
  geom_sf(fill = "grey90", color = "white", linewidth = 0.2) +
  geom_sf(data = funded, fill = "#00798c", color = "white") +
  geom_segment(
    data = funded, color = "#2e4057",
    aes(lon, lat, xend = lon + dx, yend = lat + dy)
  ) +
  geom_text(
    data = funded, color = "#2e4057", size = 5, lineheight = 0.9,
    family = "Fira Sans Condensed",
    aes(
      lon + dx, lat + dy, hjust = ifelse(dx > 0, -0.05, 1.05),
      label = paste0(name, "\n$", amount, "M")
    )
  ) +
  coord_sf(xlim = c(-38, 66), ylim = c(-36, 38)) +
  theme_void()

Architect robustness into the workflow

The key idea: we don’t have to make the AI perfectly reliable.

Instead, we can architect robustness into the workflow.

The AI writes the source, and then deterministic tools and human checks sit downstream of it.

The stack on the left is the workflow. On the right, each click shows what that step buys us.

AI writes the source

↓

Quarto executes it

↓

GitHub tests it

↓

Git shows you what changed

↓

R computes the numbers

quarto render fails loudly

GitHub Actions runs quarto render continuously

Plain text diffs means you see what the AI changed

Numbers come from the data

  ## EV Sales
 
  Sales of **electric vehicles** grew
  20% in 2025, reaching over
  _20 million_ sales globally.

$ quarto render
Quitting from index.qmd:12-18 [ev-data]
Error:
! `data/ev-sales.csv` does not exist.
Execution halted

✓  render-site   passed in 38s   a1f3c9d
✓  render-site   passed in 41s   7b2e004
✗  render-site   failed in 12s   3d97951
   ! `data/ev-sales.csv` does not exist.

  ## EV Sales
 
  Sales of **electric vehicles** grew
- 20% in 2025, reaching over
- _20 million_ sales globally.
+ `r ev_percent_25` in 2025, reaching over
+ _`r ev_sales_25`_ sales globally.

  ## EV Sales
 
  Sales of **electric vehicles** grew
  `r ev_percent_25` in 2025, reaching over
  _`r ev_sales_25`_ sales globally.

AI writes the source: I am not asking the model for a PDF or dashboard. I am asking for source code—the thing we can inspect, execute, test, and regenerate.

Quarto executes it: quarto render actually runs the source. If something is broken, it fails loudly rather than handing us a polished-looking artifact. This isn’t unique to Quarto, but Quarto gives us a very clean test: does the document render?

GitHub tests it: GitHub Actions can render the project on every commit. We don’t have to remember to run the test.

Git shows you what changed: Because the source is plain text, I can inspect exactly what the model changed. I don’t have to visually inspect an entire regenerated artifact. This connects directly to “ask the AI for the source, not the artifact.”

R computes the numbers: Don’t ask the model to write numbers that can be computed. Inline R means the number comes from the data at render time.

Close: None of this makes the AI perfect. The goal is to build a workflow where the AI doesn’t have to be perfect. We put deterministic execution, automated testing, human-readable diffs, and computed content downstream of a probabilistic model. That is what I mean by architecting robustness into the workflow.

Modularity

Efficiency

Correctness

“The Unreasonable Effectiveness of Quarto”

Quarto wasn’t
built for AI!

Quarto was built around reproducible, executable, composable source. Those properties were not designed for AI agents, but they turn out to be exactly the properties that make an AI workflow tractable and trustworthy.

vehicletrends

Thanks!

jhelvy.com

jph@gwu.edu

@jhelvy

penguins dashboard