grafana/grafana

Built-in plugins

Grafana ships with dozens of datasource and panel plugins compiled into the binary. They live in public/app/plugins/ (frontend) and, for datasources that need server-side execution, in pkg/tsdb/ (backend).

Frontend plugins layout

public/app/plugins/
├── datasource/
│   ├── prometheus/
│   ├── loki/
│   ├── tempo/
│   ├── jaeger/
│   ├── zipkin/
│   ├── cloudwatch/
│   ├── azuremonitor/
│   ├── cloud-monitoring/
│   ├── mysql/
│   ├── mssql/
│   ├── grafana-postgresql-datasource/
│   ├── influxdb/
│   ├── opentsdb/
│   ├── graphite/
│   ├── parca/
│   ├── grafana-pyroscope-datasource/
│   ├── grafana-testdata-datasource/
│   ├── grafana/                          # The "-- Grafana --" datasource
│   ├── mixed/                            # Multi-datasource panel
│   ├── dashboard/                        # Dashboard datasource
│   └── ... (more)
└── panel/
    ├── timeseries/
    ├── stat/
    ├── gauge/
    ├── bargauge/
    ├── piechart/
    ├── histogram/
    ├── heatmap/
    ├── table/
    ├── logs/
    ├── traces/
    ├── flamegraph/
    ├── trend/
    ├── geomap/
    ├── canvas/
    ├── nodeGraph/
    ├── annolist/
    ├── dashlist/
    ├── alertlist/
    ├── news/
    ├── text/
    ├── stat-timeline/
    └── ... (~30 panels)

Sub-pages

Anatomy of a plugin

A plugin is a directory with at minimum:

plugin.json — metadata (id, name, type, version, capabilities, dependencies).
module.ts — entry point that builds and exports the GrafanaPlugin instance.
For datasources: datasource.ts (the DataSource class), query/QueryEditor.tsx, config/ConfigEditor.tsx.
For panels: a React component plus panelcfg.cue (CUE schema for options).
README + assets (icons, screenshots).

Some plugins are Yarn workspaces with their own package.json, build scripts, and tests. The plugin workspaces are listed in AGENTS.md under "Plugin Workspaces" and need separate build steps via yarn workspace @grafana-plugins/<name> dev. Examples: azuremonitor, cloud-monitoring, grafana-postgresql-datasource, loki, tempo, jaeger, mysql, parca, zipkin, grafana-pyroscope-datasource, grafana-testdata-datasource.

How a frontend plugin is wired in

For built-in plugins, the frontend imports happen at bundle time — webpack picks up the plugin sources and the host registers them at app startup. The user-facing experience is identical to externally installed plugins: same DataSource API, same PanelPlugin API, same plugin admin UI.

How a backend plugin is wired in

A backend datasource has a Go package under pkg/tsdb/<name>/ that implements QueryDataHandler from grafana-plugin-sdk-go. It is registered as a "core" plugin in pkg/services/pluginsintegration/pluginstore/ so the host treats it like any other backend plugin (in-process, no separate subprocess).

Adding a new built-in panel

Create a new directory under public/app/plugins/panel/<name>/.
Add plugin.json, module.tsx, the React component, and panelcfg.cue.
Run make gen-cue to generate the option types.
Register the plugin id in the appropriate registry.

In practice, most new panels are external plugins — the bar for adding a built-in panel is high.