[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-grafana-plugin-bundle-size":3,"mdc--2eda8h-key":34,"related-org-grafana-plugin-bundle-size":6377,"related-repo-grafana-plugin-bundle-size":6569},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":23,"repoUrl":24,"updatedAt":25,"license":26,"forks":27,"topics":28,"repo":29,"sourceUrl":32,"mdContent":33},"plugin-bundle-size","optimize Grafana plugin bundle size","Optimise Grafana app plugin bundle size using React.lazy, Suspense, and webpack code splitting. Use when the user asks to reduce plugin bundle size, optimise module.js, add code splitting, improve initial plugin load performance, split plugin chunks, lazy load plugin pages, or help implement lazy loading in a Grafana app plugin. Triggers on phrases like \"optimise plugin bundle size\", \"module.js is too large\", \"plugin is slow to load\", \"code split the plugin\", \"reduce initial JS payload\", or \"help me with Suspense in my plugin\".",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},"grafana","Grafana","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fgrafana.jpg",[12,16,19,20],{"name":13,"slug":14,"type":15},"Performance","performance","tag",{"name":17,"slug":18,"type":15},"React","react",{"name":9,"slug":8,"type":15},{"name":21,"slug":22,"type":15},"Frontend","frontend",189,"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fskills","2026-07-12T07:44:58.620078","Apache-2.0",16,[],{"repoUrl":24,"stars":23,"forks":27,"topics":30,"description":31},[],null,"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fskills\u002Ftree\u002FHEAD\u002Fskills\u002Fgrafana-plugins\u002Fplugin-bundle-size","---\nname: plugin-bundle-size\nlicense: Apache-2.0\ndescription:\n  Optimise Grafana app plugin bundle size using React.lazy, Suspense, and webpack code splitting.\n  Use when the user asks to reduce plugin bundle size, optimise module.js, add code splitting,\n  improve initial plugin load performance, split plugin chunks, lazy load plugin pages, or\n  help implement lazy loading in a Grafana app plugin. Triggers on phrases like \"optimise plugin\n  bundle size\", \"module.js is too large\", \"plugin is slow to load\", \"code split the plugin\",\n  \"reduce initial JS payload\", or \"help me with Suspense in my plugin\".\n---\n\n# Grafana plugin bundle size optimisation\n\n`module.js` is the render-blocking entry point for every Grafana app plugin. The smaller it is, the less impact the plugin has on Grafana's overall startup time. A well-split plugin should have a `module.js` under ~200 KB that contains nothing but lazy-loaded wrappers — all feature code loads on demand.\n\n**Target:** ~15–25 JS chunks total. Fewer means too little splitting; far more (50+) means over-engineering.\n\n## Risk levels\n\nNot all splitting opportunities carry the same risk. Apply them in this order:\n\n| Level | What | Risk | Impact |\n|---|---|---|---|\n| **Safe** | `module.tsx` lazy wrappers (Priority 1) | Very low — no behaviour change | Highest — module.js drops 90%+ |\n| **Safe** | Route-level `lazy()` (Priority 2) | Low — each route is self-contained | High — one chunk per route |\n| **Safe** | Extension `lazy()` (Priority 3) | Low — extensions are isolated | Medium — independent chunk per extension |\n| **Moderate** | Component registries \u002F tab panels (Priority 4) | Medium — verify Suspense placement | Medium — splits heavy pages further |\n| **Do not touch** | Vendor libraries (`@grafana\u002Fscenes`, `@reduxjs\u002Ftoolkit`) | N\u002FA | N\u002FA — webpack splits these automatically |\n| **Do not touch** | Shared utility components (Markdown, Spinner) used across many files | High churn, many callsites | Low — already in shared vendor chunks |\n\nWhen in doubt, stop after Priority 2. Routes alone typically reduce `module.js` by 95%+.\n\n---\n\n## Step 1: Add bundle size CI reporting (recommended)\n\nAdd the `grafana\u002Fplugin-actions\u002Fbundle-size` action to get automatic bundle size comparison comments on every PR. This posts a table showing entry point size changes, file count diffs, and total bundle impact.\n\n**Root-level plugins** (plugin at repo root):\n\n```yaml\n# .github\u002Fworkflows\u002Fbundle-size.yml\nname: Bundle Size\non:\n  pull_request:\n  push:\n    branches: [main]\n  workflow_dispatch:\n\njobs:\n  bundle-size:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: write\n      id-token: write\n      pull-requests: write\n      actions: read\n    steps:\n      - uses: actions\u002Fcheckout@v4\n      - uses: actions\u002Fsetup-node@v4\n        with:\n          node-version-file: .nvmrc\n      - name: Install and build\n        run: yarn install\n      - name: Bundle Size\n        uses: grafana\u002Fplugin-actions\u002Fbundle-size@a66a1c96cdbb176f9cccf10cf23593e250db7cce # bundle-size\u002Fv1.1.0\n```\n\n**Subdirectory plugins** (e.g. `plugin\u002F` in a monorepo):\n\nThe action's install step runs at the repo root and cannot find `yarn.lock` in a subdirectory. Work around this by installing deps yourself and symlinking to root:\n\n```yaml\njobs:\n  bundle-size:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: write\n      id-token: write\n      pull-requests: write\n      actions: read\n    steps:\n      - uses: actions\u002Fcheckout@v4\n      - uses: actions\u002Fsetup-node@v4\n        with:\n          node-version-file: .\u002Fplugin\u002F.nvmrc\n      - name: Install dependencies\n        working-directory: .\u002Fplugin\n        run: yarn install\n      - name: Symlink plugin to root for bundle-size action\n        run: |\n          ln -s plugin\u002Fyarn.lock yarn.lock\n          ln -s plugin\u002Fpackage.json package.json\n          ln -s plugin\u002F.yarnrc.yml .yarnrc.yml\n          ln -s plugin\u002Fnode_modules node_modules\n      - name: Bundle Size\n        uses: grafana\u002Fplugin-actions\u002Fbundle-size@a66a1c96cdbb176f9cccf10cf23593e250db7cce # bundle-size\u002Fv1.1.0\n        with:\n          working-directory: .\u002Fplugin\n```\n\n**How it works:** On push to main, builds and uploads a baseline artifact. On PRs, compares against it and posts a diff comment. Use `workflow_dispatch` to generate the first baseline.\n\n**Reference:** [grafana-k8s-plugin workflow](https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgrafana-k8s-plugin\u002Fblob\u002Fmain\u002F.github\u002Fworkflows\u002Fgrafana.yml)\n\n---\n\n## Step 2: Detect plugin context\n\n```bash\n# Confirm this is an app plugin (type: \"app\" — datasource\u002Fpanel plugins have different needs)\njq -r '\"\\(.id) — \\(.type)\"' src\u002Fplugin.json\n\n# Locate the entry point\nls src\u002Fmodule.ts src\u002Fmodule.tsx 2>\u002Fdev\u002Fnull\n\n# Measure the current PRODUCTION bundle size BEFORE making any changes\n# Dev builds are unminified and much larger — always measure production\nyarn build 2>\u002Fdev\u002Fnull || npm run build\necho \"=== module.js ===\" && ls -lah dist\u002Fmodule.js\necho \"=== all JS chunks ===\" && ls -lah dist\u002F*.js | sort -k5 -rh | head -20\necho \"=== chunk count ===\" && ls dist\u002F*.js | wc -l\n```\n\nRecord the baseline. A pre-split plugin commonly has a `module.js` of 1–3 MB with no other JS chunks.\n\n---\n\n## Step 3: Check and update create-plugin\n\nThe `@grafana\u002Fcreate-plugin` tool controls `.config\u002Fwebpack\u002F`, `.config\u002Fjest\u002F`, and other build scaffolding. Updating it often unlocks faster SWC compilation and better chunk output.\n\n```bash\ncat .config\u002F.cprc.json 2>\u002Fdev\u002Fnull || grep '\"@grafana\u002Fcreate-plugin\"' package.json\nnpm view @grafana\u002Fcreate-plugin version\nnpx @grafana\u002Fcreate-plugin@latest update\n```\n\nAfter updating, review the diff (especially `.config\u002Fwebpack\u002Fwebpack.config.ts`) and run a test build. If the plugin has a top-level `webpack.config.ts` that `webpack-merge`s the base config, review the merge for conflicts.\n\n---\n\n## Step 4: Analyse the codebase — find what to split\n\nDo **not** start implementing until you have read all of these.\n\n```bash\n# Entry point — look for direct (non-lazy) imports of App, ConfigPage, exposeComponent targets\ncat src\u002Fmodule.ts 2>\u002Fdev\u002Fnull || cat src\u002Fmodule.tsx\n\n# Root App component — look for direct page\u002Froute imports that should be lazy\ncat src\u002FApp.tsx src\u002Fcomponents\u002FApp.tsx src\u002Ffeature\u002Fapp\u002Fcomponents\u002FApp.tsx 2>\u002Fdev\u002Fnull | head -80\n\n# Extension registrations — each should become an independent chunk\ngrep -r \"exposeComponent\\|addComponent\\|addLink\" src\u002F --include=\"*.ts\" --include=\"*.tsx\" -n\n\n# Exported side-effect singletons (Faro, analytics) — must be extracted before splitting\ngrep -n \"^export const\\|^export let\" src\u002Fmodule.ts src\u002Fmodule.tsx 2>\u002Fdev\u002Fnull\ngrep -rn \"from '.*module'\" src\u002F --include=\"*.ts\" --include=\"*.tsx\" | grep -v node_modules\n\n# Heavy synchronous imports\ngrep -rn \"from 'monaco-editor\\|@codemirror\\|d3\\b\\|recharts\\|chart\\.js\" \\\n  src\u002F --include=\"*.ts\" --include=\"*.tsx\" | grep -v node_modules\n```\n\n**Key rule:** If a file is imported by `module.ts` directly (even transitively), it ends up in `module.js`. Everything reachable from a lazy boundary becomes its own chunk.\n\n---\n\n## Step 5: Implement splits — in priority order\n\n> **Named vs default exports:** `React.lazy()` requires a `default` export. Most Grafana plugin components use named exports — use `.then()` to re-map:\n> ```ts\n> \u002F\u002F Named export\n> const LazyMyComp = lazy(() => import('.\u002FMyComponent').then(m => ({ default: m.MyComponent })));\n> \u002F\u002F Default export\n> const LazyMyComp = lazy(() => import('.\u002FMyComponent'));\n> ```\n\n### Priority 1: module.tsx (highest impact, always do this first)\n\nIf the entry point is `module.ts`, rename it: `git mv src\u002Fmodule.ts src\u002Fmodule.tsx`\n\nMake `module.tsx` import **nothing** from feature code except through `lazy()`:\n\n```tsx\nimport React, { lazy, Suspense } from 'react';\nimport { AppPlugin, AppRootProps } from '@grafana\u002Fdata';\nimport { LoadingPlaceholder } from '@grafana\u002Fui';\n\nimport type { MyExtensionProps } from '.\u002Fextensions\u002FMyExtension';  \u002F\u002F import type — erased at compile time\nimport type { JsonData } from '.\u002Ffeatures\u002Fapp\u002Fstate\u002Fslice';\n\n\u002F\u002F Lazy Faro init — keeps @grafana\u002Ffaro-react out of module.js\nlet faroInitialized = false;\nasync function initFaro() {\n  if (faroInitialized) { return; }\n  faroInitialized = true;\n  const { initializeFaro } = await import('faro');\n  initializeFaro();\n}\n\nconst LazyApp = lazy(async () => {\n  await initFaro();\n  return import('.\u002Ffeatures\u002Fapp\u002FApp').then(m => ({ default: m.App }));\n});\n\nfunction App(props: AppRootProps\u003CJsonData>) {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CLazyApp {...props} \u002F>\u003C\u002FSuspense>;\n}\n\nconst LazyMyExtension = lazy(() =>\n  import('.\u002Fextensions\u002FMyExtension').then(m => ({ default: m.MyExtension }))\n);\nfunction MyExtension(props: MyExtensionProps) {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CLazyMyExtension {...props} \u002F>\u003C\u002FSuspense>;\n}\n\nexport const plugin = new AppPlugin\u003CJsonData>().setRootPage(App);\nplugin.exposeComponent({ id: 'my-plugin\u002Fmy-extension\u002Fv1', title: 'My Extension', component: MyExtension });\n```\n\n**Key details:**\n- `import type` for props prevents webpack from following the import into the eager bundle\n- Use `new AppPlugin\u003CJsonData>()` if App uses `AppRootProps\u003CJsonData>` — without the generic, `setRootPage()` type won't match\n- Remove any `App as unknown as ComponentClass\u003CAppRootProps>` cast — the lazy wrapper is a valid function component\n\n**Expected impact:** `module.js` drops from MB range to ~50–200 KB.\n\n**Singletons (e.g. Faro):** If `module.ts` has `export const faro = initializeFaro()`, do NOT keep it as a top-level import. Extract it to `src\u002Ffaro.ts`, update all internal imports from `'*\u002Fmodule'` → `'*\u002Ffaro'`, then use the dynamic `initFaro()` pattern above.\n\n---\n\n### Priority 2: Route-based splitting in App.tsx\n\n```tsx\nimport React, { lazy, Suspense } from 'react';\nimport { Route, Routes } from 'react-router-dom';\nimport { LoadingPlaceholder } from '@grafana\u002Fui';\n\nconst HomePage     = lazy(() => import('..\u002Fpages\u002FHome'));\nconst SettingsPage = lazy(() => import('..\u002Fpages\u002FSettings'));\nconst DetailPage   = lazy(() => import('..\u002Fpages\u002FDetail'));\n\nfunction App(props: AppRootProps) {\n  return (\n    \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\n      \u003CRoutes>\n        \u003CRoute path=\"home\"       element={\u003CHomePage \u002F>} \u002F>\n        \u003CRoute path=\"settings\"   element={\u003CSettingsPage \u002F>} \u002F>\n        \u003CRoute path=\"detail\u002F:id\" element={\u003CDetailPage \u002F>} \u002F>\n        \u003CRoute path=\"\"           element={\u003CHomePage \u002F>} \u002F>\n      \u003C\u002FRoutes>\n    \u003C\u002FSuspense>\n  );\n}\nexport default App;\n```\n\n**Bypass barrel files:** Target the actual component file in the `import()`, not an `index.ts` barrel that re-exports multiple things:\n\n```tsx\n\u002F\u002F Risky — barrel may pull in other heavy modules\nconst Catalog = lazy(() => import('features\u002Fcatalog'));\n\u002F\u002F Better — only pulls in Catalog's tree\nconst Catalog = lazy(() => import('features\u002Fcatalog\u002FCatalog').then(m => ({ default: m.Catalog })));\n```\n\n### Priority 3: Extension components\n\nEach extension should `export default` its component. Use `fallback={null}` for extensions that load quickly:\n\n```tsx\n\u002F\u002F src\u002Fextensions\u002FMyExtension.tsx\nexport default function MyExtension(props: MyExtensionProps) {\n  return \u003CAppProviders>\u003CMyExtensionContent {...props} \u002F>\u003C\u002FAppProviders>;\n}\n```\n\n**Surgical split:** If an extension wrapper must stay eager in `module.tsx`, lazy-load the heavy component it renders:\n\n```tsx\nconst HeavyInner = lazy(() => import('components\u002Ffeatures\u002FHeavyInner'));\nexport function MyExtension() {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CHeavyInner \u002F>\u003C\u002FSuspense>;\n}\n```\n\n### Priority 4: Component registries and tab panels\n\nFor arrays of objects containing React components (e.g. tab panels), lazy-load each entry. **Critical:** ensure a `\u003CSuspense>` boundary exists where the component renders.\n\n```tsx\nconst ConfigDetails = lazy(() => import('.\u002FConfigDetails\u002FConfigDetails').then(m => ({ default: m.ConfigDetails })));\nconst Overview      = lazy(() => import('.\u002FOverview\u002FOverview').then(m => ({ default: m.Overview })));\n\nconst tabs = [\n  { id: 'overview', component: Overview },\n  { id: 'config',   component: ConfigDetails },\n];\n\n\u002F\u002F In the parent that renders the active tab:\n\u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\n  {ActiveTab && \u003CActiveTab \u002F>}\n\u003C\u002FSuspense>\n```\n\nFor **datasource plugins** (`setConfigEditor`, `setQueryEditor`, `VariableSupport`, `AnnotationSupport`), see [references\u002Fdatasource-plugins.md](references\u002Fdatasource-plugins.md).\n\n---\n\n## Step 6: Group related chunks if over-splitting\n\nIf the build produces more than ~25 JS files, use webpack magic comments:\n\n```tsx\nconst FleetList   = lazy(() => import(\u002F* webpackChunkName: \"fleet\" *\u002F '..\u002Fpages\u002FFleetList'));\nconst FleetDetail = lazy(() => import(\u002F* webpackChunkName: \"fleet\" *\u002F '..\u002Fpages\u002FFleetDetail'));\n```\n\nOne `webpackChunkName` per logical feature area. Don't group unrelated pages.\n\n---\n\n## Step 7: Measure and verify\n\n```bash\nyarn build 2>\u002Fdev\u002Fnull || npm run build\necho \"=== module.js ===\" && ls -lah dist\u002Fmodule.js\necho \"=== all JS chunks (largest first) ===\" && ls -lah dist\u002F*.js | sort -k5 -rh | head -30\necho \"=== chunk count ===\" && ls dist\u002F*.js | wc -l\n```\n\n| Metric | Target |\n|---|---|\n| `module.js` size | \u003C 200 KB |\n| Total JS chunk count | 15–25 |\n| Largest single chunk | \u003C 1 MB |\n\n```bash\n# Analyse bundle composition if a chunk is unexpectedly large\nnpx webpack-bundle-analyzer dist\u002Fstats.json 2>\u002Fdev\u002Fnull\n```\n\n---\n\n## Step 8: Test the running plugin\n\n1. Open the plugin in a Grafana instance\n2. Navigate to **every route** — each triggers a new chunk download\n3. **DevTools → Network → JS**: confirm lazy chunks load on navigation, not all upfront\n4. Check **Console** for errors\n5. Test any `exposeComponent` extensions from other Grafana apps\n\nFor troubleshooting common issues, see [references\u002Ftroubleshooting.md](references\u002Ftroubleshooting.md).\n\n---\n\n## References\n\n- [grafana-collector-app](https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgrafana-collector-app) — app plugin reference implementation\n- [grafana\u002Fplugin-actions](https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fplugin-actions) — official Grafana plugin CI actions\n- [Web.dev — code splitting with lazy and Suspense](https:\u002F\u002Fweb.dev\u002Farticles\u002Fcode-splitting-suspense)\n- [SurviveJS — webpack code splitting](https:\u002F\u002Fsurvivejs.com\u002Fbooks\u002Fwebpack\u002Fbuilding\u002Fcode-splitting\u002F)\n- [webpack magic comments](https:\u002F\u002Fwebpack.js.org\u002Fapi\u002Fmodule-methods\u002F#magic-comments)\n",{"data":35,"body":36},{"name":4,"license":26,"description":6},{"type":37,"children":38},"root",[39,48,68,79,86,91,319,331,335,341,354,364,798,816,829,1207,1225,1244,1247,1253,1592,1604,1607,1613,1641,1737,1766,1769,1775,1787,2213,2238,2241,2247,2506,2513,2531,2556,3786,3794,3852,3868,3925,3928,3934,4652,4678,4879,4885,4906,5017,5034,5193,5199,5219,5703,5749,5752,5758,5763,5901,5914,5917,5923,6124,6190,6230,6233,6239,6294,6305,6308,6314,6371],{"type":40,"tag":41,"props":42,"children":44},"element","h1",{"id":43},"grafana-plugin-bundle-size-optimisation",[45],{"type":46,"value":47},"text","Grafana plugin bundle size optimisation",{"type":40,"tag":49,"props":50,"children":51},"p",{},[52,59,61,66],{"type":40,"tag":53,"props":54,"children":56},"code",{"className":55},[],[57],{"type":46,"value":58},"module.js",{"type":46,"value":60}," is the render-blocking entry point for every Grafana app plugin. The smaller it is, the less impact the plugin has on Grafana's overall startup time. A well-split plugin should have a ",{"type":40,"tag":53,"props":62,"children":64},{"className":63},[],[65],{"type":46,"value":58},{"type":46,"value":67}," under ~200 KB that contains nothing but lazy-loaded wrappers — all feature code loads on demand.",{"type":40,"tag":49,"props":69,"children":70},{},[71,77],{"type":40,"tag":72,"props":73,"children":74},"strong",{},[75],{"type":46,"value":76},"Target:",{"type":46,"value":78}," ~15–25 JS chunks total. Fewer means too little splitting; far more (50+) means over-engineering.",{"type":40,"tag":80,"props":81,"children":83},"h2",{"id":82},"risk-levels",[84],{"type":46,"value":85},"Risk levels",{"type":40,"tag":49,"props":87,"children":88},{},[89],{"type":46,"value":90},"Not all splitting opportunities carry the same risk. Apply them in this order:",{"type":40,"tag":92,"props":93,"children":94},"table",{},[95,124],{"type":40,"tag":96,"props":97,"children":98},"thead",{},[99],{"type":40,"tag":100,"props":101,"children":102},"tr",{},[103,109,114,119],{"type":40,"tag":104,"props":105,"children":106},"th",{},[107],{"type":46,"value":108},"Level",{"type":40,"tag":104,"props":110,"children":111},{},[112],{"type":46,"value":113},"What",{"type":40,"tag":104,"props":115,"children":116},{},[117],{"type":46,"value":118},"Risk",{"type":40,"tag":104,"props":120,"children":121},{},[122],{"type":46,"value":123},"Impact",{"type":40,"tag":125,"props":126,"children":127},"tbody",{},[128,161,194,226,252,294],{"type":40,"tag":100,"props":129,"children":130},{},[131,140,151,156],{"type":40,"tag":132,"props":133,"children":134},"td",{},[135],{"type":40,"tag":72,"props":136,"children":137},{},[138],{"type":46,"value":139},"Safe",{"type":40,"tag":132,"props":141,"children":142},{},[143,149],{"type":40,"tag":53,"props":144,"children":146},{"className":145},[],[147],{"type":46,"value":148},"module.tsx",{"type":46,"value":150}," lazy wrappers (Priority 1)",{"type":40,"tag":132,"props":152,"children":153},{},[154],{"type":46,"value":155},"Very low — no behaviour change",{"type":40,"tag":132,"props":157,"children":158},{},[159],{"type":46,"value":160},"Highest — module.js drops 90%+",{"type":40,"tag":100,"props":162,"children":163},{},[164,171,184,189],{"type":40,"tag":132,"props":165,"children":166},{},[167],{"type":40,"tag":72,"props":168,"children":169},{},[170],{"type":46,"value":139},{"type":40,"tag":132,"props":172,"children":173},{},[174,176,182],{"type":46,"value":175},"Route-level ",{"type":40,"tag":53,"props":177,"children":179},{"className":178},[],[180],{"type":46,"value":181},"lazy()",{"type":46,"value":183}," (Priority 2)",{"type":40,"tag":132,"props":185,"children":186},{},[187],{"type":46,"value":188},"Low — each route is self-contained",{"type":40,"tag":132,"props":190,"children":191},{},[192],{"type":46,"value":193},"High — one chunk per route",{"type":40,"tag":100,"props":195,"children":196},{},[197,204,216,221],{"type":40,"tag":132,"props":198,"children":199},{},[200],{"type":40,"tag":72,"props":201,"children":202},{},[203],{"type":46,"value":139},{"type":40,"tag":132,"props":205,"children":206},{},[207,209,214],{"type":46,"value":208},"Extension ",{"type":40,"tag":53,"props":210,"children":212},{"className":211},[],[213],{"type":46,"value":181},{"type":46,"value":215}," (Priority 3)",{"type":40,"tag":132,"props":217,"children":218},{},[219],{"type":46,"value":220},"Low — extensions are isolated",{"type":40,"tag":132,"props":222,"children":223},{},[224],{"type":46,"value":225},"Medium — independent chunk per extension",{"type":40,"tag":100,"props":227,"children":228},{},[229,237,242,247],{"type":40,"tag":132,"props":230,"children":231},{},[232],{"type":40,"tag":72,"props":233,"children":234},{},[235],{"type":46,"value":236},"Moderate",{"type":40,"tag":132,"props":238,"children":239},{},[240],{"type":46,"value":241},"Component registries \u002F tab panels (Priority 4)",{"type":40,"tag":132,"props":243,"children":244},{},[245],{"type":46,"value":246},"Medium — verify Suspense placement",{"type":40,"tag":132,"props":248,"children":249},{},[250],{"type":46,"value":251},"Medium — splits heavy pages further",{"type":40,"tag":100,"props":253,"children":254},{},[255,263,284,289],{"type":40,"tag":132,"props":256,"children":257},{},[258],{"type":40,"tag":72,"props":259,"children":260},{},[261],{"type":46,"value":262},"Do not touch",{"type":40,"tag":132,"props":264,"children":265},{},[266,268,274,276,282],{"type":46,"value":267},"Vendor libraries (",{"type":40,"tag":53,"props":269,"children":271},{"className":270},[],[272],{"type":46,"value":273},"@grafana\u002Fscenes",{"type":46,"value":275},", ",{"type":40,"tag":53,"props":277,"children":279},{"className":278},[],[280],{"type":46,"value":281},"@reduxjs\u002Ftoolkit",{"type":46,"value":283},")",{"type":40,"tag":132,"props":285,"children":286},{},[287],{"type":46,"value":288},"N\u002FA",{"type":40,"tag":132,"props":290,"children":291},{},[292],{"type":46,"value":293},"N\u002FA — webpack splits these automatically",{"type":40,"tag":100,"props":295,"children":296},{},[297,304,309,314],{"type":40,"tag":132,"props":298,"children":299},{},[300],{"type":40,"tag":72,"props":301,"children":302},{},[303],{"type":46,"value":262},{"type":40,"tag":132,"props":305,"children":306},{},[307],{"type":46,"value":308},"Shared utility components (Markdown, Spinner) used across many files",{"type":40,"tag":132,"props":310,"children":311},{},[312],{"type":46,"value":313},"High churn, many callsites",{"type":40,"tag":132,"props":315,"children":316},{},[317],{"type":46,"value":318},"Low — already in shared vendor chunks",{"type":40,"tag":49,"props":320,"children":321},{},[322,324,329],{"type":46,"value":323},"When in doubt, stop after Priority 2. Routes alone typically reduce ",{"type":40,"tag":53,"props":325,"children":327},{"className":326},[],[328],{"type":46,"value":58},{"type":46,"value":330}," by 95%+.",{"type":40,"tag":332,"props":333,"children":334},"hr",{},[],{"type":40,"tag":80,"props":336,"children":338},{"id":337},"step-1-add-bundle-size-ci-reporting-recommended",[339],{"type":46,"value":340},"Step 1: Add bundle size CI reporting (recommended)",{"type":40,"tag":49,"props":342,"children":343},{},[344,346,352],{"type":46,"value":345},"Add the ",{"type":40,"tag":53,"props":347,"children":349},{"className":348},[],[350],{"type":46,"value":351},"grafana\u002Fplugin-actions\u002Fbundle-size",{"type":46,"value":353}," action to get automatic bundle size comparison comments on every PR. This posts a table showing entry point size changes, file count diffs, and total bundle impact.",{"type":40,"tag":49,"props":355,"children":356},{},[357,362],{"type":40,"tag":72,"props":358,"children":359},{},[360],{"type":46,"value":361},"Root-level plugins",{"type":46,"value":363}," (plugin at repo root):",{"type":40,"tag":365,"props":366,"children":371},"pre",{"className":367,"code":368,"language":369,"meta":370,"style":370},"language-yaml shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","# .github\u002Fworkflows\u002Fbundle-size.yml\nname: Bundle Size\non:\n  pull_request:\n  push:\n    branches: [main]\n  workflow_dispatch:\n\njobs:\n  bundle-size:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: write\n      id-token: write\n      pull-requests: write\n      actions: read\n    steps:\n      - uses: actions\u002Fcheckout@v4\n      - uses: actions\u002Fsetup-node@v4\n        with:\n          node-version-file: .nvmrc\n      - name: Install and build\n        run: yarn install\n      - name: Bundle Size\n        uses: grafana\u002Fplugin-actions\u002Fbundle-size@a66a1c96cdbb176f9cccf10cf23593e250db7cce # bundle-size\u002Fv1.1.0\n","yaml","",[372],{"type":40,"tag":53,"props":373,"children":374},{"__ignoreMap":370},[375,387,409,424,437,450,478,491,501,514,527,545,558,576,593,610,627,640,663,684,697,715,737,755,775],{"type":40,"tag":376,"props":377,"children":380},"span",{"class":378,"line":379},"line",1,[381],{"type":40,"tag":376,"props":382,"children":384},{"style":383},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[385],{"type":46,"value":386},"# .github\u002Fworkflows\u002Fbundle-size.yml\n",{"type":40,"tag":376,"props":388,"children":390},{"class":378,"line":389},2,[391,397,403],{"type":40,"tag":376,"props":392,"children":394},{"style":393},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[395],{"type":46,"value":396},"name",{"type":40,"tag":376,"props":398,"children":400},{"style":399},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[401],{"type":46,"value":402},":",{"type":40,"tag":376,"props":404,"children":406},{"style":405},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[407],{"type":46,"value":408}," Bundle Size\n",{"type":40,"tag":376,"props":410,"children":412},{"class":378,"line":411},3,[413,419],{"type":40,"tag":376,"props":414,"children":416},{"style":415},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[417],{"type":46,"value":418},"on",{"type":40,"tag":376,"props":420,"children":421},{"style":399},[422],{"type":46,"value":423},":\n",{"type":40,"tag":376,"props":425,"children":427},{"class":378,"line":426},4,[428,433],{"type":40,"tag":376,"props":429,"children":430},{"style":393},[431],{"type":46,"value":432},"  pull_request",{"type":40,"tag":376,"props":434,"children":435},{"style":399},[436],{"type":46,"value":423},{"type":40,"tag":376,"props":438,"children":440},{"class":378,"line":439},5,[441,446],{"type":40,"tag":376,"props":442,"children":443},{"style":393},[444],{"type":46,"value":445},"  push",{"type":40,"tag":376,"props":447,"children":448},{"style":399},[449],{"type":46,"value":423},{"type":40,"tag":376,"props":451,"children":453},{"class":378,"line":452},6,[454,459,463,468,473],{"type":40,"tag":376,"props":455,"children":456},{"style":393},[457],{"type":46,"value":458},"    branches",{"type":40,"tag":376,"props":460,"children":461},{"style":399},[462],{"type":46,"value":402},{"type":40,"tag":376,"props":464,"children":465},{"style":399},[466],{"type":46,"value":467}," [",{"type":40,"tag":376,"props":469,"children":470},{"style":405},[471],{"type":46,"value":472},"main",{"type":40,"tag":376,"props":474,"children":475},{"style":399},[476],{"type":46,"value":477},"]\n",{"type":40,"tag":376,"props":479,"children":481},{"class":378,"line":480},7,[482,487],{"type":40,"tag":376,"props":483,"children":484},{"style":393},[485],{"type":46,"value":486},"  workflow_dispatch",{"type":40,"tag":376,"props":488,"children":489},{"style":399},[490],{"type":46,"value":423},{"type":40,"tag":376,"props":492,"children":494},{"class":378,"line":493},8,[495],{"type":40,"tag":376,"props":496,"children":498},{"emptyLinePlaceholder":497},true,[499],{"type":46,"value":500},"\n",{"type":40,"tag":376,"props":502,"children":504},{"class":378,"line":503},9,[505,510],{"type":40,"tag":376,"props":506,"children":507},{"style":393},[508],{"type":46,"value":509},"jobs",{"type":40,"tag":376,"props":511,"children":512},{"style":399},[513],{"type":46,"value":423},{"type":40,"tag":376,"props":515,"children":517},{"class":378,"line":516},10,[518,523],{"type":40,"tag":376,"props":519,"children":520},{"style":393},[521],{"type":46,"value":522},"  bundle-size",{"type":40,"tag":376,"props":524,"children":525},{"style":399},[526],{"type":46,"value":423},{"type":40,"tag":376,"props":528,"children":530},{"class":378,"line":529},11,[531,536,540],{"type":40,"tag":376,"props":532,"children":533},{"style":393},[534],{"type":46,"value":535},"    runs-on",{"type":40,"tag":376,"props":537,"children":538},{"style":399},[539],{"type":46,"value":402},{"type":40,"tag":376,"props":541,"children":542},{"style":405},[543],{"type":46,"value":544}," ubuntu-latest\n",{"type":40,"tag":376,"props":546,"children":548},{"class":378,"line":547},12,[549,554],{"type":40,"tag":376,"props":550,"children":551},{"style":393},[552],{"type":46,"value":553},"    permissions",{"type":40,"tag":376,"props":555,"children":556},{"style":399},[557],{"type":46,"value":423},{"type":40,"tag":376,"props":559,"children":561},{"class":378,"line":560},13,[562,567,571],{"type":40,"tag":376,"props":563,"children":564},{"style":393},[565],{"type":46,"value":566},"      contents",{"type":40,"tag":376,"props":568,"children":569},{"style":399},[570],{"type":46,"value":402},{"type":40,"tag":376,"props":572,"children":573},{"style":405},[574],{"type":46,"value":575}," write\n",{"type":40,"tag":376,"props":577,"children":579},{"class":378,"line":578},14,[580,585,589],{"type":40,"tag":376,"props":581,"children":582},{"style":393},[583],{"type":46,"value":584},"      id-token",{"type":40,"tag":376,"props":586,"children":587},{"style":399},[588],{"type":46,"value":402},{"type":40,"tag":376,"props":590,"children":591},{"style":405},[592],{"type":46,"value":575},{"type":40,"tag":376,"props":594,"children":596},{"class":378,"line":595},15,[597,602,606],{"type":40,"tag":376,"props":598,"children":599},{"style":393},[600],{"type":46,"value":601},"      pull-requests",{"type":40,"tag":376,"props":603,"children":604},{"style":399},[605],{"type":46,"value":402},{"type":40,"tag":376,"props":607,"children":608},{"style":405},[609],{"type":46,"value":575},{"type":40,"tag":376,"props":611,"children":612},{"class":378,"line":27},[613,618,622],{"type":40,"tag":376,"props":614,"children":615},{"style":393},[616],{"type":46,"value":617},"      actions",{"type":40,"tag":376,"props":619,"children":620},{"style":399},[621],{"type":46,"value":402},{"type":40,"tag":376,"props":623,"children":624},{"style":405},[625],{"type":46,"value":626}," read\n",{"type":40,"tag":376,"props":628,"children":630},{"class":378,"line":629},17,[631,636],{"type":40,"tag":376,"props":632,"children":633},{"style":393},[634],{"type":46,"value":635},"    steps",{"type":40,"tag":376,"props":637,"children":638},{"style":399},[639],{"type":46,"value":423},{"type":40,"tag":376,"props":641,"children":643},{"class":378,"line":642},18,[644,649,654,658],{"type":40,"tag":376,"props":645,"children":646},{"style":399},[647],{"type":46,"value":648},"      -",{"type":40,"tag":376,"props":650,"children":651},{"style":393},[652],{"type":46,"value":653}," uses",{"type":40,"tag":376,"props":655,"children":656},{"style":399},[657],{"type":46,"value":402},{"type":40,"tag":376,"props":659,"children":660},{"style":405},[661],{"type":46,"value":662}," actions\u002Fcheckout@v4\n",{"type":40,"tag":376,"props":664,"children":666},{"class":378,"line":665},19,[667,671,675,679],{"type":40,"tag":376,"props":668,"children":669},{"style":399},[670],{"type":46,"value":648},{"type":40,"tag":376,"props":672,"children":673},{"style":393},[674],{"type":46,"value":653},{"type":40,"tag":376,"props":676,"children":677},{"style":399},[678],{"type":46,"value":402},{"type":40,"tag":376,"props":680,"children":681},{"style":405},[682],{"type":46,"value":683}," actions\u002Fsetup-node@v4\n",{"type":40,"tag":376,"props":685,"children":687},{"class":378,"line":686},20,[688,693],{"type":40,"tag":376,"props":689,"children":690},{"style":393},[691],{"type":46,"value":692},"        with",{"type":40,"tag":376,"props":694,"children":695},{"style":399},[696],{"type":46,"value":423},{"type":40,"tag":376,"props":698,"children":700},{"class":378,"line":699},21,[701,706,710],{"type":40,"tag":376,"props":702,"children":703},{"style":393},[704],{"type":46,"value":705},"          node-version-file",{"type":40,"tag":376,"props":707,"children":708},{"style":399},[709],{"type":46,"value":402},{"type":40,"tag":376,"props":711,"children":712},{"style":405},[713],{"type":46,"value":714}," .nvmrc\n",{"type":40,"tag":376,"props":716,"children":718},{"class":378,"line":717},22,[719,723,728,732],{"type":40,"tag":376,"props":720,"children":721},{"style":399},[722],{"type":46,"value":648},{"type":40,"tag":376,"props":724,"children":725},{"style":393},[726],{"type":46,"value":727}," name",{"type":40,"tag":376,"props":729,"children":730},{"style":399},[731],{"type":46,"value":402},{"type":40,"tag":376,"props":733,"children":734},{"style":405},[735],{"type":46,"value":736}," Install and build\n",{"type":40,"tag":376,"props":738,"children":740},{"class":378,"line":739},23,[741,746,750],{"type":40,"tag":376,"props":742,"children":743},{"style":393},[744],{"type":46,"value":745},"        run",{"type":40,"tag":376,"props":747,"children":748},{"style":399},[749],{"type":46,"value":402},{"type":40,"tag":376,"props":751,"children":752},{"style":405},[753],{"type":46,"value":754}," yarn install\n",{"type":40,"tag":376,"props":756,"children":758},{"class":378,"line":757},24,[759,763,767,771],{"type":40,"tag":376,"props":760,"children":761},{"style":399},[762],{"type":46,"value":648},{"type":40,"tag":376,"props":764,"children":765},{"style":393},[766],{"type":46,"value":727},{"type":40,"tag":376,"props":768,"children":769},{"style":399},[770],{"type":46,"value":402},{"type":40,"tag":376,"props":772,"children":773},{"style":405},[774],{"type":46,"value":408},{"type":40,"tag":376,"props":776,"children":778},{"class":378,"line":777},25,[779,784,788,793],{"type":40,"tag":376,"props":780,"children":781},{"style":393},[782],{"type":46,"value":783},"        uses",{"type":40,"tag":376,"props":785,"children":786},{"style":399},[787],{"type":46,"value":402},{"type":40,"tag":376,"props":789,"children":790},{"style":405},[791],{"type":46,"value":792}," grafana\u002Fplugin-actions\u002Fbundle-size@a66a1c96cdbb176f9cccf10cf23593e250db7cce",{"type":40,"tag":376,"props":794,"children":795},{"style":383},[796],{"type":46,"value":797}," # bundle-size\u002Fv1.1.0\n",{"type":40,"tag":49,"props":799,"children":800},{},[801,806,808,814],{"type":40,"tag":72,"props":802,"children":803},{},[804],{"type":46,"value":805},"Subdirectory plugins",{"type":46,"value":807}," (e.g. ",{"type":40,"tag":53,"props":809,"children":811},{"className":810},[],[812],{"type":46,"value":813},"plugin\u002F",{"type":46,"value":815}," in a monorepo):",{"type":40,"tag":49,"props":817,"children":818},{},[819,821,827],{"type":46,"value":820},"The action's install step runs at the repo root and cannot find ",{"type":40,"tag":53,"props":822,"children":824},{"className":823},[],[825],{"type":46,"value":826},"yarn.lock",{"type":46,"value":828}," in a subdirectory. Work around this by installing deps yourself and symlinking to root:",{"type":40,"tag":365,"props":830,"children":832},{"className":367,"code":831,"language":369,"meta":370,"style":370},"jobs:\n  bundle-size:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: write\n      id-token: write\n      pull-requests: write\n      actions: read\n    steps:\n      - uses: actions\u002Fcheckout@v4\n      - uses: actions\u002Fsetup-node@v4\n        with:\n          node-version-file: .\u002Fplugin\u002F.nvmrc\n      - name: Install dependencies\n        working-directory: .\u002Fplugin\n        run: yarn install\n      - name: Symlink plugin to root for bundle-size action\n        run: |\n          ln -s plugin\u002Fyarn.lock yarn.lock\n          ln -s plugin\u002Fpackage.json package.json\n          ln -s plugin\u002F.yarnrc.yml .yarnrc.yml\n          ln -s plugin\u002Fnode_modules node_modules\n      - name: Bundle Size\n        uses: grafana\u002Fplugin-actions\u002Fbundle-size@a66a1c96cdbb176f9cccf10cf23593e250db7cce # bundle-size\u002Fv1.1.0\n        with:\n          working-directory: .\u002Fplugin\n",[833],{"type":40,"tag":53,"props":834,"children":835},{"__ignoreMap":370},[836,847,858,873,884,899,914,929,944,955,974,993,1004,1020,1040,1057,1072,1092,1109,1117,1125,1133,1141,1160,1179,1190],{"type":40,"tag":376,"props":837,"children":838},{"class":378,"line":379},[839,843],{"type":40,"tag":376,"props":840,"children":841},{"style":393},[842],{"type":46,"value":509},{"type":40,"tag":376,"props":844,"children":845},{"style":399},[846],{"type":46,"value":423},{"type":40,"tag":376,"props":848,"children":849},{"class":378,"line":389},[850,854],{"type":40,"tag":376,"props":851,"children":852},{"style":393},[853],{"type":46,"value":522},{"type":40,"tag":376,"props":855,"children":856},{"style":399},[857],{"type":46,"value":423},{"type":40,"tag":376,"props":859,"children":860},{"class":378,"line":411},[861,865,869],{"type":40,"tag":376,"props":862,"children":863},{"style":393},[864],{"type":46,"value":535},{"type":40,"tag":376,"props":866,"children":867},{"style":399},[868],{"type":46,"value":402},{"type":40,"tag":376,"props":870,"children":871},{"style":405},[872],{"type":46,"value":544},{"type":40,"tag":376,"props":874,"children":875},{"class":378,"line":426},[876,880],{"type":40,"tag":376,"props":877,"children":878},{"style":393},[879],{"type":46,"value":553},{"type":40,"tag":376,"props":881,"children":882},{"style":399},[883],{"type":46,"value":423},{"type":40,"tag":376,"props":885,"children":886},{"class":378,"line":439},[887,891,895],{"type":40,"tag":376,"props":888,"children":889},{"style":393},[890],{"type":46,"value":566},{"type":40,"tag":376,"props":892,"children":893},{"style":399},[894],{"type":46,"value":402},{"type":40,"tag":376,"props":896,"children":897},{"style":405},[898],{"type":46,"value":575},{"type":40,"tag":376,"props":900,"children":901},{"class":378,"line":452},[902,906,910],{"type":40,"tag":376,"props":903,"children":904},{"style":393},[905],{"type":46,"value":584},{"type":40,"tag":376,"props":907,"children":908},{"style":399},[909],{"type":46,"value":402},{"type":40,"tag":376,"props":911,"children":912},{"style":405},[913],{"type":46,"value":575},{"type":40,"tag":376,"props":915,"children":916},{"class":378,"line":480},[917,921,925],{"type":40,"tag":376,"props":918,"children":919},{"style":393},[920],{"type":46,"value":601},{"type":40,"tag":376,"props":922,"children":923},{"style":399},[924],{"type":46,"value":402},{"type":40,"tag":376,"props":926,"children":927},{"style":405},[928],{"type":46,"value":575},{"type":40,"tag":376,"props":930,"children":931},{"class":378,"line":493},[932,936,940],{"type":40,"tag":376,"props":933,"children":934},{"style":393},[935],{"type":46,"value":617},{"type":40,"tag":376,"props":937,"children":938},{"style":399},[939],{"type":46,"value":402},{"type":40,"tag":376,"props":941,"children":942},{"style":405},[943],{"type":46,"value":626},{"type":40,"tag":376,"props":945,"children":946},{"class":378,"line":503},[947,951],{"type":40,"tag":376,"props":948,"children":949},{"style":393},[950],{"type":46,"value":635},{"type":40,"tag":376,"props":952,"children":953},{"style":399},[954],{"type":46,"value":423},{"type":40,"tag":376,"props":956,"children":957},{"class":378,"line":516},[958,962,966,970],{"type":40,"tag":376,"props":959,"children":960},{"style":399},[961],{"type":46,"value":648},{"type":40,"tag":376,"props":963,"children":964},{"style":393},[965],{"type":46,"value":653},{"type":40,"tag":376,"props":967,"children":968},{"style":399},[969],{"type":46,"value":402},{"type":40,"tag":376,"props":971,"children":972},{"style":405},[973],{"type":46,"value":662},{"type":40,"tag":376,"props":975,"children":976},{"class":378,"line":529},[977,981,985,989],{"type":40,"tag":376,"props":978,"children":979},{"style":399},[980],{"type":46,"value":648},{"type":40,"tag":376,"props":982,"children":983},{"style":393},[984],{"type":46,"value":653},{"type":40,"tag":376,"props":986,"children":987},{"style":399},[988],{"type":46,"value":402},{"type":40,"tag":376,"props":990,"children":991},{"style":405},[992],{"type":46,"value":683},{"type":40,"tag":376,"props":994,"children":995},{"class":378,"line":547},[996,1000],{"type":40,"tag":376,"props":997,"children":998},{"style":393},[999],{"type":46,"value":692},{"type":40,"tag":376,"props":1001,"children":1002},{"style":399},[1003],{"type":46,"value":423},{"type":40,"tag":376,"props":1005,"children":1006},{"class":378,"line":560},[1007,1011,1015],{"type":40,"tag":376,"props":1008,"children":1009},{"style":393},[1010],{"type":46,"value":705},{"type":40,"tag":376,"props":1012,"children":1013},{"style":399},[1014],{"type":46,"value":402},{"type":40,"tag":376,"props":1016,"children":1017},{"style":405},[1018],{"type":46,"value":1019}," .\u002Fplugin\u002F.nvmrc\n",{"type":40,"tag":376,"props":1021,"children":1022},{"class":378,"line":578},[1023,1027,1031,1035],{"type":40,"tag":376,"props":1024,"children":1025},{"style":399},[1026],{"type":46,"value":648},{"type":40,"tag":376,"props":1028,"children":1029},{"style":393},[1030],{"type":46,"value":727},{"type":40,"tag":376,"props":1032,"children":1033},{"style":399},[1034],{"type":46,"value":402},{"type":40,"tag":376,"props":1036,"children":1037},{"style":405},[1038],{"type":46,"value":1039}," Install dependencies\n",{"type":40,"tag":376,"props":1041,"children":1042},{"class":378,"line":595},[1043,1048,1052],{"type":40,"tag":376,"props":1044,"children":1045},{"style":393},[1046],{"type":46,"value":1047},"        working-directory",{"type":40,"tag":376,"props":1049,"children":1050},{"style":399},[1051],{"type":46,"value":402},{"type":40,"tag":376,"props":1053,"children":1054},{"style":405},[1055],{"type":46,"value":1056}," .\u002Fplugin\n",{"type":40,"tag":376,"props":1058,"children":1059},{"class":378,"line":27},[1060,1064,1068],{"type":40,"tag":376,"props":1061,"children":1062},{"style":393},[1063],{"type":46,"value":745},{"type":40,"tag":376,"props":1065,"children":1066},{"style":399},[1067],{"type":46,"value":402},{"type":40,"tag":376,"props":1069,"children":1070},{"style":405},[1071],{"type":46,"value":754},{"type":40,"tag":376,"props":1073,"children":1074},{"class":378,"line":629},[1075,1079,1083,1087],{"type":40,"tag":376,"props":1076,"children":1077},{"style":399},[1078],{"type":46,"value":648},{"type":40,"tag":376,"props":1080,"children":1081},{"style":393},[1082],{"type":46,"value":727},{"type":40,"tag":376,"props":1084,"children":1085},{"style":399},[1086],{"type":46,"value":402},{"type":40,"tag":376,"props":1088,"children":1089},{"style":405},[1090],{"type":46,"value":1091}," Symlink plugin to root for bundle-size action\n",{"type":40,"tag":376,"props":1093,"children":1094},{"class":378,"line":642},[1095,1099,1103],{"type":40,"tag":376,"props":1096,"children":1097},{"style":393},[1098],{"type":46,"value":745},{"type":40,"tag":376,"props":1100,"children":1101},{"style":399},[1102],{"type":46,"value":402},{"type":40,"tag":376,"props":1104,"children":1106},{"style":1105},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[1107],{"type":46,"value":1108}," |\n",{"type":40,"tag":376,"props":1110,"children":1111},{"class":378,"line":665},[1112],{"type":40,"tag":376,"props":1113,"children":1114},{"style":405},[1115],{"type":46,"value":1116},"          ln -s plugin\u002Fyarn.lock yarn.lock\n",{"type":40,"tag":376,"props":1118,"children":1119},{"class":378,"line":686},[1120],{"type":40,"tag":376,"props":1121,"children":1122},{"style":405},[1123],{"type":46,"value":1124},"          ln -s plugin\u002Fpackage.json package.json\n",{"type":40,"tag":376,"props":1126,"children":1127},{"class":378,"line":699},[1128],{"type":40,"tag":376,"props":1129,"children":1130},{"style":405},[1131],{"type":46,"value":1132},"          ln -s plugin\u002F.yarnrc.yml .yarnrc.yml\n",{"type":40,"tag":376,"props":1134,"children":1135},{"class":378,"line":717},[1136],{"type":40,"tag":376,"props":1137,"children":1138},{"style":405},[1139],{"type":46,"value":1140},"          ln -s plugin\u002Fnode_modules node_modules\n",{"type":40,"tag":376,"props":1142,"children":1143},{"class":378,"line":739},[1144,1148,1152,1156],{"type":40,"tag":376,"props":1145,"children":1146},{"style":399},[1147],{"type":46,"value":648},{"type":40,"tag":376,"props":1149,"children":1150},{"style":393},[1151],{"type":46,"value":727},{"type":40,"tag":376,"props":1153,"children":1154},{"style":399},[1155],{"type":46,"value":402},{"type":40,"tag":376,"props":1157,"children":1158},{"style":405},[1159],{"type":46,"value":408},{"type":40,"tag":376,"props":1161,"children":1162},{"class":378,"line":757},[1163,1167,1171,1175],{"type":40,"tag":376,"props":1164,"children":1165},{"style":393},[1166],{"type":46,"value":783},{"type":40,"tag":376,"props":1168,"children":1169},{"style":399},[1170],{"type":46,"value":402},{"type":40,"tag":376,"props":1172,"children":1173},{"style":405},[1174],{"type":46,"value":792},{"type":40,"tag":376,"props":1176,"children":1177},{"style":383},[1178],{"type":46,"value":797},{"type":40,"tag":376,"props":1180,"children":1181},{"class":378,"line":777},[1182,1186],{"type":40,"tag":376,"props":1183,"children":1184},{"style":393},[1185],{"type":46,"value":692},{"type":40,"tag":376,"props":1187,"children":1188},{"style":399},[1189],{"type":46,"value":423},{"type":40,"tag":376,"props":1191,"children":1193},{"class":378,"line":1192},26,[1194,1199,1203],{"type":40,"tag":376,"props":1195,"children":1196},{"style":393},[1197],{"type":46,"value":1198},"          working-directory",{"type":40,"tag":376,"props":1200,"children":1201},{"style":399},[1202],{"type":46,"value":402},{"type":40,"tag":376,"props":1204,"children":1205},{"style":405},[1206],{"type":46,"value":1056},{"type":40,"tag":49,"props":1208,"children":1209},{},[1210,1215,1217,1223],{"type":40,"tag":72,"props":1211,"children":1212},{},[1213],{"type":46,"value":1214},"How it works:",{"type":46,"value":1216}," On push to main, builds and uploads a baseline artifact. On PRs, compares against it and posts a diff comment. Use ",{"type":40,"tag":53,"props":1218,"children":1220},{"className":1219},[],[1221],{"type":46,"value":1222},"workflow_dispatch",{"type":46,"value":1224}," to generate the first baseline.",{"type":40,"tag":49,"props":1226,"children":1227},{},[1228,1233,1235],{"type":40,"tag":72,"props":1229,"children":1230},{},[1231],{"type":46,"value":1232},"Reference:",{"type":46,"value":1234}," ",{"type":40,"tag":1236,"props":1237,"children":1241},"a",{"href":1238,"rel":1239},"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgrafana-k8s-plugin\u002Fblob\u002Fmain\u002F.github\u002Fworkflows\u002Fgrafana.yml",[1240],"nofollow",[1242],{"type":46,"value":1243},"grafana-k8s-plugin workflow",{"type":40,"tag":332,"props":1245,"children":1246},{},[],{"type":40,"tag":80,"props":1248,"children":1250},{"id":1249},"step-2-detect-plugin-context",[1251],{"type":46,"value":1252},"Step 2: Detect plugin context",{"type":40,"tag":365,"props":1254,"children":1258},{"className":1255,"code":1256,"language":1257,"meta":370,"style":370},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","# Confirm this is an app plugin (type: \"app\" — datasource\u002Fpanel plugins have different needs)\njq -r '\"\\(.id) — \\(.type)\"' src\u002Fplugin.json\n\n# Locate the entry point\nls src\u002Fmodule.ts src\u002Fmodule.tsx 2>\u002Fdev\u002Fnull\n\n# Measure the current PRODUCTION bundle size BEFORE making any changes\n# Dev builds are unminified and much larger — always measure production\nyarn build 2>\u002Fdev\u002Fnull || npm run build\necho \"=== module.js ===\" && ls -lah dist\u002Fmodule.js\necho \"=== all JS chunks ===\" && ls -lah dist\u002F*.js | sort -k5 -rh | head -20\necho \"=== chunk count ===\" && ls dist\u002F*.js | wc -l\n","bash",[1259],{"type":40,"tag":53,"props":1260,"children":1261},{"__ignoreMap":370},[1262,1270,1304,1311,1319,1347,1354,1362,1370,1412,1456,1538],{"type":40,"tag":376,"props":1263,"children":1264},{"class":378,"line":379},[1265],{"type":40,"tag":376,"props":1266,"children":1267},{"style":383},[1268],{"type":46,"value":1269},"# Confirm this is an app plugin (type: \"app\" — datasource\u002Fpanel plugins have different needs)\n",{"type":40,"tag":376,"props":1271,"children":1272},{"class":378,"line":389},[1273,1279,1284,1289,1294,1299],{"type":40,"tag":376,"props":1274,"children":1276},{"style":1275},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[1277],{"type":46,"value":1278},"jq",{"type":40,"tag":376,"props":1280,"children":1281},{"style":405},[1282],{"type":46,"value":1283}," -r",{"type":40,"tag":376,"props":1285,"children":1286},{"style":399},[1287],{"type":46,"value":1288}," '",{"type":40,"tag":376,"props":1290,"children":1291},{"style":405},[1292],{"type":46,"value":1293},"\"\\(.id) — \\(.type)\"",{"type":40,"tag":376,"props":1295,"children":1296},{"style":399},[1297],{"type":46,"value":1298},"'",{"type":40,"tag":376,"props":1300,"children":1301},{"style":405},[1302],{"type":46,"value":1303}," src\u002Fplugin.json\n",{"type":40,"tag":376,"props":1305,"children":1306},{"class":378,"line":411},[1307],{"type":40,"tag":376,"props":1308,"children":1309},{"emptyLinePlaceholder":497},[1310],{"type":46,"value":500},{"type":40,"tag":376,"props":1312,"children":1313},{"class":378,"line":426},[1314],{"type":40,"tag":376,"props":1315,"children":1316},{"style":383},[1317],{"type":46,"value":1318},"# Locate the entry point\n",{"type":40,"tag":376,"props":1320,"children":1321},{"class":378,"line":439},[1322,1327,1332,1337,1342],{"type":40,"tag":376,"props":1323,"children":1324},{"style":1275},[1325],{"type":46,"value":1326},"ls",{"type":40,"tag":376,"props":1328,"children":1329},{"style":405},[1330],{"type":46,"value":1331}," src\u002Fmodule.ts",{"type":40,"tag":376,"props":1333,"children":1334},{"style":405},[1335],{"type":46,"value":1336}," src\u002Fmodule.tsx",{"type":40,"tag":376,"props":1338,"children":1339},{"style":399},[1340],{"type":46,"value":1341}," 2>",{"type":40,"tag":376,"props":1343,"children":1344},{"style":405},[1345],{"type":46,"value":1346},"\u002Fdev\u002Fnull\n",{"type":40,"tag":376,"props":1348,"children":1349},{"class":378,"line":452},[1350],{"type":40,"tag":376,"props":1351,"children":1352},{"emptyLinePlaceholder":497},[1353],{"type":46,"value":500},{"type":40,"tag":376,"props":1355,"children":1356},{"class":378,"line":480},[1357],{"type":40,"tag":376,"props":1358,"children":1359},{"style":383},[1360],{"type":46,"value":1361},"# Measure the current PRODUCTION bundle size BEFORE making any changes\n",{"type":40,"tag":376,"props":1363,"children":1364},{"class":378,"line":493},[1365],{"type":40,"tag":376,"props":1366,"children":1367},{"style":383},[1368],{"type":46,"value":1369},"# Dev builds are unminified and much larger — always measure production\n",{"type":40,"tag":376,"props":1371,"children":1372},{"class":378,"line":503},[1373,1378,1383,1387,1392,1397,1402,1407],{"type":40,"tag":376,"props":1374,"children":1375},{"style":1275},[1376],{"type":46,"value":1377},"yarn",{"type":40,"tag":376,"props":1379,"children":1380},{"style":405},[1381],{"type":46,"value":1382}," build",{"type":40,"tag":376,"props":1384,"children":1385},{"style":399},[1386],{"type":46,"value":1341},{"type":40,"tag":376,"props":1388,"children":1389},{"style":405},[1390],{"type":46,"value":1391},"\u002Fdev\u002Fnull",{"type":40,"tag":376,"props":1393,"children":1394},{"style":399},[1395],{"type":46,"value":1396}," ||",{"type":40,"tag":376,"props":1398,"children":1399},{"style":1275},[1400],{"type":46,"value":1401}," npm",{"type":40,"tag":376,"props":1403,"children":1404},{"style":405},[1405],{"type":46,"value":1406}," run",{"type":40,"tag":376,"props":1408,"children":1409},{"style":405},[1410],{"type":46,"value":1411}," build\n",{"type":40,"tag":376,"props":1413,"children":1414},{"class":378,"line":516},[1415,1421,1426,1431,1436,1441,1446,1451],{"type":40,"tag":376,"props":1416,"children":1418},{"style":1417},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[1419],{"type":46,"value":1420},"echo",{"type":40,"tag":376,"props":1422,"children":1423},{"style":399},[1424],{"type":46,"value":1425}," \"",{"type":40,"tag":376,"props":1427,"children":1428},{"style":405},[1429],{"type":46,"value":1430},"=== module.js ===",{"type":40,"tag":376,"props":1432,"children":1433},{"style":399},[1434],{"type":46,"value":1435},"\"",{"type":40,"tag":376,"props":1437,"children":1438},{"style":399},[1439],{"type":46,"value":1440}," &&",{"type":40,"tag":376,"props":1442,"children":1443},{"style":1275},[1444],{"type":46,"value":1445}," ls",{"type":40,"tag":376,"props":1447,"children":1448},{"style":405},[1449],{"type":46,"value":1450}," -lah",{"type":40,"tag":376,"props":1452,"children":1453},{"style":405},[1454],{"type":46,"value":1455}," dist\u002Fmodule.js\n",{"type":40,"tag":376,"props":1457,"children":1458},{"class":378,"line":529},[1459,1463,1467,1472,1476,1480,1484,1488,1493,1499,1504,1509,1514,1519,1524,1528,1533],{"type":40,"tag":376,"props":1460,"children":1461},{"style":1417},[1462],{"type":46,"value":1420},{"type":40,"tag":376,"props":1464,"children":1465},{"style":399},[1466],{"type":46,"value":1425},{"type":40,"tag":376,"props":1468,"children":1469},{"style":405},[1470],{"type":46,"value":1471},"=== all JS chunks ===",{"type":40,"tag":376,"props":1473,"children":1474},{"style":399},[1475],{"type":46,"value":1435},{"type":40,"tag":376,"props":1477,"children":1478},{"style":399},[1479],{"type":46,"value":1440},{"type":40,"tag":376,"props":1481,"children":1482},{"style":1275},[1483],{"type":46,"value":1445},{"type":40,"tag":376,"props":1485,"children":1486},{"style":405},[1487],{"type":46,"value":1450},{"type":40,"tag":376,"props":1489,"children":1490},{"style":405},[1491],{"type":46,"value":1492}," dist\u002F",{"type":40,"tag":376,"props":1494,"children":1496},{"style":1495},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[1497],{"type":46,"value":1498},"*",{"type":40,"tag":376,"props":1500,"children":1501},{"style":405},[1502],{"type":46,"value":1503},".js",{"type":40,"tag":376,"props":1505,"children":1506},{"style":399},[1507],{"type":46,"value":1508}," |",{"type":40,"tag":376,"props":1510,"children":1511},{"style":1275},[1512],{"type":46,"value":1513}," sort",{"type":40,"tag":376,"props":1515,"children":1516},{"style":405},[1517],{"type":46,"value":1518}," -k5",{"type":40,"tag":376,"props":1520,"children":1521},{"style":405},[1522],{"type":46,"value":1523}," -rh",{"type":40,"tag":376,"props":1525,"children":1526},{"style":399},[1527],{"type":46,"value":1508},{"type":40,"tag":376,"props":1529,"children":1530},{"style":1275},[1531],{"type":46,"value":1532}," head",{"type":40,"tag":376,"props":1534,"children":1535},{"style":405},[1536],{"type":46,"value":1537}," -20\n",{"type":40,"tag":376,"props":1539,"children":1540},{"class":378,"line":547},[1541,1545,1549,1554,1558,1562,1566,1570,1574,1578,1582,1587],{"type":40,"tag":376,"props":1542,"children":1543},{"style":1417},[1544],{"type":46,"value":1420},{"type":40,"tag":376,"props":1546,"children":1547},{"style":399},[1548],{"type":46,"value":1425},{"type":40,"tag":376,"props":1550,"children":1551},{"style":405},[1552],{"type":46,"value":1553},"=== chunk count ===",{"type":40,"tag":376,"props":1555,"children":1556},{"style":399},[1557],{"type":46,"value":1435},{"type":40,"tag":376,"props":1559,"children":1560},{"style":399},[1561],{"type":46,"value":1440},{"type":40,"tag":376,"props":1563,"children":1564},{"style":1275},[1565],{"type":46,"value":1445},{"type":40,"tag":376,"props":1567,"children":1568},{"style":405},[1569],{"type":46,"value":1492},{"type":40,"tag":376,"props":1571,"children":1572},{"style":1495},[1573],{"type":46,"value":1498},{"type":40,"tag":376,"props":1575,"children":1576},{"style":405},[1577],{"type":46,"value":1503},{"type":40,"tag":376,"props":1579,"children":1580},{"style":399},[1581],{"type":46,"value":1508},{"type":40,"tag":376,"props":1583,"children":1584},{"style":1275},[1585],{"type":46,"value":1586}," wc",{"type":40,"tag":376,"props":1588,"children":1589},{"style":405},[1590],{"type":46,"value":1591}," -l\n",{"type":40,"tag":49,"props":1593,"children":1594},{},[1595,1597,1602],{"type":46,"value":1596},"Record the baseline. A pre-split plugin commonly has a ",{"type":40,"tag":53,"props":1598,"children":1600},{"className":1599},[],[1601],{"type":46,"value":58},{"type":46,"value":1603}," of 1–3 MB with no other JS chunks.",{"type":40,"tag":332,"props":1605,"children":1606},{},[],{"type":40,"tag":80,"props":1608,"children":1610},{"id":1609},"step-3-check-and-update-create-plugin",[1611],{"type":46,"value":1612},"Step 3: Check and update create-plugin",{"type":40,"tag":49,"props":1614,"children":1615},{},[1616,1618,1624,1626,1632,1633,1639],{"type":46,"value":1617},"The ",{"type":40,"tag":53,"props":1619,"children":1621},{"className":1620},[],[1622],{"type":46,"value":1623},"@grafana\u002Fcreate-plugin",{"type":46,"value":1625}," tool controls ",{"type":40,"tag":53,"props":1627,"children":1629},{"className":1628},[],[1630],{"type":46,"value":1631},".config\u002Fwebpack\u002F",{"type":46,"value":275},{"type":40,"tag":53,"props":1634,"children":1636},{"className":1635},[],[1637],{"type":46,"value":1638},".config\u002Fjest\u002F",{"type":46,"value":1640},", and other build scaffolding. Updating it often unlocks faster SWC compilation and better chunk output.",{"type":40,"tag":365,"props":1642,"children":1644},{"className":1255,"code":1643,"language":1257,"meta":370,"style":370},"cat .config\u002F.cprc.json 2>\u002Fdev\u002Fnull || grep '\"@grafana\u002Fcreate-plugin\"' package.json\nnpm view @grafana\u002Fcreate-plugin version\nnpx @grafana\u002Fcreate-plugin@latest update\n",[1645],{"type":40,"tag":53,"props":1646,"children":1647},{"__ignoreMap":370},[1648,1696,1719],{"type":40,"tag":376,"props":1649,"children":1650},{"class":378,"line":379},[1651,1656,1661,1665,1669,1673,1678,1682,1687,1691],{"type":40,"tag":376,"props":1652,"children":1653},{"style":1275},[1654],{"type":46,"value":1655},"cat",{"type":40,"tag":376,"props":1657,"children":1658},{"style":405},[1659],{"type":46,"value":1660}," .config\u002F.cprc.json",{"type":40,"tag":376,"props":1662,"children":1663},{"style":399},[1664],{"type":46,"value":1341},{"type":40,"tag":376,"props":1666,"children":1667},{"style":405},[1668],{"type":46,"value":1391},{"type":40,"tag":376,"props":1670,"children":1671},{"style":399},[1672],{"type":46,"value":1396},{"type":40,"tag":376,"props":1674,"children":1675},{"style":1275},[1676],{"type":46,"value":1677}," grep",{"type":40,"tag":376,"props":1679,"children":1680},{"style":399},[1681],{"type":46,"value":1288},{"type":40,"tag":376,"props":1683,"children":1684},{"style":405},[1685],{"type":46,"value":1686},"\"@grafana\u002Fcreate-plugin\"",{"type":40,"tag":376,"props":1688,"children":1689},{"style":399},[1690],{"type":46,"value":1298},{"type":40,"tag":376,"props":1692,"children":1693},{"style":405},[1694],{"type":46,"value":1695}," package.json\n",{"type":40,"tag":376,"props":1697,"children":1698},{"class":378,"line":389},[1699,1704,1709,1714],{"type":40,"tag":376,"props":1700,"children":1701},{"style":1275},[1702],{"type":46,"value":1703},"npm",{"type":40,"tag":376,"props":1705,"children":1706},{"style":405},[1707],{"type":46,"value":1708}," view",{"type":40,"tag":376,"props":1710,"children":1711},{"style":405},[1712],{"type":46,"value":1713}," @grafana\u002Fcreate-plugin",{"type":40,"tag":376,"props":1715,"children":1716},{"style":405},[1717],{"type":46,"value":1718}," version\n",{"type":40,"tag":376,"props":1720,"children":1721},{"class":378,"line":411},[1722,1727,1732],{"type":40,"tag":376,"props":1723,"children":1724},{"style":1275},[1725],{"type":46,"value":1726},"npx",{"type":40,"tag":376,"props":1728,"children":1729},{"style":405},[1730],{"type":46,"value":1731}," @grafana\u002Fcreate-plugin@latest",{"type":40,"tag":376,"props":1733,"children":1734},{"style":405},[1735],{"type":46,"value":1736}," update\n",{"type":40,"tag":49,"props":1738,"children":1739},{},[1740,1742,1748,1750,1756,1758,1764],{"type":46,"value":1741},"After updating, review the diff (especially ",{"type":40,"tag":53,"props":1743,"children":1745},{"className":1744},[],[1746],{"type":46,"value":1747},".config\u002Fwebpack\u002Fwebpack.config.ts",{"type":46,"value":1749},") and run a test build. If the plugin has a top-level ",{"type":40,"tag":53,"props":1751,"children":1753},{"className":1752},[],[1754],{"type":46,"value":1755},"webpack.config.ts",{"type":46,"value":1757}," that ",{"type":40,"tag":53,"props":1759,"children":1761},{"className":1760},[],[1762],{"type":46,"value":1763},"webpack-merge",{"type":46,"value":1765},"s the base config, review the merge for conflicts.",{"type":40,"tag":332,"props":1767,"children":1768},{},[],{"type":40,"tag":80,"props":1770,"children":1772},{"id":1771},"step-4-analyse-the-codebase-find-what-to-split",[1773],{"type":46,"value":1774},"Step 4: Analyse the codebase — find what to split",{"type":40,"tag":49,"props":1776,"children":1777},{},[1778,1780,1785],{"type":46,"value":1779},"Do ",{"type":40,"tag":72,"props":1781,"children":1782},{},[1783],{"type":46,"value":1784},"not",{"type":46,"value":1786}," start implementing until you have read all of these.",{"type":40,"tag":365,"props":1788,"children":1790},{"className":1255,"code":1789,"language":1257,"meta":370,"style":370},"# Entry point — look for direct (non-lazy) imports of App, ConfigPage, exposeComponent targets\ncat src\u002Fmodule.ts 2>\u002Fdev\u002Fnull || cat src\u002Fmodule.tsx\n\n# Root App component — look for direct page\u002Froute imports that should be lazy\ncat src\u002FApp.tsx src\u002Fcomponents\u002FApp.tsx src\u002Ffeature\u002Fapp\u002Fcomponents\u002FApp.tsx 2>\u002Fdev\u002Fnull | head -80\n\n# Extension registrations — each should become an independent chunk\ngrep -r \"exposeComponent\\|addComponent\\|addLink\" src\u002F --include=\"*.ts\" --include=\"*.tsx\" -n\n\n# Exported side-effect singletons (Faro, analytics) — must be extracted before splitting\ngrep -n \"^export const\\|^export let\" src\u002Fmodule.ts src\u002Fmodule.tsx 2>\u002Fdev\u002Fnull\ngrep -rn \"from '.*module'\" src\u002F --include=\"*.ts\" --include=\"*.tsx\" | grep -v node_modules\n\n# Heavy synchronous imports\ngrep -rn \"from 'monaco-editor\\|@codemirror\\|d3\\b\\|recharts\\|chart\\.js\" \\\n  src\u002F --include=\"*.ts\" --include=\"*.tsx\" | grep -v node_modules\n",[1791],{"type":40,"tag":53,"props":1792,"children":1793},{"__ignoreMap":370},[1794,1802,1835,1842,1850,1893,1900,1908,1978,1985,1993,2034,2113,2120,2128,2157],{"type":40,"tag":376,"props":1795,"children":1796},{"class":378,"line":379},[1797],{"type":40,"tag":376,"props":1798,"children":1799},{"style":383},[1800],{"type":46,"value":1801},"# Entry point — look for direct (non-lazy) imports of App, ConfigPage, exposeComponent targets\n",{"type":40,"tag":376,"props":1803,"children":1804},{"class":378,"line":389},[1805,1809,1813,1817,1821,1825,1830],{"type":40,"tag":376,"props":1806,"children":1807},{"style":1275},[1808],{"type":46,"value":1655},{"type":40,"tag":376,"props":1810,"children":1811},{"style":405},[1812],{"type":46,"value":1331},{"type":40,"tag":376,"props":1814,"children":1815},{"style":399},[1816],{"type":46,"value":1341},{"type":40,"tag":376,"props":1818,"children":1819},{"style":405},[1820],{"type":46,"value":1391},{"type":40,"tag":376,"props":1822,"children":1823},{"style":399},[1824],{"type":46,"value":1396},{"type":40,"tag":376,"props":1826,"children":1827},{"style":1275},[1828],{"type":46,"value":1829}," cat",{"type":40,"tag":376,"props":1831,"children":1832},{"style":405},[1833],{"type":46,"value":1834}," src\u002Fmodule.tsx\n",{"type":40,"tag":376,"props":1836,"children":1837},{"class":378,"line":411},[1838],{"type":40,"tag":376,"props":1839,"children":1840},{"emptyLinePlaceholder":497},[1841],{"type":46,"value":500},{"type":40,"tag":376,"props":1843,"children":1844},{"class":378,"line":426},[1845],{"type":40,"tag":376,"props":1846,"children":1847},{"style":383},[1848],{"type":46,"value":1849},"# Root App component — look for direct page\u002Froute imports that should be lazy\n",{"type":40,"tag":376,"props":1851,"children":1852},{"class":378,"line":439},[1853,1857,1862,1867,1872,1876,1880,1884,1888],{"type":40,"tag":376,"props":1854,"children":1855},{"style":1275},[1856],{"type":46,"value":1655},{"type":40,"tag":376,"props":1858,"children":1859},{"style":405},[1860],{"type":46,"value":1861}," src\u002FApp.tsx",{"type":40,"tag":376,"props":1863,"children":1864},{"style":405},[1865],{"type":46,"value":1866}," src\u002Fcomponents\u002FApp.tsx",{"type":40,"tag":376,"props":1868,"children":1869},{"style":405},[1870],{"type":46,"value":1871}," src\u002Ffeature\u002Fapp\u002Fcomponents\u002FApp.tsx",{"type":40,"tag":376,"props":1873,"children":1874},{"style":399},[1875],{"type":46,"value":1341},{"type":40,"tag":376,"props":1877,"children":1878},{"style":405},[1879],{"type":46,"value":1391},{"type":40,"tag":376,"props":1881,"children":1882},{"style":399},[1883],{"type":46,"value":1508},{"type":40,"tag":376,"props":1885,"children":1886},{"style":1275},[1887],{"type":46,"value":1532},{"type":40,"tag":376,"props":1889,"children":1890},{"style":405},[1891],{"type":46,"value":1892}," -80\n",{"type":40,"tag":376,"props":1894,"children":1895},{"class":378,"line":452},[1896],{"type":40,"tag":376,"props":1897,"children":1898},{"emptyLinePlaceholder":497},[1899],{"type":46,"value":500},{"type":40,"tag":376,"props":1901,"children":1902},{"class":378,"line":480},[1903],{"type":40,"tag":376,"props":1904,"children":1905},{"style":383},[1906],{"type":46,"value":1907},"# Extension registrations — each should become an independent chunk\n",{"type":40,"tag":376,"props":1909,"children":1910},{"class":378,"line":493},[1911,1916,1920,1924,1929,1933,1938,1943,1947,1952,1956,1960,1964,1969,1973],{"type":40,"tag":376,"props":1912,"children":1913},{"style":1275},[1914],{"type":46,"value":1915},"grep",{"type":40,"tag":376,"props":1917,"children":1918},{"style":405},[1919],{"type":46,"value":1283},{"type":40,"tag":376,"props":1921,"children":1922},{"style":399},[1923],{"type":46,"value":1425},{"type":40,"tag":376,"props":1925,"children":1926},{"style":405},[1927],{"type":46,"value":1928},"exposeComponent\\|addComponent\\|addLink",{"type":40,"tag":376,"props":1930,"children":1931},{"style":399},[1932],{"type":46,"value":1435},{"type":40,"tag":376,"props":1934,"children":1935},{"style":405},[1936],{"type":46,"value":1937}," src\u002F",{"type":40,"tag":376,"props":1939,"children":1940},{"style":405},[1941],{"type":46,"value":1942}," --include=",{"type":40,"tag":376,"props":1944,"children":1945},{"style":399},[1946],{"type":46,"value":1435},{"type":40,"tag":376,"props":1948,"children":1949},{"style":405},[1950],{"type":46,"value":1951},"*.ts",{"type":40,"tag":376,"props":1953,"children":1954},{"style":399},[1955],{"type":46,"value":1435},{"type":40,"tag":376,"props":1957,"children":1958},{"style":405},[1959],{"type":46,"value":1942},{"type":40,"tag":376,"props":1961,"children":1962},{"style":399},[1963],{"type":46,"value":1435},{"type":40,"tag":376,"props":1965,"children":1966},{"style":405},[1967],{"type":46,"value":1968},"*.tsx",{"type":40,"tag":376,"props":1970,"children":1971},{"style":399},[1972],{"type":46,"value":1435},{"type":40,"tag":376,"props":1974,"children":1975},{"style":405},[1976],{"type":46,"value":1977}," -n\n",{"type":40,"tag":376,"props":1979,"children":1980},{"class":378,"line":503},[1981],{"type":40,"tag":376,"props":1982,"children":1983},{"emptyLinePlaceholder":497},[1984],{"type":46,"value":500},{"type":40,"tag":376,"props":1986,"children":1987},{"class":378,"line":516},[1988],{"type":40,"tag":376,"props":1989,"children":1990},{"style":383},[1991],{"type":46,"value":1992},"# Exported side-effect singletons (Faro, analytics) — must be extracted before splitting\n",{"type":40,"tag":376,"props":1994,"children":1995},{"class":378,"line":529},[1996,2000,2005,2009,2014,2018,2022,2026,2030],{"type":40,"tag":376,"props":1997,"children":1998},{"style":1275},[1999],{"type":46,"value":1915},{"type":40,"tag":376,"props":2001,"children":2002},{"style":405},[2003],{"type":46,"value":2004}," -n",{"type":40,"tag":376,"props":2006,"children":2007},{"style":399},[2008],{"type":46,"value":1425},{"type":40,"tag":376,"props":2010,"children":2011},{"style":405},[2012],{"type":46,"value":2013},"^export const\\|^export let",{"type":40,"tag":376,"props":2015,"children":2016},{"style":399},[2017],{"type":46,"value":1435},{"type":40,"tag":376,"props":2019,"children":2020},{"style":405},[2021],{"type":46,"value":1331},{"type":40,"tag":376,"props":2023,"children":2024},{"style":405},[2025],{"type":46,"value":1336},{"type":40,"tag":376,"props":2027,"children":2028},{"style":399},[2029],{"type":46,"value":1341},{"type":40,"tag":376,"props":2031,"children":2032},{"style":405},[2033],{"type":46,"value":1346},{"type":40,"tag":376,"props":2035,"children":2036},{"class":378,"line":547},[2037,2041,2046,2050,2055,2059,2063,2067,2071,2075,2079,2083,2087,2091,2095,2099,2103,2108],{"type":40,"tag":376,"props":2038,"children":2039},{"style":1275},[2040],{"type":46,"value":1915},{"type":40,"tag":376,"props":2042,"children":2043},{"style":405},[2044],{"type":46,"value":2045}," -rn",{"type":40,"tag":376,"props":2047,"children":2048},{"style":399},[2049],{"type":46,"value":1425},{"type":40,"tag":376,"props":2051,"children":2052},{"style":405},[2053],{"type":46,"value":2054},"from '.*module'",{"type":40,"tag":376,"props":2056,"children":2057},{"style":399},[2058],{"type":46,"value":1435},{"type":40,"tag":376,"props":2060,"children":2061},{"style":405},[2062],{"type":46,"value":1937},{"type":40,"tag":376,"props":2064,"children":2065},{"style":405},[2066],{"type":46,"value":1942},{"type":40,"tag":376,"props":2068,"children":2069},{"style":399},[2070],{"type":46,"value":1435},{"type":40,"tag":376,"props":2072,"children":2073},{"style":405},[2074],{"type":46,"value":1951},{"type":40,"tag":376,"props":2076,"children":2077},{"style":399},[2078],{"type":46,"value":1435},{"type":40,"tag":376,"props":2080,"children":2081},{"style":405},[2082],{"type":46,"value":1942},{"type":40,"tag":376,"props":2084,"children":2085},{"style":399},[2086],{"type":46,"value":1435},{"type":40,"tag":376,"props":2088,"children":2089},{"style":405},[2090],{"type":46,"value":1968},{"type":40,"tag":376,"props":2092,"children":2093},{"style":399},[2094],{"type":46,"value":1435},{"type":40,"tag":376,"props":2096,"children":2097},{"style":399},[2098],{"type":46,"value":1508},{"type":40,"tag":376,"props":2100,"children":2101},{"style":1275},[2102],{"type":46,"value":1677},{"type":40,"tag":376,"props":2104,"children":2105},{"style":405},[2106],{"type":46,"value":2107}," -v",{"type":40,"tag":376,"props":2109,"children":2110},{"style":405},[2111],{"type":46,"value":2112}," node_modules\n",{"type":40,"tag":376,"props":2114,"children":2115},{"class":378,"line":560},[2116],{"type":40,"tag":376,"props":2117,"children":2118},{"emptyLinePlaceholder":497},[2119],{"type":46,"value":500},{"type":40,"tag":376,"props":2121,"children":2122},{"class":378,"line":578},[2123],{"type":40,"tag":376,"props":2124,"children":2125},{"style":383},[2126],{"type":46,"value":2127},"# Heavy synchronous imports\n",{"type":40,"tag":376,"props":2129,"children":2130},{"class":378,"line":595},[2131,2135,2139,2143,2148,2152],{"type":40,"tag":376,"props":2132,"children":2133},{"style":1275},[2134],{"type":46,"value":1915},{"type":40,"tag":376,"props":2136,"children":2137},{"style":405},[2138],{"type":46,"value":2045},{"type":40,"tag":376,"props":2140,"children":2141},{"style":399},[2142],{"type":46,"value":1425},{"type":40,"tag":376,"props":2144,"children":2145},{"style":405},[2146],{"type":46,"value":2147},"from 'monaco-editor\\|@codemirror\\|d3\\b\\|recharts\\|chart\\.js",{"type":40,"tag":376,"props":2149,"children":2150},{"style":399},[2151],{"type":46,"value":1435},{"type":40,"tag":376,"props":2153,"children":2154},{"style":1495},[2155],{"type":46,"value":2156}," \\\n",{"type":40,"tag":376,"props":2158,"children":2159},{"class":378,"line":27},[2160,2165,2169,2173,2177,2181,2185,2189,2193,2197,2201,2205,2209],{"type":40,"tag":376,"props":2161,"children":2162},{"style":405},[2163],{"type":46,"value":2164},"  src\u002F",{"type":40,"tag":376,"props":2166,"children":2167},{"style":405},[2168],{"type":46,"value":1942},{"type":40,"tag":376,"props":2170,"children":2171},{"style":399},[2172],{"type":46,"value":1435},{"type":40,"tag":376,"props":2174,"children":2175},{"style":405},[2176],{"type":46,"value":1951},{"type":40,"tag":376,"props":2178,"children":2179},{"style":399},[2180],{"type":46,"value":1435},{"type":40,"tag":376,"props":2182,"children":2183},{"style":405},[2184],{"type":46,"value":1942},{"type":40,"tag":376,"props":2186,"children":2187},{"style":399},[2188],{"type":46,"value":1435},{"type":40,"tag":376,"props":2190,"children":2191},{"style":405},[2192],{"type":46,"value":1968},{"type":40,"tag":376,"props":2194,"children":2195},{"style":399},[2196],{"type":46,"value":1435},{"type":40,"tag":376,"props":2198,"children":2199},{"style":399},[2200],{"type":46,"value":1508},{"type":40,"tag":376,"props":2202,"children":2203},{"style":1275},[2204],{"type":46,"value":1677},{"type":40,"tag":376,"props":2206,"children":2207},{"style":405},[2208],{"type":46,"value":2107},{"type":40,"tag":376,"props":2210,"children":2211},{"style":405},[2212],{"type":46,"value":2112},{"type":40,"tag":49,"props":2214,"children":2215},{},[2216,2221,2223,2229,2231,2236],{"type":40,"tag":72,"props":2217,"children":2218},{},[2219],{"type":46,"value":2220},"Key rule:",{"type":46,"value":2222}," If a file is imported by ",{"type":40,"tag":53,"props":2224,"children":2226},{"className":2225},[],[2227],{"type":46,"value":2228},"module.ts",{"type":46,"value":2230}," directly (even transitively), it ends up in ",{"type":40,"tag":53,"props":2232,"children":2234},{"className":2233},[],[2235],{"type":46,"value":58},{"type":46,"value":2237},". Everything reachable from a lazy boundary becomes its own chunk.",{"type":40,"tag":332,"props":2239,"children":2240},{},[],{"type":40,"tag":80,"props":2242,"children":2244},{"id":2243},"step-5-implement-splits-in-priority-order",[2245],{"type":46,"value":2246},"Step 5: Implement splits — in priority order",{"type":40,"tag":2248,"props":2249,"children":2250},"blockquote",{},[2251,2284],{"type":40,"tag":49,"props":2252,"children":2253},{},[2254,2259,2260,2266,2268,2274,2276,2282],{"type":40,"tag":72,"props":2255,"children":2256},{},[2257],{"type":46,"value":2258},"Named vs default exports:",{"type":46,"value":1234},{"type":40,"tag":53,"props":2261,"children":2263},{"className":2262},[],[2264],{"type":46,"value":2265},"React.lazy()",{"type":46,"value":2267}," requires a ",{"type":40,"tag":53,"props":2269,"children":2271},{"className":2270},[],[2272],{"type":46,"value":2273},"default",{"type":46,"value":2275}," export. Most Grafana plugin components use named exports — use ",{"type":40,"tag":53,"props":2277,"children":2279},{"className":2278},[],[2280],{"type":46,"value":2281},".then()",{"type":46,"value":2283}," to re-map:",{"type":40,"tag":365,"props":2285,"children":2289},{"className":2286,"code":2287,"language":2288,"meta":370,"style":370},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F Named export\nconst LazyMyComp = lazy(() => import('.\u002FMyComponent').then(m => ({ default: m.MyComponent })));\n\u002F\u002F Default export\nconst LazyMyComp = lazy(() => import('.\u002FMyComponent'));\n","ts",[2290],{"type":40,"tag":53,"props":2291,"children":2292},{"__ignoreMap":370},[2293,2301,2438,2446],{"type":40,"tag":376,"props":2294,"children":2295},{"class":378,"line":379},[2296],{"type":40,"tag":376,"props":2297,"children":2298},{"style":383},[2299],{"type":46,"value":2300},"\u002F\u002F Named export\n",{"type":40,"tag":376,"props":2302,"children":2303},{"class":378,"line":389},[2304,2310,2315,2320,2325,2330,2335,2340,2345,2349,2353,2358,2362,2366,2371,2376,2380,2386,2390,2395,2400,2405,2409,2414,2418,2423,2428,2433],{"type":40,"tag":376,"props":2305,"children":2307},{"style":2306},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[2308],{"type":46,"value":2309},"const",{"type":40,"tag":376,"props":2311,"children":2312},{"style":1495},[2313],{"type":46,"value":2314}," LazyMyComp ",{"type":40,"tag":376,"props":2316,"children":2317},{"style":399},[2318],{"type":46,"value":2319},"=",{"type":40,"tag":376,"props":2321,"children":2322},{"style":1417},[2323],{"type":46,"value":2324}," lazy",{"type":40,"tag":376,"props":2326,"children":2327},{"style":1495},[2328],{"type":46,"value":2329},"(",{"type":40,"tag":376,"props":2331,"children":2332},{"style":399},[2333],{"type":46,"value":2334},"()",{"type":40,"tag":376,"props":2336,"children":2337},{"style":2306},[2338],{"type":46,"value":2339}," =>",{"type":40,"tag":376,"props":2341,"children":2342},{"style":399},[2343],{"type":46,"value":2344}," import",{"type":40,"tag":376,"props":2346,"children":2347},{"style":1495},[2348],{"type":46,"value":2329},{"type":40,"tag":376,"props":2350,"children":2351},{"style":399},[2352],{"type":46,"value":1298},{"type":40,"tag":376,"props":2354,"children":2355},{"style":405},[2356],{"type":46,"value":2357},".\u002FMyComponent",{"type":40,"tag":376,"props":2359,"children":2360},{"style":399},[2361],{"type":46,"value":1298},{"type":40,"tag":376,"props":2363,"children":2364},{"style":1495},[2365],{"type":46,"value":283},{"type":40,"tag":376,"props":2367,"children":2368},{"style":399},[2369],{"type":46,"value":2370},".",{"type":40,"tag":376,"props":2372,"children":2373},{"style":1417},[2374],{"type":46,"value":2375},"then",{"type":40,"tag":376,"props":2377,"children":2378},{"style":1495},[2379],{"type":46,"value":2329},{"type":40,"tag":376,"props":2381,"children":2383},{"style":2382},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[2384],{"type":46,"value":2385},"m",{"type":40,"tag":376,"props":2387,"children":2388},{"style":2306},[2389],{"type":46,"value":2339},{"type":40,"tag":376,"props":2391,"children":2392},{"style":1495},[2393],{"type":46,"value":2394}," (",{"type":40,"tag":376,"props":2396,"children":2397},{"style":399},[2398],{"type":46,"value":2399},"{",{"type":40,"tag":376,"props":2401,"children":2402},{"style":393},[2403],{"type":46,"value":2404}," default",{"type":40,"tag":376,"props":2406,"children":2407},{"style":399},[2408],{"type":46,"value":402},{"type":40,"tag":376,"props":2410,"children":2411},{"style":1495},[2412],{"type":46,"value":2413}," m",{"type":40,"tag":376,"props":2415,"children":2416},{"style":399},[2417],{"type":46,"value":2370},{"type":40,"tag":376,"props":2419,"children":2420},{"style":1495},[2421],{"type":46,"value":2422},"MyComponent ",{"type":40,"tag":376,"props":2424,"children":2425},{"style":399},[2426],{"type":46,"value":2427},"}",{"type":40,"tag":376,"props":2429,"children":2430},{"style":1495},[2431],{"type":46,"value":2432},")))",{"type":40,"tag":376,"props":2434,"children":2435},{"style":399},[2436],{"type":46,"value":2437},";\n",{"type":40,"tag":376,"props":2439,"children":2440},{"class":378,"line":411},[2441],{"type":40,"tag":376,"props":2442,"children":2443},{"style":383},[2444],{"type":46,"value":2445},"\u002F\u002F Default export\n",{"type":40,"tag":376,"props":2447,"children":2448},{"class":378,"line":426},[2449,2453,2457,2461,2465,2469,2473,2477,2481,2485,2489,2493,2497,2502],{"type":40,"tag":376,"props":2450,"children":2451},{"style":2306},[2452],{"type":46,"value":2309},{"type":40,"tag":376,"props":2454,"children":2455},{"style":1495},[2456],{"type":46,"value":2314},{"type":40,"tag":376,"props":2458,"children":2459},{"style":399},[2460],{"type":46,"value":2319},{"type":40,"tag":376,"props":2462,"children":2463},{"style":1417},[2464],{"type":46,"value":2324},{"type":40,"tag":376,"props":2466,"children":2467},{"style":1495},[2468],{"type":46,"value":2329},{"type":40,"tag":376,"props":2470,"children":2471},{"style":399},[2472],{"type":46,"value":2334},{"type":40,"tag":376,"props":2474,"children":2475},{"style":2306},[2476],{"type":46,"value":2339},{"type":40,"tag":376,"props":2478,"children":2479},{"style":399},[2480],{"type":46,"value":2344},{"type":40,"tag":376,"props":2482,"children":2483},{"style":1495},[2484],{"type":46,"value":2329},{"type":40,"tag":376,"props":2486,"children":2487},{"style":399},[2488],{"type":46,"value":1298},{"type":40,"tag":376,"props":2490,"children":2491},{"style":405},[2492],{"type":46,"value":2357},{"type":40,"tag":376,"props":2494,"children":2495},{"style":399},[2496],{"type":46,"value":1298},{"type":40,"tag":376,"props":2498,"children":2499},{"style":1495},[2500],{"type":46,"value":2501},"))",{"type":40,"tag":376,"props":2503,"children":2504},{"style":399},[2505],{"type":46,"value":2437},{"type":40,"tag":2507,"props":2508,"children":2510},"h3",{"id":2509},"priority-1-moduletsx-highest-impact-always-do-this-first",[2511],{"type":46,"value":2512},"Priority 1: module.tsx (highest impact, always do this first)",{"type":40,"tag":49,"props":2514,"children":2515},{},[2516,2518,2523,2525],{"type":46,"value":2517},"If the entry point is ",{"type":40,"tag":53,"props":2519,"children":2521},{"className":2520},[],[2522],{"type":46,"value":2228},{"type":46,"value":2524},", rename it: ",{"type":40,"tag":53,"props":2526,"children":2528},{"className":2527},[],[2529],{"type":46,"value":2530},"git mv src\u002Fmodule.ts src\u002Fmodule.tsx",{"type":40,"tag":49,"props":2532,"children":2533},{},[2534,2536,2541,2543,2548,2550,2555],{"type":46,"value":2535},"Make ",{"type":40,"tag":53,"props":2537,"children":2539},{"className":2538},[],[2540],{"type":46,"value":148},{"type":46,"value":2542}," import ",{"type":40,"tag":72,"props":2544,"children":2545},{},[2546],{"type":46,"value":2547},"nothing",{"type":46,"value":2549}," from feature code except through ",{"type":40,"tag":53,"props":2551,"children":2553},{"className":2552},[],[2554],{"type":46,"value":181},{"type":46,"value":402},{"type":40,"tag":365,"props":2557,"children":2561},{"className":2558,"code":2559,"language":2560,"meta":370,"style":370},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import React, { lazy, Suspense } from 'react';\nimport { AppPlugin, AppRootProps } from '@grafana\u002Fdata';\nimport { LoadingPlaceholder } from '@grafana\u002Fui';\n\nimport type { MyExtensionProps } from '.\u002Fextensions\u002FMyExtension';  \u002F\u002F import type — erased at compile time\nimport type { JsonData } from '.\u002Ffeatures\u002Fapp\u002Fstate\u002Fslice';\n\n\u002F\u002F Lazy Faro init — keeps @grafana\u002Ffaro-react out of module.js\nlet faroInitialized = false;\nasync function initFaro() {\n  if (faroInitialized) { return; }\n  faroInitialized = true;\n  const { initializeFaro } = await import('faro');\n  initializeFaro();\n}\n\nconst LazyApp = lazy(async () => {\n  await initFaro();\n  return import('.\u002Ffeatures\u002Fapp\u002FApp').then(m => ({ default: m.App }));\n});\n\nfunction App(props: AppRootProps\u003CJsonData>) {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CLazyApp {...props} \u002F>\u003C\u002FSuspense>;\n}\n\nconst LazyMyExtension = lazy(() =>\n  import('.\u002Fextensions\u002FMyExtension').then(m => ({ default: m.MyExtension }))\n);\nfunction MyExtension(props: MyExtensionProps) {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CLazyMyExtension {...props} \u002F>\u003C\u002FSuspense>;\n}\n\nexport const plugin = new AppPlugin\u003CJsonData>().setRootPage(App);\nplugin.exposeComponent({ id: 'my-plugin\u002Fmy-extension\u002Fv1', title: 'My Extension', component: MyExtension });\n","tsx",[2562],{"type":40,"tag":53,"props":2563,"children":2564},{"__ignoreMap":370},[2565,2627,2677,2718,2725,2777,2822,2829,2837,2863,2890,2930,2952,3011,3027,3035,3042,3083,3103,3197,3212,3219,3268,3347,3354,3361,3394,3481,3493,3530,3599,3607,3615,3682],{"type":40,"tag":376,"props":2566,"children":2567},{"class":378,"line":379},[2568,2573,2578,2583,2588,2592,2596,2601,2606,2611,2615,2619,2623],{"type":40,"tag":376,"props":2569,"children":2570},{"style":1105},[2571],{"type":46,"value":2572},"import",{"type":40,"tag":376,"props":2574,"children":2575},{"style":1495},[2576],{"type":46,"value":2577}," React",{"type":40,"tag":376,"props":2579,"children":2580},{"style":399},[2581],{"type":46,"value":2582},",",{"type":40,"tag":376,"props":2584,"children":2585},{"style":399},[2586],{"type":46,"value":2587}," {",{"type":40,"tag":376,"props":2589,"children":2590},{"style":1495},[2591],{"type":46,"value":2324},{"type":40,"tag":376,"props":2593,"children":2594},{"style":399},[2595],{"type":46,"value":2582},{"type":40,"tag":376,"props":2597,"children":2598},{"style":1495},[2599],{"type":46,"value":2600}," Suspense",{"type":40,"tag":376,"props":2602,"children":2603},{"style":399},[2604],{"type":46,"value":2605}," }",{"type":40,"tag":376,"props":2607,"children":2608},{"style":1105},[2609],{"type":46,"value":2610}," from",{"type":40,"tag":376,"props":2612,"children":2613},{"style":399},[2614],{"type":46,"value":1288},{"type":40,"tag":376,"props":2616,"children":2617},{"style":405},[2618],{"type":46,"value":18},{"type":40,"tag":376,"props":2620,"children":2621},{"style":399},[2622],{"type":46,"value":1298},{"type":40,"tag":376,"props":2624,"children":2625},{"style":399},[2626],{"type":46,"value":2437},{"type":40,"tag":376,"props":2628,"children":2629},{"class":378,"line":389},[2630,2634,2638,2643,2647,2652,2656,2660,2664,2669,2673],{"type":40,"tag":376,"props":2631,"children":2632},{"style":1105},[2633],{"type":46,"value":2572},{"type":40,"tag":376,"props":2635,"children":2636},{"style":399},[2637],{"type":46,"value":2587},{"type":40,"tag":376,"props":2639,"children":2640},{"style":1495},[2641],{"type":46,"value":2642}," AppPlugin",{"type":40,"tag":376,"props":2644,"children":2645},{"style":399},[2646],{"type":46,"value":2582},{"type":40,"tag":376,"props":2648,"children":2649},{"style":1495},[2650],{"type":46,"value":2651}," AppRootProps",{"type":40,"tag":376,"props":2653,"children":2654},{"style":399},[2655],{"type":46,"value":2605},{"type":40,"tag":376,"props":2657,"children":2658},{"style":1105},[2659],{"type":46,"value":2610},{"type":40,"tag":376,"props":2661,"children":2662},{"style":399},[2663],{"type":46,"value":1288},{"type":40,"tag":376,"props":2665,"children":2666},{"style":405},[2667],{"type":46,"value":2668},"@grafana\u002Fdata",{"type":40,"tag":376,"props":2670,"children":2671},{"style":399},[2672],{"type":46,"value":1298},{"type":40,"tag":376,"props":2674,"children":2675},{"style":399},[2676],{"type":46,"value":2437},{"type":40,"tag":376,"props":2678,"children":2679},{"class":378,"line":411},[2680,2684,2688,2693,2697,2701,2705,2710,2714],{"type":40,"tag":376,"props":2681,"children":2682},{"style":1105},[2683],{"type":46,"value":2572},{"type":40,"tag":376,"props":2685,"children":2686},{"style":399},[2687],{"type":46,"value":2587},{"type":40,"tag":376,"props":2689,"children":2690},{"style":1495},[2691],{"type":46,"value":2692}," LoadingPlaceholder",{"type":40,"tag":376,"props":2694,"children":2695},{"style":399},[2696],{"type":46,"value":2605},{"type":40,"tag":376,"props":2698,"children":2699},{"style":1105},[2700],{"type":46,"value":2610},{"type":40,"tag":376,"props":2702,"children":2703},{"style":399},[2704],{"type":46,"value":1288},{"type":40,"tag":376,"props":2706,"children":2707},{"style":405},[2708],{"type":46,"value":2709},"@grafana\u002Fui",{"type":40,"tag":376,"props":2711,"children":2712},{"style":399},[2713],{"type":46,"value":1298},{"type":40,"tag":376,"props":2715,"children":2716},{"style":399},[2717],{"type":46,"value":2437},{"type":40,"tag":376,"props":2719,"children":2720},{"class":378,"line":426},[2721],{"type":40,"tag":376,"props":2722,"children":2723},{"emptyLinePlaceholder":497},[2724],{"type":46,"value":500},{"type":40,"tag":376,"props":2726,"children":2727},{"class":378,"line":439},[2728,2732,2737,2741,2746,2750,2754,2758,2763,2767,2772],{"type":40,"tag":376,"props":2729,"children":2730},{"style":1105},[2731],{"type":46,"value":2572},{"type":40,"tag":376,"props":2733,"children":2734},{"style":1105},[2735],{"type":46,"value":2736}," type",{"type":40,"tag":376,"props":2738,"children":2739},{"style":399},[2740],{"type":46,"value":2587},{"type":40,"tag":376,"props":2742,"children":2743},{"style":1495},[2744],{"type":46,"value":2745}," MyExtensionProps",{"type":40,"tag":376,"props":2747,"children":2748},{"style":399},[2749],{"type":46,"value":2605},{"type":40,"tag":376,"props":2751,"children":2752},{"style":1105},[2753],{"type":46,"value":2610},{"type":40,"tag":376,"props":2755,"children":2756},{"style":399},[2757],{"type":46,"value":1288},{"type":40,"tag":376,"props":2759,"children":2760},{"style":405},[2761],{"type":46,"value":2762},".\u002Fextensions\u002FMyExtension",{"type":40,"tag":376,"props":2764,"children":2765},{"style":399},[2766],{"type":46,"value":1298},{"type":40,"tag":376,"props":2768,"children":2769},{"style":399},[2770],{"type":46,"value":2771},";",{"type":40,"tag":376,"props":2773,"children":2774},{"style":383},[2775],{"type":46,"value":2776},"  \u002F\u002F import type — erased at compile time\n",{"type":40,"tag":376,"props":2778,"children":2779},{"class":378,"line":452},[2780,2784,2788,2792,2797,2801,2805,2809,2814,2818],{"type":40,"tag":376,"props":2781,"children":2782},{"style":1105},[2783],{"type":46,"value":2572},{"type":40,"tag":376,"props":2785,"children":2786},{"style":1105},[2787],{"type":46,"value":2736},{"type":40,"tag":376,"props":2789,"children":2790},{"style":399},[2791],{"type":46,"value":2587},{"type":40,"tag":376,"props":2793,"children":2794},{"style":1495},[2795],{"type":46,"value":2796}," JsonData",{"type":40,"tag":376,"props":2798,"children":2799},{"style":399},[2800],{"type":46,"value":2605},{"type":40,"tag":376,"props":2802,"children":2803},{"style":1105},[2804],{"type":46,"value":2610},{"type":40,"tag":376,"props":2806,"children":2807},{"style":399},[2808],{"type":46,"value":1288},{"type":40,"tag":376,"props":2810,"children":2811},{"style":405},[2812],{"type":46,"value":2813},".\u002Ffeatures\u002Fapp\u002Fstate\u002Fslice",{"type":40,"tag":376,"props":2815,"children":2816},{"style":399},[2817],{"type":46,"value":1298},{"type":40,"tag":376,"props":2819,"children":2820},{"style":399},[2821],{"type":46,"value":2437},{"type":40,"tag":376,"props":2823,"children":2824},{"class":378,"line":480},[2825],{"type":40,"tag":376,"props":2826,"children":2827},{"emptyLinePlaceholder":497},[2828],{"type":46,"value":500},{"type":40,"tag":376,"props":2830,"children":2831},{"class":378,"line":493},[2832],{"type":40,"tag":376,"props":2833,"children":2834},{"style":383},[2835],{"type":46,"value":2836},"\u002F\u002F Lazy Faro init — keeps @grafana\u002Ffaro-react out of module.js\n",{"type":40,"tag":376,"props":2838,"children":2839},{"class":378,"line":503},[2840,2845,2850,2854,2859],{"type":40,"tag":376,"props":2841,"children":2842},{"style":2306},[2843],{"type":46,"value":2844},"let",{"type":40,"tag":376,"props":2846,"children":2847},{"style":1495},[2848],{"type":46,"value":2849}," faroInitialized ",{"type":40,"tag":376,"props":2851,"children":2852},{"style":399},[2853],{"type":46,"value":2319},{"type":40,"tag":376,"props":2855,"children":2856},{"style":415},[2857],{"type":46,"value":2858}," false",{"type":40,"tag":376,"props":2860,"children":2861},{"style":399},[2862],{"type":46,"value":2437},{"type":40,"tag":376,"props":2864,"children":2865},{"class":378,"line":516},[2866,2871,2876,2881,2885],{"type":40,"tag":376,"props":2867,"children":2868},{"style":2306},[2869],{"type":46,"value":2870},"async",{"type":40,"tag":376,"props":2872,"children":2873},{"style":2306},[2874],{"type":46,"value":2875}," function",{"type":40,"tag":376,"props":2877,"children":2878},{"style":1417},[2879],{"type":46,"value":2880}," initFaro",{"type":40,"tag":376,"props":2882,"children":2883},{"style":399},[2884],{"type":46,"value":2334},{"type":40,"tag":376,"props":2886,"children":2887},{"style":399},[2888],{"type":46,"value":2889}," {\n",{"type":40,"tag":376,"props":2891,"children":2892},{"class":378,"line":529},[2893,2898,2902,2907,2912,2916,2921,2925],{"type":40,"tag":376,"props":2894,"children":2895},{"style":1105},[2896],{"type":46,"value":2897},"  if",{"type":40,"tag":376,"props":2899,"children":2900},{"style":393},[2901],{"type":46,"value":2394},{"type":40,"tag":376,"props":2903,"children":2904},{"style":1495},[2905],{"type":46,"value":2906},"faroInitialized",{"type":40,"tag":376,"props":2908,"children":2909},{"style":393},[2910],{"type":46,"value":2911},") ",{"type":40,"tag":376,"props":2913,"children":2914},{"style":399},[2915],{"type":46,"value":2399},{"type":40,"tag":376,"props":2917,"children":2918},{"style":1105},[2919],{"type":46,"value":2920}," return",{"type":40,"tag":376,"props":2922,"children":2923},{"style":399},[2924],{"type":46,"value":2771},{"type":40,"tag":376,"props":2926,"children":2927},{"style":399},[2928],{"type":46,"value":2929}," }\n",{"type":40,"tag":376,"props":2931,"children":2932},{"class":378,"line":547},[2933,2938,2943,2948],{"type":40,"tag":376,"props":2934,"children":2935},{"style":1495},[2936],{"type":46,"value":2937},"  faroInitialized",{"type":40,"tag":376,"props":2939,"children":2940},{"style":399},[2941],{"type":46,"value":2942}," =",{"type":40,"tag":376,"props":2944,"children":2945},{"style":415},[2946],{"type":46,"value":2947}," true",{"type":40,"tag":376,"props":2949,"children":2950},{"style":399},[2951],{"type":46,"value":2437},{"type":40,"tag":376,"props":2953,"children":2954},{"class":378,"line":560},[2955,2960,2964,2969,2973,2977,2982,2986,2990,2994,2999,3003,3007],{"type":40,"tag":376,"props":2956,"children":2957},{"style":2306},[2958],{"type":46,"value":2959},"  const",{"type":40,"tag":376,"props":2961,"children":2962},{"style":399},[2963],{"type":46,"value":2587},{"type":40,"tag":376,"props":2965,"children":2966},{"style":1495},[2967],{"type":46,"value":2968}," initializeFaro",{"type":40,"tag":376,"props":2970,"children":2971},{"style":399},[2972],{"type":46,"value":2605},{"type":40,"tag":376,"props":2974,"children":2975},{"style":399},[2976],{"type":46,"value":2942},{"type":40,"tag":376,"props":2978,"children":2979},{"style":1105},[2980],{"type":46,"value":2981}," await",{"type":40,"tag":376,"props":2983,"children":2984},{"style":399},[2985],{"type":46,"value":2344},{"type":40,"tag":376,"props":2987,"children":2988},{"style":393},[2989],{"type":46,"value":2329},{"type":40,"tag":376,"props":2991,"children":2992},{"style":399},[2993],{"type":46,"value":1298},{"type":40,"tag":376,"props":2995,"children":2996},{"style":405},[2997],{"type":46,"value":2998},"faro",{"type":40,"tag":376,"props":3000,"children":3001},{"style":399},[3002],{"type":46,"value":1298},{"type":40,"tag":376,"props":3004,"children":3005},{"style":393},[3006],{"type":46,"value":283},{"type":40,"tag":376,"props":3008,"children":3009},{"style":399},[3010],{"type":46,"value":2437},{"type":40,"tag":376,"props":3012,"children":3013},{"class":378,"line":578},[3014,3019,3023],{"type":40,"tag":376,"props":3015,"children":3016},{"style":1417},[3017],{"type":46,"value":3018},"  initializeFaro",{"type":40,"tag":376,"props":3020,"children":3021},{"style":393},[3022],{"type":46,"value":2334},{"type":40,"tag":376,"props":3024,"children":3025},{"style":399},[3026],{"type":46,"value":2437},{"type":40,"tag":376,"props":3028,"children":3029},{"class":378,"line":595},[3030],{"type":40,"tag":376,"props":3031,"children":3032},{"style":399},[3033],{"type":46,"value":3034},"}\n",{"type":40,"tag":376,"props":3036,"children":3037},{"class":378,"line":27},[3038],{"type":40,"tag":376,"props":3039,"children":3040},{"emptyLinePlaceholder":497},[3041],{"type":46,"value":500},{"type":40,"tag":376,"props":3043,"children":3044},{"class":378,"line":629},[3045,3049,3054,3058,3062,3066,3070,3075,3079],{"type":40,"tag":376,"props":3046,"children":3047},{"style":2306},[3048],{"type":46,"value":2309},{"type":40,"tag":376,"props":3050,"children":3051},{"style":1495},[3052],{"type":46,"value":3053}," LazyApp ",{"type":40,"tag":376,"props":3055,"children":3056},{"style":399},[3057],{"type":46,"value":2319},{"type":40,"tag":376,"props":3059,"children":3060},{"style":1417},[3061],{"type":46,"value":2324},{"type":40,"tag":376,"props":3063,"children":3064},{"style":1495},[3065],{"type":46,"value":2329},{"type":40,"tag":376,"props":3067,"children":3068},{"style":2306},[3069],{"type":46,"value":2870},{"type":40,"tag":376,"props":3071,"children":3072},{"style":399},[3073],{"type":46,"value":3074}," ()",{"type":40,"tag":376,"props":3076,"children":3077},{"style":2306},[3078],{"type":46,"value":2339},{"type":40,"tag":376,"props":3080,"children":3081},{"style":399},[3082],{"type":46,"value":2889},{"type":40,"tag":376,"props":3084,"children":3085},{"class":378,"line":642},[3086,3091,3095,3099],{"type":40,"tag":376,"props":3087,"children":3088},{"style":1105},[3089],{"type":46,"value":3090},"  await",{"type":40,"tag":376,"props":3092,"children":3093},{"style":1417},[3094],{"type":46,"value":2880},{"type":40,"tag":376,"props":3096,"children":3097},{"style":393},[3098],{"type":46,"value":2334},{"type":40,"tag":376,"props":3100,"children":3101},{"style":399},[3102],{"type":46,"value":2437},{"type":40,"tag":376,"props":3104,"children":3105},{"class":378,"line":665},[3106,3111,3115,3119,3123,3128,3132,3136,3140,3144,3148,3152,3156,3160,3164,3168,3172,3176,3180,3185,3189,3193],{"type":40,"tag":376,"props":3107,"children":3108},{"style":1105},[3109],{"type":46,"value":3110},"  return",{"type":40,"tag":376,"props":3112,"children":3113},{"style":399},[3114],{"type":46,"value":2344},{"type":40,"tag":376,"props":3116,"children":3117},{"style":393},[3118],{"type":46,"value":2329},{"type":40,"tag":376,"props":3120,"children":3121},{"style":399},[3122],{"type":46,"value":1298},{"type":40,"tag":376,"props":3124,"children":3125},{"style":405},[3126],{"type":46,"value":3127},".\u002Ffeatures\u002Fapp\u002FApp",{"type":40,"tag":376,"props":3129,"children":3130},{"style":399},[3131],{"type":46,"value":1298},{"type":40,"tag":376,"props":3133,"children":3134},{"style":393},[3135],{"type":46,"value":283},{"type":40,"tag":376,"props":3137,"children":3138},{"style":399},[3139],{"type":46,"value":2370},{"type":40,"tag":376,"props":3141,"children":3142},{"style":1417},[3143],{"type":46,"value":2375},{"type":40,"tag":376,"props":3145,"children":3146},{"style":393},[3147],{"type":46,"value":2329},{"type":40,"tag":376,"props":3149,"children":3150},{"style":2382},[3151],{"type":46,"value":2385},{"type":40,"tag":376,"props":3153,"children":3154},{"style":2306},[3155],{"type":46,"value":2339},{"type":40,"tag":376,"props":3157,"children":3158},{"style":393},[3159],{"type":46,"value":2394},{"type":40,"tag":376,"props":3161,"children":3162},{"style":399},[3163],{"type":46,"value":2399},{"type":40,"tag":376,"props":3165,"children":3166},{"style":393},[3167],{"type":46,"value":2404},{"type":40,"tag":376,"props":3169,"children":3170},{"style":399},[3171],{"type":46,"value":402},{"type":40,"tag":376,"props":3173,"children":3174},{"style":1495},[3175],{"type":46,"value":2413},{"type":40,"tag":376,"props":3177,"children":3178},{"style":399},[3179],{"type":46,"value":2370},{"type":40,"tag":376,"props":3181,"children":3182},{"style":1495},[3183],{"type":46,"value":3184},"App",{"type":40,"tag":376,"props":3186,"children":3187},{"style":399},[3188],{"type":46,"value":2605},{"type":40,"tag":376,"props":3190,"children":3191},{"style":393},[3192],{"type":46,"value":2501},{"type":40,"tag":376,"props":3194,"children":3195},{"style":399},[3196],{"type":46,"value":2437},{"type":40,"tag":376,"props":3198,"children":3199},{"class":378,"line":686},[3200,3204,3208],{"type":40,"tag":376,"props":3201,"children":3202},{"style":399},[3203],{"type":46,"value":2427},{"type":40,"tag":376,"props":3205,"children":3206},{"style":1495},[3207],{"type":46,"value":283},{"type":40,"tag":376,"props":3209,"children":3210},{"style":399},[3211],{"type":46,"value":2437},{"type":40,"tag":376,"props":3213,"children":3214},{"class":378,"line":699},[3215],{"type":40,"tag":376,"props":3216,"children":3217},{"emptyLinePlaceholder":497},[3218],{"type":46,"value":500},{"type":40,"tag":376,"props":3220,"children":3221},{"class":378,"line":717},[3222,3227,3232,3236,3241,3245,3249,3254,3259,3264],{"type":40,"tag":376,"props":3223,"children":3224},{"style":2306},[3225],{"type":46,"value":3226},"function",{"type":40,"tag":376,"props":3228,"children":3229},{"style":1417},[3230],{"type":46,"value":3231}," App",{"type":40,"tag":376,"props":3233,"children":3234},{"style":399},[3235],{"type":46,"value":2329},{"type":40,"tag":376,"props":3237,"children":3238},{"style":2382},[3239],{"type":46,"value":3240},"props",{"type":40,"tag":376,"props":3242,"children":3243},{"style":399},[3244],{"type":46,"value":402},{"type":40,"tag":376,"props":3246,"children":3247},{"style":1275},[3248],{"type":46,"value":2651},{"type":40,"tag":376,"props":3250,"children":3251},{"style":399},[3252],{"type":46,"value":3253},"\u003C",{"type":40,"tag":376,"props":3255,"children":3256},{"style":1275},[3257],{"type":46,"value":3258},"JsonData",{"type":40,"tag":376,"props":3260,"children":3261},{"style":399},[3262],{"type":46,"value":3263},">)",{"type":40,"tag":376,"props":3265,"children":3266},{"style":399},[3267],{"type":46,"value":2889},{"type":40,"tag":376,"props":3269,"children":3270},{"class":378,"line":739},[3271,3275,3280,3285,3290,3295,3300,3305,3309,3314,3319,3324,3329,3333,3338,3342],{"type":40,"tag":376,"props":3272,"children":3273},{"style":1105},[3274],{"type":46,"value":3110},{"type":40,"tag":376,"props":3276,"children":3277},{"style":399},[3278],{"type":46,"value":3279}," \u003C",{"type":40,"tag":376,"props":3281,"children":3282},{"style":1275},[3283],{"type":46,"value":3284},"Suspense",{"type":40,"tag":376,"props":3286,"children":3287},{"style":2306},[3288],{"type":46,"value":3289}," fallback",{"type":40,"tag":376,"props":3291,"children":3292},{"style":399},[3293],{"type":46,"value":3294},"={\u003C",{"type":40,"tag":376,"props":3296,"children":3297},{"style":1275},[3298],{"type":46,"value":3299},"LoadingPlaceholder",{"type":40,"tag":376,"props":3301,"children":3302},{"style":2306},[3303],{"type":46,"value":3304}," text",{"type":40,"tag":376,"props":3306,"children":3307},{"style":399},[3308],{"type":46,"value":2319},{"type":40,"tag":376,"props":3310,"children":3311},{"style":399},[3312],{"type":46,"value":3313},"\"\"",{"type":40,"tag":376,"props":3315,"children":3316},{"style":399},[3317],{"type":46,"value":3318}," \u002F>}>\u003C",{"type":40,"tag":376,"props":3320,"children":3321},{"style":1275},[3322],{"type":46,"value":3323},"LazyApp",{"type":40,"tag":376,"props":3325,"children":3326},{"style":399},[3327],{"type":46,"value":3328}," {...",{"type":40,"tag":376,"props":3330,"children":3331},{"style":1495},[3332],{"type":46,"value":3240},{"type":40,"tag":376,"props":3334,"children":3335},{"style":399},[3336],{"type":46,"value":3337},"} \u002F>\u003C\u002F",{"type":40,"tag":376,"props":3339,"children":3340},{"style":1275},[3341],{"type":46,"value":3284},{"type":40,"tag":376,"props":3343,"children":3344},{"style":399},[3345],{"type":46,"value":3346},">;\n",{"type":40,"tag":376,"props":3348,"children":3349},{"class":378,"line":757},[3350],{"type":40,"tag":376,"props":3351,"children":3352},{"style":399},[3353],{"type":46,"value":3034},{"type":40,"tag":376,"props":3355,"children":3356},{"class":378,"line":777},[3357],{"type":40,"tag":376,"props":3358,"children":3359},{"emptyLinePlaceholder":497},[3360],{"type":46,"value":500},{"type":40,"tag":376,"props":3362,"children":3363},{"class":378,"line":1192},[3364,3368,3373,3377,3381,3385,3389],{"type":40,"tag":376,"props":3365,"children":3366},{"style":2306},[3367],{"type":46,"value":2309},{"type":40,"tag":376,"props":3369,"children":3370},{"style":1495},[3371],{"type":46,"value":3372}," LazyMyExtension ",{"type":40,"tag":376,"props":3374,"children":3375},{"style":399},[3376],{"type":46,"value":2319},{"type":40,"tag":376,"props":3378,"children":3379},{"style":1417},[3380],{"type":46,"value":2324},{"type":40,"tag":376,"props":3382,"children":3383},{"style":1495},[3384],{"type":46,"value":2329},{"type":40,"tag":376,"props":3386,"children":3387},{"style":399},[3388],{"type":46,"value":2334},{"type":40,"tag":376,"props":3390,"children":3391},{"style":2306},[3392],{"type":46,"value":3393}," =>\n",{"type":40,"tag":376,"props":3395,"children":3397},{"class":378,"line":3396},27,[3398,3403,3407,3411,3415,3419,3423,3427,3431,3435,3439,3443,3447,3451,3455,3459,3463,3467,3472,3476],{"type":40,"tag":376,"props":3399,"children":3400},{"style":399},[3401],{"type":46,"value":3402},"  import",{"type":40,"tag":376,"props":3404,"children":3405},{"style":1495},[3406],{"type":46,"value":2329},{"type":40,"tag":376,"props":3408,"children":3409},{"style":399},[3410],{"type":46,"value":1298},{"type":40,"tag":376,"props":3412,"children":3413},{"style":405},[3414],{"type":46,"value":2762},{"type":40,"tag":376,"props":3416,"children":3417},{"style":399},[3418],{"type":46,"value":1298},{"type":40,"tag":376,"props":3420,"children":3421},{"style":1495},[3422],{"type":46,"value":283},{"type":40,"tag":376,"props":3424,"children":3425},{"style":399},[3426],{"type":46,"value":2370},{"type":40,"tag":376,"props":3428,"children":3429},{"style":1417},[3430],{"type":46,"value":2375},{"type":40,"tag":376,"props":3432,"children":3433},{"style":1495},[3434],{"type":46,"value":2329},{"type":40,"tag":376,"props":3436,"children":3437},{"style":2382},[3438],{"type":46,"value":2385},{"type":40,"tag":376,"props":3440,"children":3441},{"style":2306},[3442],{"type":46,"value":2339},{"type":40,"tag":376,"props":3444,"children":3445},{"style":1495},[3446],{"type":46,"value":2394},{"type":40,"tag":376,"props":3448,"children":3449},{"style":399},[3450],{"type":46,"value":2399},{"type":40,"tag":376,"props":3452,"children":3453},{"style":393},[3454],{"type":46,"value":2404},{"type":40,"tag":376,"props":3456,"children":3457},{"style":399},[3458],{"type":46,"value":402},{"type":40,"tag":376,"props":3460,"children":3461},{"style":1495},[3462],{"type":46,"value":2413},{"type":40,"tag":376,"props":3464,"children":3465},{"style":399},[3466],{"type":46,"value":2370},{"type":40,"tag":376,"props":3468,"children":3469},{"style":1495},[3470],{"type":46,"value":3471},"MyExtension ",{"type":40,"tag":376,"props":3473,"children":3474},{"style":399},[3475],{"type":46,"value":2427},{"type":40,"tag":376,"props":3477,"children":3478},{"style":1495},[3479],{"type":46,"value":3480},"))\n",{"type":40,"tag":376,"props":3482,"children":3484},{"class":378,"line":3483},28,[3485,3489],{"type":40,"tag":376,"props":3486,"children":3487},{"style":1495},[3488],{"type":46,"value":283},{"type":40,"tag":376,"props":3490,"children":3491},{"style":399},[3492],{"type":46,"value":2437},{"type":40,"tag":376,"props":3494,"children":3496},{"class":378,"line":3495},29,[3497,3501,3506,3510,3514,3518,3522,3526],{"type":40,"tag":376,"props":3498,"children":3499},{"style":2306},[3500],{"type":46,"value":3226},{"type":40,"tag":376,"props":3502,"children":3503},{"style":1417},[3504],{"type":46,"value":3505}," MyExtension",{"type":40,"tag":376,"props":3507,"children":3508},{"style":399},[3509],{"type":46,"value":2329},{"type":40,"tag":376,"props":3511,"children":3512},{"style":2382},[3513],{"type":46,"value":3240},{"type":40,"tag":376,"props":3515,"children":3516},{"style":399},[3517],{"type":46,"value":402},{"type":40,"tag":376,"props":3519,"children":3520},{"style":1275},[3521],{"type":46,"value":2745},{"type":40,"tag":376,"props":3523,"children":3524},{"style":399},[3525],{"type":46,"value":283},{"type":40,"tag":376,"props":3527,"children":3528},{"style":399},[3529],{"type":46,"value":2889},{"type":40,"tag":376,"props":3531,"children":3533},{"class":378,"line":3532},30,[3534,3538,3542,3546,3550,3554,3558,3562,3566,3570,3574,3579,3583,3587,3591,3595],{"type":40,"tag":376,"props":3535,"children":3536},{"style":1105},[3537],{"type":46,"value":3110},{"type":40,"tag":376,"props":3539,"children":3540},{"style":399},[3541],{"type":46,"value":3279},{"type":40,"tag":376,"props":3543,"children":3544},{"style":1275},[3545],{"type":46,"value":3284},{"type":40,"tag":376,"props":3547,"children":3548},{"style":2306},[3549],{"type":46,"value":3289},{"type":40,"tag":376,"props":3551,"children":3552},{"style":399},[3553],{"type":46,"value":3294},{"type":40,"tag":376,"props":3555,"children":3556},{"style":1275},[3557],{"type":46,"value":3299},{"type":40,"tag":376,"props":3559,"children":3560},{"style":2306},[3561],{"type":46,"value":3304},{"type":40,"tag":376,"props":3563,"children":3564},{"style":399},[3565],{"type":46,"value":2319},{"type":40,"tag":376,"props":3567,"children":3568},{"style":399},[3569],{"type":46,"value":3313},{"type":40,"tag":376,"props":3571,"children":3572},{"style":399},[3573],{"type":46,"value":3318},{"type":40,"tag":376,"props":3575,"children":3576},{"style":1275},[3577],{"type":46,"value":3578},"LazyMyExtension",{"type":40,"tag":376,"props":3580,"children":3581},{"style":399},[3582],{"type":46,"value":3328},{"type":40,"tag":376,"props":3584,"children":3585},{"style":1495},[3586],{"type":46,"value":3240},{"type":40,"tag":376,"props":3588,"children":3589},{"style":399},[3590],{"type":46,"value":3337},{"type":40,"tag":376,"props":3592,"children":3593},{"style":1275},[3594],{"type":46,"value":3284},{"type":40,"tag":376,"props":3596,"children":3597},{"style":399},[3598],{"type":46,"value":3346},{"type":40,"tag":376,"props":3600,"children":3602},{"class":378,"line":3601},31,[3603],{"type":40,"tag":376,"props":3604,"children":3605},{"style":399},[3606],{"type":46,"value":3034},{"type":40,"tag":376,"props":3608,"children":3610},{"class":378,"line":3609},32,[3611],{"type":40,"tag":376,"props":3612,"children":3613},{"emptyLinePlaceholder":497},[3614],{"type":46,"value":500},{"type":40,"tag":376,"props":3616,"children":3618},{"class":378,"line":3617},33,[3619,3624,3629,3634,3638,3643,3647,3651,3655,3660,3664,3668,3673,3678],{"type":40,"tag":376,"props":3620,"children":3621},{"style":1105},[3622],{"type":46,"value":3623},"export",{"type":40,"tag":376,"props":3625,"children":3626},{"style":2306},[3627],{"type":46,"value":3628}," const",{"type":40,"tag":376,"props":3630,"children":3631},{"style":1495},[3632],{"type":46,"value":3633}," plugin ",{"type":40,"tag":376,"props":3635,"children":3636},{"style":399},[3637],{"type":46,"value":2319},{"type":40,"tag":376,"props":3639,"children":3640},{"style":399},[3641],{"type":46,"value":3642}," new",{"type":40,"tag":376,"props":3644,"children":3645},{"style":1417},[3646],{"type":46,"value":2642},{"type":40,"tag":376,"props":3648,"children":3649},{"style":399},[3650],{"type":46,"value":3253},{"type":40,"tag":376,"props":3652,"children":3653},{"style":1275},[3654],{"type":46,"value":3258},{"type":40,"tag":376,"props":3656,"children":3657},{"style":399},[3658],{"type":46,"value":3659},">",{"type":40,"tag":376,"props":3661,"children":3662},{"style":1495},[3663],{"type":46,"value":2334},{"type":40,"tag":376,"props":3665,"children":3666},{"style":399},[3667],{"type":46,"value":2370},{"type":40,"tag":376,"props":3669,"children":3670},{"style":1417},[3671],{"type":46,"value":3672},"setRootPage",{"type":40,"tag":376,"props":3674,"children":3675},{"style":1495},[3676],{"type":46,"value":3677},"(App)",{"type":40,"tag":376,"props":3679,"children":3680},{"style":399},[3681],{"type":46,"value":2437},{"type":40,"tag":376,"props":3683,"children":3685},{"class":378,"line":3684},34,[3686,3691,3695,3700,3704,3708,3713,3717,3721,3726,3730,3734,3739,3743,3747,3752,3756,3760,3765,3769,3774,3778,3782],{"type":40,"tag":376,"props":3687,"children":3688},{"style":1495},[3689],{"type":46,"value":3690},"plugin",{"type":40,"tag":376,"props":3692,"children":3693},{"style":399},[3694],{"type":46,"value":2370},{"type":40,"tag":376,"props":3696,"children":3697},{"style":1417},[3698],{"type":46,"value":3699},"exposeComponent",{"type":40,"tag":376,"props":3701,"children":3702},{"style":1495},[3703],{"type":46,"value":2329},{"type":40,"tag":376,"props":3705,"children":3706},{"style":399},[3707],{"type":46,"value":2399},{"type":40,"tag":376,"props":3709,"children":3710},{"style":393},[3711],{"type":46,"value":3712}," id",{"type":40,"tag":376,"props":3714,"children":3715},{"style":399},[3716],{"type":46,"value":402},{"type":40,"tag":376,"props":3718,"children":3719},{"style":399},[3720],{"type":46,"value":1288},{"type":40,"tag":376,"props":3722,"children":3723},{"style":405},[3724],{"type":46,"value":3725},"my-plugin\u002Fmy-extension\u002Fv1",{"type":40,"tag":376,"props":3727,"children":3728},{"style":399},[3729],{"type":46,"value":1298},{"type":40,"tag":376,"props":3731,"children":3732},{"style":399},[3733],{"type":46,"value":2582},{"type":40,"tag":376,"props":3735,"children":3736},{"style":393},[3737],{"type":46,"value":3738}," title",{"type":40,"tag":376,"props":3740,"children":3741},{"style":399},[3742],{"type":46,"value":402},{"type":40,"tag":376,"props":3744,"children":3745},{"style":399},[3746],{"type":46,"value":1288},{"type":40,"tag":376,"props":3748,"children":3749},{"style":405},[3750],{"type":46,"value":3751},"My Extension",{"type":40,"tag":376,"props":3753,"children":3754},{"style":399},[3755],{"type":46,"value":1298},{"type":40,"tag":376,"props":3757,"children":3758},{"style":399},[3759],{"type":46,"value":2582},{"type":40,"tag":376,"props":3761,"children":3762},{"style":393},[3763],{"type":46,"value":3764}," component",{"type":40,"tag":376,"props":3766,"children":3767},{"style":399},[3768],{"type":46,"value":402},{"type":40,"tag":376,"props":3770,"children":3771},{"style":1495},[3772],{"type":46,"value":3773}," MyExtension ",{"type":40,"tag":376,"props":3775,"children":3776},{"style":399},[3777],{"type":46,"value":2427},{"type":40,"tag":376,"props":3779,"children":3780},{"style":1495},[3781],{"type":46,"value":283},{"type":40,"tag":376,"props":3783,"children":3784},{"style":399},[3785],{"type":46,"value":2437},{"type":40,"tag":49,"props":3787,"children":3788},{},[3789],{"type":40,"tag":72,"props":3790,"children":3791},{},[3792],{"type":46,"value":3793},"Key details:",{"type":40,"tag":3795,"props":3796,"children":3797},"ul",{},[3798,3810,3839],{"type":40,"tag":3799,"props":3800,"children":3801},"li",{},[3802,3808],{"type":40,"tag":53,"props":3803,"children":3805},{"className":3804},[],[3806],{"type":46,"value":3807},"import type",{"type":46,"value":3809}," for props prevents webpack from following the import into the eager bundle",{"type":40,"tag":3799,"props":3811,"children":3812},{},[3813,3815,3821,3823,3829,3831,3837],{"type":46,"value":3814},"Use ",{"type":40,"tag":53,"props":3816,"children":3818},{"className":3817},[],[3819],{"type":46,"value":3820},"new AppPlugin\u003CJsonData>()",{"type":46,"value":3822}," if App uses ",{"type":40,"tag":53,"props":3824,"children":3826},{"className":3825},[],[3827],{"type":46,"value":3828},"AppRootProps\u003CJsonData>",{"type":46,"value":3830}," — without the generic, ",{"type":40,"tag":53,"props":3832,"children":3834},{"className":3833},[],[3835],{"type":46,"value":3836},"setRootPage()",{"type":46,"value":3838}," type won't match",{"type":40,"tag":3799,"props":3840,"children":3841},{},[3842,3844,3850],{"type":46,"value":3843},"Remove any ",{"type":40,"tag":53,"props":3845,"children":3847},{"className":3846},[],[3848],{"type":46,"value":3849},"App as unknown as ComponentClass\u003CAppRootProps>",{"type":46,"value":3851}," cast — the lazy wrapper is a valid function component",{"type":40,"tag":49,"props":3853,"children":3854},{},[3855,3860,3861,3866],{"type":40,"tag":72,"props":3856,"children":3857},{},[3858],{"type":46,"value":3859},"Expected impact:",{"type":46,"value":1234},{"type":40,"tag":53,"props":3862,"children":3864},{"className":3863},[],[3865],{"type":46,"value":58},{"type":46,"value":3867}," drops from MB range to ~50–200 KB.",{"type":40,"tag":49,"props":3869,"children":3870},{},[3871,3876,3878,3883,3885,3891,3893,3899,3901,3907,3909,3915,3917,3923],{"type":40,"tag":72,"props":3872,"children":3873},{},[3874],{"type":46,"value":3875},"Singletons (e.g. Faro):",{"type":46,"value":3877}," If ",{"type":40,"tag":53,"props":3879,"children":3881},{"className":3880},[],[3882],{"type":46,"value":2228},{"type":46,"value":3884}," has ",{"type":40,"tag":53,"props":3886,"children":3888},{"className":3887},[],[3889],{"type":46,"value":3890},"export const faro = initializeFaro()",{"type":46,"value":3892},", do NOT keep it as a top-level import. Extract it to ",{"type":40,"tag":53,"props":3894,"children":3896},{"className":3895},[],[3897],{"type":46,"value":3898},"src\u002Ffaro.ts",{"type":46,"value":3900},", update all internal imports from ",{"type":40,"tag":53,"props":3902,"children":3904},{"className":3903},[],[3905],{"type":46,"value":3906},"'*\u002Fmodule'",{"type":46,"value":3908}," → ",{"type":40,"tag":53,"props":3910,"children":3912},{"className":3911},[],[3913],{"type":46,"value":3914},"'*\u002Ffaro'",{"type":46,"value":3916},", then use the dynamic ",{"type":40,"tag":53,"props":3918,"children":3920},{"className":3919},[],[3921],{"type":46,"value":3922},"initFaro()",{"type":46,"value":3924}," pattern above.",{"type":40,"tag":332,"props":3926,"children":3927},{},[],{"type":40,"tag":2507,"props":3929,"children":3931},{"id":3930},"priority-2-route-based-splitting-in-apptsx",[3932],{"type":46,"value":3933},"Priority 2: Route-based splitting in App.tsx",{"type":40,"tag":365,"props":3935,"children":3937},{"className":2558,"code":3936,"language":2560,"meta":370,"style":370},"import React, { lazy, Suspense } from 'react';\nimport { Route, Routes } from 'react-router-dom';\nimport { LoadingPlaceholder } from '@grafana\u002Fui';\n\nconst HomePage     = lazy(() => import('..\u002Fpages\u002FHome'));\nconst SettingsPage = lazy(() => import('..\u002Fpages\u002FSettings'));\nconst DetailPage   = lazy(() => import('..\u002Fpages\u002FDetail'));\n\nfunction App(props: AppRootProps) {\n  return (\n    \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\n      \u003CRoutes>\n        \u003CRoute path=\"home\"       element={\u003CHomePage \u002F>} \u002F>\n        \u003CRoute path=\"settings\"   element={\u003CSettingsPage \u002F>} \u002F>\n        \u003CRoute path=\"detail\u002F:id\" element={\u003CDetailPage \u002F>} \u002F>\n        \u003CRoute path=\"\"           element={\u003CHomePage \u002F>} \u002F>\n      \u003C\u002FRoutes>\n    \u003C\u002FSuspense>\n  );\n}\nexport default App;\n",[3938],{"type":40,"tag":53,"props":3939,"children":3940},{"__ignoreMap":370},[3941,3996,4046,4085,4092,4153,4214,4275,4282,4317,4329,4370,4388,4442,4492,4542,4582,4598,4614,4626,4633],{"type":40,"tag":376,"props":3942,"children":3943},{"class":378,"line":379},[3944,3948,3952,3956,3960,3964,3968,3972,3976,3980,3984,3988,3992],{"type":40,"tag":376,"props":3945,"children":3946},{"style":1105},[3947],{"type":46,"value":2572},{"type":40,"tag":376,"props":3949,"children":3950},{"style":1495},[3951],{"type":46,"value":2577},{"type":40,"tag":376,"props":3953,"children":3954},{"style":399},[3955],{"type":46,"value":2582},{"type":40,"tag":376,"props":3957,"children":3958},{"style":399},[3959],{"type":46,"value":2587},{"type":40,"tag":376,"props":3961,"children":3962},{"style":1495},[3963],{"type":46,"value":2324},{"type":40,"tag":376,"props":3965,"children":3966},{"style":399},[3967],{"type":46,"value":2582},{"type":40,"tag":376,"props":3969,"children":3970},{"style":1495},[3971],{"type":46,"value":2600},{"type":40,"tag":376,"props":3973,"children":3974},{"style":399},[3975],{"type":46,"value":2605},{"type":40,"tag":376,"props":3977,"children":3978},{"style":1105},[3979],{"type":46,"value":2610},{"type":40,"tag":376,"props":3981,"children":3982},{"style":399},[3983],{"type":46,"value":1288},{"type":40,"tag":376,"props":3985,"children":3986},{"style":405},[3987],{"type":46,"value":18},{"type":40,"tag":376,"props":3989,"children":3990},{"style":399},[3991],{"type":46,"value":1298},{"type":40,"tag":376,"props":3993,"children":3994},{"style":399},[3995],{"type":46,"value":2437},{"type":40,"tag":376,"props":3997,"children":3998},{"class":378,"line":389},[3999,4003,4007,4012,4016,4021,4025,4029,4033,4038,4042],{"type":40,"tag":376,"props":4000,"children":4001},{"style":1105},[4002],{"type":46,"value":2572},{"type":40,"tag":376,"props":4004,"children":4005},{"style":399},[4006],{"type":46,"value":2587},{"type":40,"tag":376,"props":4008,"children":4009},{"style":1495},[4010],{"type":46,"value":4011}," Route",{"type":40,"tag":376,"props":4013,"children":4014},{"style":399},[4015],{"type":46,"value":2582},{"type":40,"tag":376,"props":4017,"children":4018},{"style":1495},[4019],{"type":46,"value":4020}," Routes",{"type":40,"tag":376,"props":4022,"children":4023},{"style":399},[4024],{"type":46,"value":2605},{"type":40,"tag":376,"props":4026,"children":4027},{"style":1105},[4028],{"type":46,"value":2610},{"type":40,"tag":376,"props":4030,"children":4031},{"style":399},[4032],{"type":46,"value":1288},{"type":40,"tag":376,"props":4034,"children":4035},{"style":405},[4036],{"type":46,"value":4037},"react-router-dom",{"type":40,"tag":376,"props":4039,"children":4040},{"style":399},[4041],{"type":46,"value":1298},{"type":40,"tag":376,"props":4043,"children":4044},{"style":399},[4045],{"type":46,"value":2437},{"type":40,"tag":376,"props":4047,"children":4048},{"class":378,"line":411},[4049,4053,4057,4061,4065,4069,4073,4077,4081],{"type":40,"tag":376,"props":4050,"children":4051},{"style":1105},[4052],{"type":46,"value":2572},{"type":40,"tag":376,"props":4054,"children":4055},{"style":399},[4056],{"type":46,"value":2587},{"type":40,"tag":376,"props":4058,"children":4059},{"style":1495},[4060],{"type":46,"value":2692},{"type":40,"tag":376,"props":4062,"children":4063},{"style":399},[4064],{"type":46,"value":2605},{"type":40,"tag":376,"props":4066,"children":4067},{"style":1105},[4068],{"type":46,"value":2610},{"type":40,"tag":376,"props":4070,"children":4071},{"style":399},[4072],{"type":46,"value":1288},{"type":40,"tag":376,"props":4074,"children":4075},{"style":405},[4076],{"type":46,"value":2709},{"type":40,"tag":376,"props":4078,"children":4079},{"style":399},[4080],{"type":46,"value":1298},{"type":40,"tag":376,"props":4082,"children":4083},{"style":399},[4084],{"type":46,"value":2437},{"type":40,"tag":376,"props":4086,"children":4087},{"class":378,"line":426},[4088],{"type":40,"tag":376,"props":4089,"children":4090},{"emptyLinePlaceholder":497},[4091],{"type":46,"value":500},{"type":40,"tag":376,"props":4093,"children":4094},{"class":378,"line":439},[4095,4099,4104,4108,4112,4116,4120,4124,4128,4132,4136,4141,4145,4149],{"type":40,"tag":376,"props":4096,"children":4097},{"style":2306},[4098],{"type":46,"value":2309},{"type":40,"tag":376,"props":4100,"children":4101},{"style":1495},[4102],{"type":46,"value":4103}," HomePage     ",{"type":40,"tag":376,"props":4105,"children":4106},{"style":399},[4107],{"type":46,"value":2319},{"type":40,"tag":376,"props":4109,"children":4110},{"style":1417},[4111],{"type":46,"value":2324},{"type":40,"tag":376,"props":4113,"children":4114},{"style":1495},[4115],{"type":46,"value":2329},{"type":40,"tag":376,"props":4117,"children":4118},{"style":399},[4119],{"type":46,"value":2334},{"type":40,"tag":376,"props":4121,"children":4122},{"style":2306},[4123],{"type":46,"value":2339},{"type":40,"tag":376,"props":4125,"children":4126},{"style":399},[4127],{"type":46,"value":2344},{"type":40,"tag":376,"props":4129,"children":4130},{"style":1495},[4131],{"type":46,"value":2329},{"type":40,"tag":376,"props":4133,"children":4134},{"style":399},[4135],{"type":46,"value":1298},{"type":40,"tag":376,"props":4137,"children":4138},{"style":405},[4139],{"type":46,"value":4140},"..\u002Fpages\u002FHome",{"type":40,"tag":376,"props":4142,"children":4143},{"style":399},[4144],{"type":46,"value":1298},{"type":40,"tag":376,"props":4146,"children":4147},{"style":1495},[4148],{"type":46,"value":2501},{"type":40,"tag":376,"props":4150,"children":4151},{"style":399},[4152],{"type":46,"value":2437},{"type":40,"tag":376,"props":4154,"children":4155},{"class":378,"line":452},[4156,4160,4165,4169,4173,4177,4181,4185,4189,4193,4197,4202,4206,4210],{"type":40,"tag":376,"props":4157,"children":4158},{"style":2306},[4159],{"type":46,"value":2309},{"type":40,"tag":376,"props":4161,"children":4162},{"style":1495},[4163],{"type":46,"value":4164}," SettingsPage ",{"type":40,"tag":376,"props":4166,"children":4167},{"style":399},[4168],{"type":46,"value":2319},{"type":40,"tag":376,"props":4170,"children":4171},{"style":1417},[4172],{"type":46,"value":2324},{"type":40,"tag":376,"props":4174,"children":4175},{"style":1495},[4176],{"type":46,"value":2329},{"type":40,"tag":376,"props":4178,"children":4179},{"style":399},[4180],{"type":46,"value":2334},{"type":40,"tag":376,"props":4182,"children":4183},{"style":2306},[4184],{"type":46,"value":2339},{"type":40,"tag":376,"props":4186,"children":4187},{"style":399},[4188],{"type":46,"value":2344},{"type":40,"tag":376,"props":4190,"children":4191},{"style":1495},[4192],{"type":46,"value":2329},{"type":40,"tag":376,"props":4194,"children":4195},{"style":399},[4196],{"type":46,"value":1298},{"type":40,"tag":376,"props":4198,"children":4199},{"style":405},[4200],{"type":46,"value":4201},"..\u002Fpages\u002FSettings",{"type":40,"tag":376,"props":4203,"children":4204},{"style":399},[4205],{"type":46,"value":1298},{"type":40,"tag":376,"props":4207,"children":4208},{"style":1495},[4209],{"type":46,"value":2501},{"type":40,"tag":376,"props":4211,"children":4212},{"style":399},[4213],{"type":46,"value":2437},{"type":40,"tag":376,"props":4215,"children":4216},{"class":378,"line":480},[4217,4221,4226,4230,4234,4238,4242,4246,4250,4254,4258,4263,4267,4271],{"type":40,"tag":376,"props":4218,"children":4219},{"style":2306},[4220],{"type":46,"value":2309},{"type":40,"tag":376,"props":4222,"children":4223},{"style":1495},[4224],{"type":46,"value":4225}," DetailPage   ",{"type":40,"tag":376,"props":4227,"children":4228},{"style":399},[4229],{"type":46,"value":2319},{"type":40,"tag":376,"props":4231,"children":4232},{"style":1417},[4233],{"type":46,"value":2324},{"type":40,"tag":376,"props":4235,"children":4236},{"style":1495},[4237],{"type":46,"value":2329},{"type":40,"tag":376,"props":4239,"children":4240},{"style":399},[4241],{"type":46,"value":2334},{"type":40,"tag":376,"props":4243,"children":4244},{"style":2306},[4245],{"type":46,"value":2339},{"type":40,"tag":376,"props":4247,"children":4248},{"style":399},[4249],{"type":46,"value":2344},{"type":40,"tag":376,"props":4251,"children":4252},{"style":1495},[4253],{"type":46,"value":2329},{"type":40,"tag":376,"props":4255,"children":4256},{"style":399},[4257],{"type":46,"value":1298},{"type":40,"tag":376,"props":4259,"children":4260},{"style":405},[4261],{"type":46,"value":4262},"..\u002Fpages\u002FDetail",{"type":40,"tag":376,"props":4264,"children":4265},{"style":399},[4266],{"type":46,"value":1298},{"type":40,"tag":376,"props":4268,"children":4269},{"style":1495},[4270],{"type":46,"value":2501},{"type":40,"tag":376,"props":4272,"children":4273},{"style":399},[4274],{"type":46,"value":2437},{"type":40,"tag":376,"props":4276,"children":4277},{"class":378,"line":493},[4278],{"type":40,"tag":376,"props":4279,"children":4280},{"emptyLinePlaceholder":497},[4281],{"type":46,"value":500},{"type":40,"tag":376,"props":4283,"children":4284},{"class":378,"line":503},[4285,4289,4293,4297,4301,4305,4309,4313],{"type":40,"tag":376,"props":4286,"children":4287},{"style":2306},[4288],{"type":46,"value":3226},{"type":40,"tag":376,"props":4290,"children":4291},{"style":1417},[4292],{"type":46,"value":3231},{"type":40,"tag":376,"props":4294,"children":4295},{"style":399},[4296],{"type":46,"value":2329},{"type":40,"tag":376,"props":4298,"children":4299},{"style":2382},[4300],{"type":46,"value":3240},{"type":40,"tag":376,"props":4302,"children":4303},{"style":399},[4304],{"type":46,"value":402},{"type":40,"tag":376,"props":4306,"children":4307},{"style":1275},[4308],{"type":46,"value":2651},{"type":40,"tag":376,"props":4310,"children":4311},{"style":399},[4312],{"type":46,"value":283},{"type":40,"tag":376,"props":4314,"children":4315},{"style":399},[4316],{"type":46,"value":2889},{"type":40,"tag":376,"props":4318,"children":4319},{"class":378,"line":516},[4320,4324],{"type":40,"tag":376,"props":4321,"children":4322},{"style":1105},[4323],{"type":46,"value":3110},{"type":40,"tag":376,"props":4325,"children":4326},{"style":393},[4327],{"type":46,"value":4328}," (\n",{"type":40,"tag":376,"props":4330,"children":4331},{"class":378,"line":529},[4332,4337,4341,4345,4349,4353,4357,4361,4365],{"type":40,"tag":376,"props":4333,"children":4334},{"style":399},[4335],{"type":46,"value":4336},"    \u003C",{"type":40,"tag":376,"props":4338,"children":4339},{"style":1275},[4340],{"type":46,"value":3284},{"type":40,"tag":376,"props":4342,"children":4343},{"style":2306},[4344],{"type":46,"value":3289},{"type":40,"tag":376,"props":4346,"children":4347},{"style":399},[4348],{"type":46,"value":3294},{"type":40,"tag":376,"props":4350,"children":4351},{"style":1275},[4352],{"type":46,"value":3299},{"type":40,"tag":376,"props":4354,"children":4355},{"style":2306},[4356],{"type":46,"value":3304},{"type":40,"tag":376,"props":4358,"children":4359},{"style":399},[4360],{"type":46,"value":2319},{"type":40,"tag":376,"props":4362,"children":4363},{"style":399},[4364],{"type":46,"value":3313},{"type":40,"tag":376,"props":4366,"children":4367},{"style":399},[4368],{"type":46,"value":4369}," \u002F>}>\n",{"type":40,"tag":376,"props":4371,"children":4372},{"class":378,"line":547},[4373,4378,4383],{"type":40,"tag":376,"props":4374,"children":4375},{"style":399},[4376],{"type":46,"value":4377},"      \u003C",{"type":40,"tag":376,"props":4379,"children":4380},{"style":1275},[4381],{"type":46,"value":4382},"Routes",{"type":40,"tag":376,"props":4384,"children":4385},{"style":399},[4386],{"type":46,"value":4387},">\n",{"type":40,"tag":376,"props":4389,"children":4390},{"class":378,"line":560},[4391,4396,4401,4406,4410,4414,4419,4423,4428,4432,4437],{"type":40,"tag":376,"props":4392,"children":4393},{"style":399},[4394],{"type":46,"value":4395},"        \u003C",{"type":40,"tag":376,"props":4397,"children":4398},{"style":1275},[4399],{"type":46,"value":4400},"Route",{"type":40,"tag":376,"props":4402,"children":4403},{"style":2306},[4404],{"type":46,"value":4405}," path",{"type":40,"tag":376,"props":4407,"children":4408},{"style":399},[4409],{"type":46,"value":2319},{"type":40,"tag":376,"props":4411,"children":4412},{"style":399},[4413],{"type":46,"value":1435},{"type":40,"tag":376,"props":4415,"children":4416},{"style":405},[4417],{"type":46,"value":4418},"home",{"type":40,"tag":376,"props":4420,"children":4421},{"style":399},[4422],{"type":46,"value":1435},{"type":40,"tag":376,"props":4424,"children":4425},{"style":2306},[4426],{"type":46,"value":4427},"       element",{"type":40,"tag":376,"props":4429,"children":4430},{"style":399},[4431],{"type":46,"value":3294},{"type":40,"tag":376,"props":4433,"children":4434},{"style":1275},[4435],{"type":46,"value":4436},"HomePage",{"type":40,"tag":376,"props":4438,"children":4439},{"style":399},[4440],{"type":46,"value":4441}," \u002F>} \u002F>\n",{"type":40,"tag":376,"props":4443,"children":4444},{"class":378,"line":578},[4445,4449,4453,4457,4461,4465,4470,4474,4479,4483,4488],{"type":40,"tag":376,"props":4446,"children":4447},{"style":399},[4448],{"type":46,"value":4395},{"type":40,"tag":376,"props":4450,"children":4451},{"style":1275},[4452],{"type":46,"value":4400},{"type":40,"tag":376,"props":4454,"children":4455},{"style":2306},[4456],{"type":46,"value":4405},{"type":40,"tag":376,"props":4458,"children":4459},{"style":399},[4460],{"type":46,"value":2319},{"type":40,"tag":376,"props":4462,"children":4463},{"style":399},[4464],{"type":46,"value":1435},{"type":40,"tag":376,"props":4466,"children":4467},{"style":405},[4468],{"type":46,"value":4469},"settings",{"type":40,"tag":376,"props":4471,"children":4472},{"style":399},[4473],{"type":46,"value":1435},{"type":40,"tag":376,"props":4475,"children":4476},{"style":2306},[4477],{"type":46,"value":4478},"   element",{"type":40,"tag":376,"props":4480,"children":4481},{"style":399},[4482],{"type":46,"value":3294},{"type":40,"tag":376,"props":4484,"children":4485},{"style":1275},[4486],{"type":46,"value":4487},"SettingsPage",{"type":40,"tag":376,"props":4489,"children":4490},{"style":399},[4491],{"type":46,"value":4441},{"type":40,"tag":376,"props":4493,"children":4494},{"class":378,"line":595},[4495,4499,4503,4507,4511,4515,4520,4524,4529,4533,4538],{"type":40,"tag":376,"props":4496,"children":4497},{"style":399},[4498],{"type":46,"value":4395},{"type":40,"tag":376,"props":4500,"children":4501},{"style":1275},[4502],{"type":46,"value":4400},{"type":40,"tag":376,"props":4504,"children":4505},{"style":2306},[4506],{"type":46,"value":4405},{"type":40,"tag":376,"props":4508,"children":4509},{"style":399},[4510],{"type":46,"value":2319},{"type":40,"tag":376,"props":4512,"children":4513},{"style":399},[4514],{"type":46,"value":1435},{"type":40,"tag":376,"props":4516,"children":4517},{"style":405},[4518],{"type":46,"value":4519},"detail\u002F:id",{"type":40,"tag":376,"props":4521,"children":4522},{"style":399},[4523],{"type":46,"value":1435},{"type":40,"tag":376,"props":4525,"children":4526},{"style":2306},[4527],{"type":46,"value":4528}," element",{"type":40,"tag":376,"props":4530,"children":4531},{"style":399},[4532],{"type":46,"value":3294},{"type":40,"tag":376,"props":4534,"children":4535},{"style":1275},[4536],{"type":46,"value":4537},"DetailPage",{"type":40,"tag":376,"props":4539,"children":4540},{"style":399},[4541],{"type":46,"value":4441},{"type":40,"tag":376,"props":4543,"children":4544},{"class":378,"line":27},[4545,4549,4553,4557,4561,4565,4570,4574,4578],{"type":40,"tag":376,"props":4546,"children":4547},{"style":399},[4548],{"type":46,"value":4395},{"type":40,"tag":376,"props":4550,"children":4551},{"style":1275},[4552],{"type":46,"value":4400},{"type":40,"tag":376,"props":4554,"children":4555},{"style":2306},[4556],{"type":46,"value":4405},{"type":40,"tag":376,"props":4558,"children":4559},{"style":399},[4560],{"type":46,"value":2319},{"type":40,"tag":376,"props":4562,"children":4563},{"style":399},[4564],{"type":46,"value":3313},{"type":40,"tag":376,"props":4566,"children":4567},{"style":2306},[4568],{"type":46,"value":4569},"           element",{"type":40,"tag":376,"props":4571,"children":4572},{"style":399},[4573],{"type":46,"value":3294},{"type":40,"tag":376,"props":4575,"children":4576},{"style":1275},[4577],{"type":46,"value":4436},{"type":40,"tag":376,"props":4579,"children":4580},{"style":399},[4581],{"type":46,"value":4441},{"type":40,"tag":376,"props":4583,"children":4584},{"class":378,"line":629},[4585,4590,4594],{"type":40,"tag":376,"props":4586,"children":4587},{"style":399},[4588],{"type":46,"value":4589},"      \u003C\u002F",{"type":40,"tag":376,"props":4591,"children":4592},{"style":1275},[4593],{"type":46,"value":4382},{"type":40,"tag":376,"props":4595,"children":4596},{"style":399},[4597],{"type":46,"value":4387},{"type":40,"tag":376,"props":4599,"children":4600},{"class":378,"line":642},[4601,4606,4610],{"type":40,"tag":376,"props":4602,"children":4603},{"style":399},[4604],{"type":46,"value":4605},"    \u003C\u002F",{"type":40,"tag":376,"props":4607,"children":4608},{"style":1275},[4609],{"type":46,"value":3284},{"type":40,"tag":376,"props":4611,"children":4612},{"style":399},[4613],{"type":46,"value":4387},{"type":40,"tag":376,"props":4615,"children":4616},{"class":378,"line":665},[4617,4622],{"type":40,"tag":376,"props":4618,"children":4619},{"style":393},[4620],{"type":46,"value":4621},"  )",{"type":40,"tag":376,"props":4623,"children":4624},{"style":399},[4625],{"type":46,"value":2437},{"type":40,"tag":376,"props":4627,"children":4628},{"class":378,"line":686},[4629],{"type":40,"tag":376,"props":4630,"children":4631},{"style":399},[4632],{"type":46,"value":3034},{"type":40,"tag":376,"props":4634,"children":4635},{"class":378,"line":699},[4636,4640,4644,4648],{"type":40,"tag":376,"props":4637,"children":4638},{"style":1105},[4639],{"type":46,"value":3623},{"type":40,"tag":376,"props":4641,"children":4642},{"style":1105},[4643],{"type":46,"value":2404},{"type":40,"tag":376,"props":4645,"children":4646},{"style":1495},[4647],{"type":46,"value":3231},{"type":40,"tag":376,"props":4649,"children":4650},{"style":399},[4651],{"type":46,"value":2437},{"type":40,"tag":49,"props":4653,"children":4654},{},[4655,4660,4662,4668,4670,4676],{"type":40,"tag":72,"props":4656,"children":4657},{},[4658],{"type":46,"value":4659},"Bypass barrel files:",{"type":46,"value":4661}," Target the actual component file in the ",{"type":40,"tag":53,"props":4663,"children":4665},{"className":4664},[],[4666],{"type":46,"value":4667},"import()",{"type":46,"value":4669},", not an ",{"type":40,"tag":53,"props":4671,"children":4673},{"className":4672},[],[4674],{"type":46,"value":4675},"index.ts",{"type":46,"value":4677}," barrel that re-exports multiple things:",{"type":40,"tag":365,"props":4679,"children":4681},{"className":2558,"code":4680,"language":2560,"meta":370,"style":370},"\u002F\u002F Risky — barrel may pull in other heavy modules\nconst Catalog = lazy(() => import('features\u002Fcatalog'));\n\u002F\u002F Better — only pulls in Catalog's tree\nconst Catalog = lazy(() => import('features\u002Fcatalog\u002FCatalog').then(m => ({ default: m.Catalog })));\n",[4682],{"type":40,"tag":53,"props":4683,"children":4684},{"__ignoreMap":370},[4685,4693,4754,4762],{"type":40,"tag":376,"props":4686,"children":4687},{"class":378,"line":379},[4688],{"type":40,"tag":376,"props":4689,"children":4690},{"style":383},[4691],{"type":46,"value":4692},"\u002F\u002F Risky — barrel may pull in other heavy modules\n",{"type":40,"tag":376,"props":4694,"children":4695},{"class":378,"line":389},[4696,4700,4705,4709,4713,4717,4721,4725,4729,4733,4737,4742,4746,4750],{"type":40,"tag":376,"props":4697,"children":4698},{"style":2306},[4699],{"type":46,"value":2309},{"type":40,"tag":376,"props":4701,"children":4702},{"style":1495},[4703],{"type":46,"value":4704}," Catalog ",{"type":40,"tag":376,"props":4706,"children":4707},{"style":399},[4708],{"type":46,"value":2319},{"type":40,"tag":376,"props":4710,"children":4711},{"style":1417},[4712],{"type":46,"value":2324},{"type":40,"tag":376,"props":4714,"children":4715},{"style":1495},[4716],{"type":46,"value":2329},{"type":40,"tag":376,"props":4718,"children":4719},{"style":399},[4720],{"type":46,"value":2334},{"type":40,"tag":376,"props":4722,"children":4723},{"style":2306},[4724],{"type":46,"value":2339},{"type":40,"tag":376,"props":4726,"children":4727},{"style":399},[4728],{"type":46,"value":2344},{"type":40,"tag":376,"props":4730,"children":4731},{"style":1495},[4732],{"type":46,"value":2329},{"type":40,"tag":376,"props":4734,"children":4735},{"style":399},[4736],{"type":46,"value":1298},{"type":40,"tag":376,"props":4738,"children":4739},{"style":405},[4740],{"type":46,"value":4741},"features\u002Fcatalog",{"type":40,"tag":376,"props":4743,"children":4744},{"style":399},[4745],{"type":46,"value":1298},{"type":40,"tag":376,"props":4747,"children":4748},{"style":1495},[4749],{"type":46,"value":2501},{"type":40,"tag":376,"props":4751,"children":4752},{"style":399},[4753],{"type":46,"value":2437},{"type":40,"tag":376,"props":4755,"children":4756},{"class":378,"line":411},[4757],{"type":40,"tag":376,"props":4758,"children":4759},{"style":383},[4760],{"type":46,"value":4761},"\u002F\u002F Better — only pulls in Catalog's tree\n",{"type":40,"tag":376,"props":4763,"children":4764},{"class":378,"line":426},[4765,4769,4773,4777,4781,4785,4789,4793,4797,4801,4805,4810,4814,4818,4822,4826,4830,4834,4838,4842,4846,4850,4854,4858,4862,4867,4871,4875],{"type":40,"tag":376,"props":4766,"children":4767},{"style":2306},[4768],{"type":46,"value":2309},{"type":40,"tag":376,"props":4770,"children":4771},{"style":1495},[4772],{"type":46,"value":4704},{"type":40,"tag":376,"props":4774,"children":4775},{"style":399},[4776],{"type":46,"value":2319},{"type":40,"tag":376,"props":4778,"children":4779},{"style":1417},[4780],{"type":46,"value":2324},{"type":40,"tag":376,"props":4782,"children":4783},{"style":1495},[4784],{"type":46,"value":2329},{"type":40,"tag":376,"props":4786,"children":4787},{"style":399},[4788],{"type":46,"value":2334},{"type":40,"tag":376,"props":4790,"children":4791},{"style":2306},[4792],{"type":46,"value":2339},{"type":40,"tag":376,"props":4794,"children":4795},{"style":399},[4796],{"type":46,"value":2344},{"type":40,"tag":376,"props":4798,"children":4799},{"style":1495},[4800],{"type":46,"value":2329},{"type":40,"tag":376,"props":4802,"children":4803},{"style":399},[4804],{"type":46,"value":1298},{"type":40,"tag":376,"props":4806,"children":4807},{"style":405},[4808],{"type":46,"value":4809},"features\u002Fcatalog\u002FCatalog",{"type":40,"tag":376,"props":4811,"children":4812},{"style":399},[4813],{"type":46,"value":1298},{"type":40,"tag":376,"props":4815,"children":4816},{"style":1495},[4817],{"type":46,"value":283},{"type":40,"tag":376,"props":4819,"children":4820},{"style":399},[4821],{"type":46,"value":2370},{"type":40,"tag":376,"props":4823,"children":4824},{"style":1417},[4825],{"type":46,"value":2375},{"type":40,"tag":376,"props":4827,"children":4828},{"style":1495},[4829],{"type":46,"value":2329},{"type":40,"tag":376,"props":4831,"children":4832},{"style":2382},[4833],{"type":46,"value":2385},{"type":40,"tag":376,"props":4835,"children":4836},{"style":2306},[4837],{"type":46,"value":2339},{"type":40,"tag":376,"props":4839,"children":4840},{"style":1495},[4841],{"type":46,"value":2394},{"type":40,"tag":376,"props":4843,"children":4844},{"style":399},[4845],{"type":46,"value":2399},{"type":40,"tag":376,"props":4847,"children":4848},{"style":393},[4849],{"type":46,"value":2404},{"type":40,"tag":376,"props":4851,"children":4852},{"style":399},[4853],{"type":46,"value":402},{"type":40,"tag":376,"props":4855,"children":4856},{"style":1495},[4857],{"type":46,"value":2413},{"type":40,"tag":376,"props":4859,"children":4860},{"style":399},[4861],{"type":46,"value":2370},{"type":40,"tag":376,"props":4863,"children":4864},{"style":1495},[4865],{"type":46,"value":4866},"Catalog ",{"type":40,"tag":376,"props":4868,"children":4869},{"style":399},[4870],{"type":46,"value":2427},{"type":40,"tag":376,"props":4872,"children":4873},{"style":1495},[4874],{"type":46,"value":2432},{"type":40,"tag":376,"props":4876,"children":4877},{"style":399},[4878],{"type":46,"value":2437},{"type":40,"tag":2507,"props":4880,"children":4882},{"id":4881},"priority-3-extension-components",[4883],{"type":46,"value":4884},"Priority 3: Extension components",{"type":40,"tag":49,"props":4886,"children":4887},{},[4888,4890,4896,4898,4904],{"type":46,"value":4889},"Each extension should ",{"type":40,"tag":53,"props":4891,"children":4893},{"className":4892},[],[4894],{"type":46,"value":4895},"export default",{"type":46,"value":4897}," its component. Use ",{"type":40,"tag":53,"props":4899,"children":4901},{"className":4900},[],[4902],{"type":46,"value":4903},"fallback={null}",{"type":46,"value":4905}," for extensions that load quickly:",{"type":40,"tag":365,"props":4907,"children":4909},{"className":2558,"code":4908,"language":2560,"meta":370,"style":370},"\u002F\u002F src\u002Fextensions\u002FMyExtension.tsx\nexport default function MyExtension(props: MyExtensionProps) {\n  return \u003CAppProviders>\u003CMyExtensionContent {...props} \u002F>\u003C\u002FAppProviders>;\n}\n",[4910],{"type":40,"tag":53,"props":4911,"children":4912},{"__ignoreMap":370},[4913,4921,4964,5010],{"type":40,"tag":376,"props":4914,"children":4915},{"class":378,"line":379},[4916],{"type":40,"tag":376,"props":4917,"children":4918},{"style":383},[4919],{"type":46,"value":4920},"\u002F\u002F src\u002Fextensions\u002FMyExtension.tsx\n",{"type":40,"tag":376,"props":4922,"children":4923},{"class":378,"line":389},[4924,4928,4932,4936,4940,4944,4948,4952,4956,4960],{"type":40,"tag":376,"props":4925,"children":4926},{"style":1105},[4927],{"type":46,"value":3623},{"type":40,"tag":376,"props":4929,"children":4930},{"style":1105},[4931],{"type":46,"value":2404},{"type":40,"tag":376,"props":4933,"children":4934},{"style":2306},[4935],{"type":46,"value":2875},{"type":40,"tag":376,"props":4937,"children":4938},{"style":1417},[4939],{"type":46,"value":3505},{"type":40,"tag":376,"props":4941,"children":4942},{"style":399},[4943],{"type":46,"value":2329},{"type":40,"tag":376,"props":4945,"children":4946},{"style":2382},[4947],{"type":46,"value":3240},{"type":40,"tag":376,"props":4949,"children":4950},{"style":399},[4951],{"type":46,"value":402},{"type":40,"tag":376,"props":4953,"children":4954},{"style":1275},[4955],{"type":46,"value":2745},{"type":40,"tag":376,"props":4957,"children":4958},{"style":399},[4959],{"type":46,"value":283},{"type":40,"tag":376,"props":4961,"children":4962},{"style":399},[4963],{"type":46,"value":2889},{"type":40,"tag":376,"props":4965,"children":4966},{"class":378,"line":411},[4967,4971,4975,4980,4985,4990,4994,4998,5002,5006],{"type":40,"tag":376,"props":4968,"children":4969},{"style":1105},[4970],{"type":46,"value":3110},{"type":40,"tag":376,"props":4972,"children":4973},{"style":399},[4974],{"type":46,"value":3279},{"type":40,"tag":376,"props":4976,"children":4977},{"style":1275},[4978],{"type":46,"value":4979},"AppProviders",{"type":40,"tag":376,"props":4981,"children":4982},{"style":399},[4983],{"type":46,"value":4984},">\u003C",{"type":40,"tag":376,"props":4986,"children":4987},{"style":1275},[4988],{"type":46,"value":4989},"MyExtensionContent",{"type":40,"tag":376,"props":4991,"children":4992},{"style":399},[4993],{"type":46,"value":3328},{"type":40,"tag":376,"props":4995,"children":4996},{"style":1495},[4997],{"type":46,"value":3240},{"type":40,"tag":376,"props":4999,"children":5000},{"style":399},[5001],{"type":46,"value":3337},{"type":40,"tag":376,"props":5003,"children":5004},{"style":1275},[5005],{"type":46,"value":4979},{"type":40,"tag":376,"props":5007,"children":5008},{"style":399},[5009],{"type":46,"value":3346},{"type":40,"tag":376,"props":5011,"children":5012},{"class":378,"line":426},[5013],{"type":40,"tag":376,"props":5014,"children":5015},{"style":399},[5016],{"type":46,"value":3034},{"type":40,"tag":49,"props":5018,"children":5019},{},[5020,5025,5027,5032],{"type":40,"tag":72,"props":5021,"children":5022},{},[5023],{"type":46,"value":5024},"Surgical split:",{"type":46,"value":5026}," If an extension wrapper must stay eager in ",{"type":40,"tag":53,"props":5028,"children":5030},{"className":5029},[],[5031],{"type":46,"value":148},{"type":46,"value":5033},", lazy-load the heavy component it renders:",{"type":40,"tag":365,"props":5035,"children":5037},{"className":2558,"code":5036,"language":2560,"meta":370,"style":370},"const HeavyInner = lazy(() => import('components\u002Ffeatures\u002FHeavyInner'));\nexport function MyExtension() {\n  return \u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\u003CHeavyInner \u002F>\u003C\u002FSuspense>;\n}\n",[5038],{"type":40,"tag":53,"props":5039,"children":5040},{"__ignoreMap":370},[5041,5102,5125,5186],{"type":40,"tag":376,"props":5042,"children":5043},{"class":378,"line":379},[5044,5048,5053,5057,5061,5065,5069,5073,5077,5081,5085,5090,5094,5098],{"type":40,"tag":376,"props":5045,"children":5046},{"style":2306},[5047],{"type":46,"value":2309},{"type":40,"tag":376,"props":5049,"children":5050},{"style":1495},[5051],{"type":46,"value":5052}," HeavyInner ",{"type":40,"tag":376,"props":5054,"children":5055},{"style":399},[5056],{"type":46,"value":2319},{"type":40,"tag":376,"props":5058,"children":5059},{"style":1417},[5060],{"type":46,"value":2324},{"type":40,"tag":376,"props":5062,"children":5063},{"style":1495},[5064],{"type":46,"value":2329},{"type":40,"tag":376,"props":5066,"children":5067},{"style":399},[5068],{"type":46,"value":2334},{"type":40,"tag":376,"props":5070,"children":5071},{"style":2306},[5072],{"type":46,"value":2339},{"type":40,"tag":376,"props":5074,"children":5075},{"style":399},[5076],{"type":46,"value":2344},{"type":40,"tag":376,"props":5078,"children":5079},{"style":1495},[5080],{"type":46,"value":2329},{"type":40,"tag":376,"props":5082,"children":5083},{"style":399},[5084],{"type":46,"value":1298},{"type":40,"tag":376,"props":5086,"children":5087},{"style":405},[5088],{"type":46,"value":5089},"components\u002Ffeatures\u002FHeavyInner",{"type":40,"tag":376,"props":5091,"children":5092},{"style":399},[5093],{"type":46,"value":1298},{"type":40,"tag":376,"props":5095,"children":5096},{"style":1495},[5097],{"type":46,"value":2501},{"type":40,"tag":376,"props":5099,"children":5100},{"style":399},[5101],{"type":46,"value":2437},{"type":40,"tag":376,"props":5103,"children":5104},{"class":378,"line":389},[5105,5109,5113,5117,5121],{"type":40,"tag":376,"props":5106,"children":5107},{"style":1105},[5108],{"type":46,"value":3623},{"type":40,"tag":376,"props":5110,"children":5111},{"style":2306},[5112],{"type":46,"value":2875},{"type":40,"tag":376,"props":5114,"children":5115},{"style":1417},[5116],{"type":46,"value":3505},{"type":40,"tag":376,"props":5118,"children":5119},{"style":399},[5120],{"type":46,"value":2334},{"type":40,"tag":376,"props":5122,"children":5123},{"style":399},[5124],{"type":46,"value":2889},{"type":40,"tag":376,"props":5126,"children":5127},{"class":378,"line":411},[5128,5132,5136,5140,5144,5148,5152,5156,5160,5164,5168,5173,5178,5182],{"type":40,"tag":376,"props":5129,"children":5130},{"style":1105},[5131],{"type":46,"value":3110},{"type":40,"tag":376,"props":5133,"children":5134},{"style":399},[5135],{"type":46,"value":3279},{"type":40,"tag":376,"props":5137,"children":5138},{"style":1275},[5139],{"type":46,"value":3284},{"type":40,"tag":376,"props":5141,"children":5142},{"style":2306},[5143],{"type":46,"value":3289},{"type":40,"tag":376,"props":5145,"children":5146},{"style":399},[5147],{"type":46,"value":3294},{"type":40,"tag":376,"props":5149,"children":5150},{"style":1275},[5151],{"type":46,"value":3299},{"type":40,"tag":376,"props":5153,"children":5154},{"style":2306},[5155],{"type":46,"value":3304},{"type":40,"tag":376,"props":5157,"children":5158},{"style":399},[5159],{"type":46,"value":2319},{"type":40,"tag":376,"props":5161,"children":5162},{"style":399},[5163],{"type":46,"value":3313},{"type":40,"tag":376,"props":5165,"children":5166},{"style":399},[5167],{"type":46,"value":3318},{"type":40,"tag":376,"props":5169,"children":5170},{"style":1275},[5171],{"type":46,"value":5172},"HeavyInner",{"type":40,"tag":376,"props":5174,"children":5175},{"style":399},[5176],{"type":46,"value":5177}," \u002F>\u003C\u002F",{"type":40,"tag":376,"props":5179,"children":5180},{"style":1275},[5181],{"type":46,"value":3284},{"type":40,"tag":376,"props":5183,"children":5184},{"style":399},[5185],{"type":46,"value":3346},{"type":40,"tag":376,"props":5187,"children":5188},{"class":378,"line":426},[5189],{"type":40,"tag":376,"props":5190,"children":5191},{"style":399},[5192],{"type":46,"value":3034},{"type":40,"tag":2507,"props":5194,"children":5196},{"id":5195},"priority-4-component-registries-and-tab-panels",[5197],{"type":46,"value":5198},"Priority 4: Component registries and tab panels",{"type":40,"tag":49,"props":5200,"children":5201},{},[5202,5204,5209,5211,5217],{"type":46,"value":5203},"For arrays of objects containing React components (e.g. tab panels), lazy-load each entry. ",{"type":40,"tag":72,"props":5205,"children":5206},{},[5207],{"type":46,"value":5208},"Critical:",{"type":46,"value":5210}," ensure a ",{"type":40,"tag":53,"props":5212,"children":5214},{"className":5213},[],[5215],{"type":46,"value":5216},"\u003CSuspense>",{"type":46,"value":5218}," boundary exists where the component renders.",{"type":40,"tag":365,"props":5220,"children":5222},{"className":2558,"code":5221,"language":2560,"meta":370,"style":370},"const ConfigDetails = lazy(() => import('.\u002FConfigDetails\u002FConfigDetails').then(m => ({ default: m.ConfigDetails })));\nconst Overview      = lazy(() => import('.\u002FOverview\u002FOverview').then(m => ({ default: m.Overview })));\n\nconst tabs = [\n  { id: 'overview', component: Overview },\n  { id: 'config',   component: ConfigDetails },\n];\n\n\u002F\u002F In the parent that renders the active tab:\n\u003CSuspense fallback={\u003CLoadingPlaceholder text=\"\" \u002F>}>\n  {ActiveTab && \u003CActiveTab \u002F>}\n\u003C\u002FSuspense>\n",[5223],{"type":40,"tag":53,"props":5224,"children":5225},{"__ignoreMap":370},[5226,5344,5462,5469,5490,5541,5590,5602,5609,5617,5656,5687],{"type":40,"tag":376,"props":5227,"children":5228},{"class":378,"line":379},[5229,5233,5238,5242,5246,5250,5254,5258,5262,5266,5270,5275,5279,5283,5287,5291,5295,5299,5303,5307,5311,5315,5319,5323,5327,5332,5336,5340],{"type":40,"tag":376,"props":5230,"children":5231},{"style":2306},[5232],{"type":46,"value":2309},{"type":40,"tag":376,"props":5234,"children":5235},{"style":1495},[5236],{"type":46,"value":5237}," ConfigDetails ",{"type":40,"tag":376,"props":5239,"children":5240},{"style":399},[5241],{"type":46,"value":2319},{"type":40,"tag":376,"props":5243,"children":5244},{"style":1417},[5245],{"type":46,"value":2324},{"type":40,"tag":376,"props":5247,"children":5248},{"style":1495},[5249],{"type":46,"value":2329},{"type":40,"tag":376,"props":5251,"children":5252},{"style":399},[5253],{"type":46,"value":2334},{"type":40,"tag":376,"props":5255,"children":5256},{"style":2306},[5257],{"type":46,"value":2339},{"type":40,"tag":376,"props":5259,"children":5260},{"style":399},[5261],{"type":46,"value":2344},{"type":40,"tag":376,"props":5263,"children":5264},{"style":1495},[5265],{"type":46,"value":2329},{"type":40,"tag":376,"props":5267,"children":5268},{"style":399},[5269],{"type":46,"value":1298},{"type":40,"tag":376,"props":5271,"children":5272},{"style":405},[5273],{"type":46,"value":5274},".\u002FConfigDetails\u002FConfigDetails",{"type":40,"tag":376,"props":5276,"children":5277},{"style":399},[5278],{"type":46,"value":1298},{"type":40,"tag":376,"props":5280,"children":5281},{"style":1495},[5282],{"type":46,"value":283},{"type":40,"tag":376,"props":5284,"children":5285},{"style":399},[5286],{"type":46,"value":2370},{"type":40,"tag":376,"props":5288,"children":5289},{"style":1417},[5290],{"type":46,"value":2375},{"type":40,"tag":376,"props":5292,"children":5293},{"style":1495},[5294],{"type":46,"value":2329},{"type":40,"tag":376,"props":5296,"children":5297},{"style":2382},[5298],{"type":46,"value":2385},{"type":40,"tag":376,"props":5300,"children":5301},{"style":2306},[5302],{"type":46,"value":2339},{"type":40,"tag":376,"props":5304,"children":5305},{"style":1495},[5306],{"type":46,"value":2394},{"type":40,"tag":376,"props":5308,"children":5309},{"style":399},[5310],{"type":46,"value":2399},{"type":40,"tag":376,"props":5312,"children":5313},{"style":393},[5314],{"type":46,"value":2404},{"type":40,"tag":376,"props":5316,"children":5317},{"style":399},[5318],{"type":46,"value":402},{"type":40,"tag":376,"props":5320,"children":5321},{"style":1495},[5322],{"type":46,"value":2413},{"type":40,"tag":376,"props":5324,"children":5325},{"style":399},[5326],{"type":46,"value":2370},{"type":40,"tag":376,"props":5328,"children":5329},{"style":1495},[5330],{"type":46,"value":5331},"ConfigDetails ",{"type":40,"tag":376,"props":5333,"children":5334},{"style":399},[5335],{"type":46,"value":2427},{"type":40,"tag":376,"props":5337,"children":5338},{"style":1495},[5339],{"type":46,"value":2432},{"type":40,"tag":376,"props":5341,"children":5342},{"style":399},[5343],{"type":46,"value":2437},{"type":40,"tag":376,"props":5345,"children":5346},{"class":378,"line":389},[5347,5351,5356,5360,5364,5368,5372,5376,5380,5384,5388,5393,5397,5401,5405,5409,5413,5417,5421,5425,5429,5433,5437,5441,5445,5450,5454,5458],{"type":40,"tag":376,"props":5348,"children":5349},{"style":2306},[5350],{"type":46,"value":2309},{"type":40,"tag":376,"props":5352,"children":5353},{"style":1495},[5354],{"type":46,"value":5355}," Overview      ",{"type":40,"tag":376,"props":5357,"children":5358},{"style":399},[5359],{"type":46,"value":2319},{"type":40,"tag":376,"props":5361,"children":5362},{"style":1417},[5363],{"type":46,"value":2324},{"type":40,"tag":376,"props":5365,"children":5366},{"style":1495},[5367],{"type":46,"value":2329},{"type":40,"tag":376,"props":5369,"children":5370},{"style":399},[5371],{"type":46,"value":2334},{"type":40,"tag":376,"props":5373,"children":5374},{"style":2306},[5375],{"type":46,"value":2339},{"type":40,"tag":376,"props":5377,"children":5378},{"style":399},[5379],{"type":46,"value":2344},{"type":40,"tag":376,"props":5381,"children":5382},{"style":1495},[5383],{"type":46,"value":2329},{"type":40,"tag":376,"props":5385,"children":5386},{"style":399},[5387],{"type":46,"value":1298},{"type":40,"tag":376,"props":5389,"children":5390},{"style":405},[5391],{"type":46,"value":5392},".\u002FOverview\u002FOverview",{"type":40,"tag":376,"props":5394,"children":5395},{"style":399},[5396],{"type":46,"value":1298},{"type":40,"tag":376,"props":5398,"children":5399},{"style":1495},[5400],{"type":46,"value":283},{"type":40,"tag":376,"props":5402,"children":5403},{"style":399},[5404],{"type":46,"value":2370},{"type":40,"tag":376,"props":5406,"children":5407},{"style":1417},[5408],{"type":46,"value":2375},{"type":40,"tag":376,"props":5410,"children":5411},{"style":1495},[5412],{"type":46,"value":2329},{"type":40,"tag":376,"props":5414,"children":5415},{"style":2382},[5416],{"type":46,"value":2385},{"type":40,"tag":376,"props":5418,"children":5419},{"style":2306},[5420],{"type":46,"value":2339},{"type":40,"tag":376,"props":5422,"children":5423},{"style":1495},[5424],{"type":46,"value":2394},{"type":40,"tag":376,"props":5426,"children":5427},{"style":399},[5428],{"type":46,"value":2399},{"type":40,"tag":376,"props":5430,"children":5431},{"style":393},[5432],{"type":46,"value":2404},{"type":40,"tag":376,"props":5434,"children":5435},{"style":399},[5436],{"type":46,"value":402},{"type":40,"tag":376,"props":5438,"children":5439},{"style":1495},[5440],{"type":46,"value":2413},{"type":40,"tag":376,"props":5442,"children":5443},{"style":399},[5444],{"type":46,"value":2370},{"type":40,"tag":376,"props":5446,"children":5447},{"style":1495},[5448],{"type":46,"value":5449},"Overview ",{"type":40,"tag":376,"props":5451,"children":5452},{"style":399},[5453],{"type":46,"value":2427},{"type":40,"tag":376,"props":5455,"children":5456},{"style":1495},[5457],{"type":46,"value":2432},{"type":40,"tag":376,"props":5459,"children":5460},{"style":399},[5461],{"type":46,"value":2437},{"type":40,"tag":376,"props":5463,"children":5464},{"class":378,"line":411},[5465],{"type":40,"tag":376,"props":5466,"children":5467},{"emptyLinePlaceholder":497},[5468],{"type":46,"value":500},{"type":40,"tag":376,"props":5470,"children":5471},{"class":378,"line":426},[5472,5476,5481,5485],{"type":40,"tag":376,"props":5473,"children":5474},{"style":2306},[5475],{"type":46,"value":2309},{"type":40,"tag":376,"props":5477,"children":5478},{"style":1495},[5479],{"type":46,"value":5480}," tabs ",{"type":40,"tag":376,"props":5482,"children":5483},{"style":399},[5484],{"type":46,"value":2319},{"type":40,"tag":376,"props":5486,"children":5487},{"style":1495},[5488],{"type":46,"value":5489}," [\n",{"type":40,"tag":376,"props":5491,"children":5492},{"class":378,"line":439},[5493,5498,5502,5506,5510,5515,5519,5523,5527,5531,5536],{"type":40,"tag":376,"props":5494,"children":5495},{"style":399},[5496],{"type":46,"value":5497},"  {",{"type":40,"tag":376,"props":5499,"children":5500},{"style":393},[5501],{"type":46,"value":3712},{"type":40,"tag":376,"props":5503,"children":5504},{"style":399},[5505],{"type":46,"value":402},{"type":40,"tag":376,"props":5507,"children":5508},{"style":399},[5509],{"type":46,"value":1288},{"type":40,"tag":376,"props":5511,"children":5512},{"style":405},[5513],{"type":46,"value":5514},"overview",{"type":40,"tag":376,"props":5516,"children":5517},{"style":399},[5518],{"type":46,"value":1298},{"type":40,"tag":376,"props":5520,"children":5521},{"style":399},[5522],{"type":46,"value":2582},{"type":40,"tag":376,"props":5524,"children":5525},{"style":393},[5526],{"type":46,"value":3764},{"type":40,"tag":376,"props":5528,"children":5529},{"style":399},[5530],{"type":46,"value":402},{"type":40,"tag":376,"props":5532,"children":5533},{"style":1495},[5534],{"type":46,"value":5535}," Overview ",{"type":40,"tag":376,"props":5537,"children":5538},{"style":399},[5539],{"type":46,"value":5540},"},\n",{"type":40,"tag":376,"props":5542,"children":5543},{"class":378,"line":452},[5544,5548,5552,5556,5560,5565,5569,5573,5578,5582,5586],{"type":40,"tag":376,"props":5545,"children":5546},{"style":399},[5547],{"type":46,"value":5497},{"type":40,"tag":376,"props":5549,"children":5550},{"style":393},[5551],{"type":46,"value":3712},{"type":40,"tag":376,"props":5553,"children":5554},{"style":399},[5555],{"type":46,"value":402},{"type":40,"tag":376,"props":5557,"children":5558},{"style":399},[5559],{"type":46,"value":1288},{"type":40,"tag":376,"props":5561,"children":5562},{"style":405},[5563],{"type":46,"value":5564},"config",{"type":40,"tag":376,"props":5566,"children":5567},{"style":399},[5568],{"type":46,"value":1298},{"type":40,"tag":376,"props":5570,"children":5571},{"style":399},[5572],{"type":46,"value":2582},{"type":40,"tag":376,"props":5574,"children":5575},{"style":393},[5576],{"type":46,"value":5577},"   component",{"type":40,"tag":376,"props":5579,"children":5580},{"style":399},[5581],{"type":46,"value":402},{"type":40,"tag":376,"props":5583,"children":5584},{"style":1495},[5585],{"type":46,"value":5237},{"type":40,"tag":376,"props":5587,"children":5588},{"style":399},[5589],{"type":46,"value":5540},{"type":40,"tag":376,"props":5591,"children":5592},{"class":378,"line":480},[5593,5598],{"type":40,"tag":376,"props":5594,"children":5595},{"style":1495},[5596],{"type":46,"value":5597},"]",{"type":40,"tag":376,"props":5599,"children":5600},{"style":399},[5601],{"type":46,"value":2437},{"type":40,"tag":376,"props":5603,"children":5604},{"class":378,"line":493},[5605],{"type":40,"tag":376,"props":5606,"children":5607},{"emptyLinePlaceholder":497},[5608],{"type":46,"value":500},{"type":40,"tag":376,"props":5610,"children":5611},{"class":378,"line":503},[5612],{"type":40,"tag":376,"props":5613,"children":5614},{"style":383},[5615],{"type":46,"value":5616},"\u002F\u002F In the parent that renders the active tab:\n",{"type":40,"tag":376,"props":5618,"children":5619},{"class":378,"line":516},[5620,5624,5628,5632,5636,5640,5644,5648,5652],{"type":40,"tag":376,"props":5621,"children":5622},{"style":399},[5623],{"type":46,"value":3253},{"type":40,"tag":376,"props":5625,"children":5626},{"style":1275},[5627],{"type":46,"value":3284},{"type":40,"tag":376,"props":5629,"children":5630},{"style":2306},[5631],{"type":46,"value":3289},{"type":40,"tag":376,"props":5633,"children":5634},{"style":399},[5635],{"type":46,"value":3294},{"type":40,"tag":376,"props":5637,"children":5638},{"style":1275},[5639],{"type":46,"value":3299},{"type":40,"tag":376,"props":5641,"children":5642},{"style":2306},[5643],{"type":46,"value":3304},{"type":40,"tag":376,"props":5645,"children":5646},{"style":399},[5647],{"type":46,"value":2319},{"type":40,"tag":376,"props":5649,"children":5650},{"style":399},[5651],{"type":46,"value":3313},{"type":40,"tag":376,"props":5653,"children":5654},{"style":399},[5655],{"type":46,"value":4369},{"type":40,"tag":376,"props":5657,"children":5658},{"class":378,"line":529},[5659,5663,5668,5673,5677,5682],{"type":40,"tag":376,"props":5660,"children":5661},{"style":399},[5662],{"type":46,"value":5497},{"type":40,"tag":376,"props":5664,"children":5665},{"style":1495},[5666],{"type":46,"value":5667},"ActiveTab ",{"type":40,"tag":376,"props":5669,"children":5670},{"style":399},[5671],{"type":46,"value":5672},"&&",{"type":40,"tag":376,"props":5674,"children":5675},{"style":399},[5676],{"type":46,"value":3279},{"type":40,"tag":376,"props":5678,"children":5679},{"style":1275},[5680],{"type":46,"value":5681},"ActiveTab",{"type":40,"tag":376,"props":5683,"children":5684},{"style":399},[5685],{"type":46,"value":5686}," \u002F>}\n",{"type":40,"tag":376,"props":5688,"children":5689},{"class":378,"line":547},[5690,5695,5699],{"type":40,"tag":376,"props":5691,"children":5692},{"style":399},[5693],{"type":46,"value":5694},"\u003C\u002F",{"type":40,"tag":376,"props":5696,"children":5697},{"style":1275},[5698],{"type":46,"value":3284},{"type":40,"tag":376,"props":5700,"children":5701},{"style":399},[5702],{"type":46,"value":4387},{"type":40,"tag":49,"props":5704,"children":5705},{},[5706,5708,5713,5714,5720,5721,5727,5728,5734,5735,5741,5743,5748],{"type":46,"value":5707},"For ",{"type":40,"tag":72,"props":5709,"children":5710},{},[5711],{"type":46,"value":5712},"datasource plugins",{"type":46,"value":2394},{"type":40,"tag":53,"props":5715,"children":5717},{"className":5716},[],[5718],{"type":46,"value":5719},"setConfigEditor",{"type":46,"value":275},{"type":40,"tag":53,"props":5722,"children":5724},{"className":5723},[],[5725],{"type":46,"value":5726},"setQueryEditor",{"type":46,"value":275},{"type":40,"tag":53,"props":5729,"children":5731},{"className":5730},[],[5732],{"type":46,"value":5733},"VariableSupport",{"type":46,"value":275},{"type":40,"tag":53,"props":5736,"children":5738},{"className":5737},[],[5739],{"type":46,"value":5740},"AnnotationSupport",{"type":46,"value":5742},"), see ",{"type":40,"tag":1236,"props":5744,"children":5746},{"href":5745},"references\u002Fdatasource-plugins.md",[5747],{"type":46,"value":5745},{"type":46,"value":2370},{"type":40,"tag":332,"props":5750,"children":5751},{},[],{"type":40,"tag":80,"props":5753,"children":5755},{"id":5754},"step-6-group-related-chunks-if-over-splitting",[5756],{"type":46,"value":5757},"Step 6: Group related chunks if over-splitting",{"type":40,"tag":49,"props":5759,"children":5760},{},[5761],{"type":46,"value":5762},"If the build produces more than ~25 JS files, use webpack magic comments:",{"type":40,"tag":365,"props":5764,"children":5766},{"className":2558,"code":5765,"language":2560,"meta":370,"style":370},"const FleetList   = lazy(() => import(\u002F* webpackChunkName: \"fleet\" *\u002F '..\u002Fpages\u002FFleetList'));\nconst FleetDetail = lazy(() => import(\u002F* webpackChunkName: \"fleet\" *\u002F '..\u002Fpages\u002FFleetDetail'));\n",[5767],{"type":40,"tag":53,"props":5768,"children":5769},{"__ignoreMap":370},[5770,5836],{"type":40,"tag":376,"props":5771,"children":5772},{"class":378,"line":379},[5773,5777,5782,5786,5790,5794,5798,5802,5806,5810,5815,5819,5824,5828,5832],{"type":40,"tag":376,"props":5774,"children":5775},{"style":2306},[5776],{"type":46,"value":2309},{"type":40,"tag":376,"props":5778,"children":5779},{"style":1495},[5780],{"type":46,"value":5781}," FleetList   ",{"type":40,"tag":376,"props":5783,"children":5784},{"style":399},[5785],{"type":46,"value":2319},{"type":40,"tag":376,"props":5787,"children":5788},{"style":1417},[5789],{"type":46,"value":2324},{"type":40,"tag":376,"props":5791,"children":5792},{"style":1495},[5793],{"type":46,"value":2329},{"type":40,"tag":376,"props":5795,"children":5796},{"style":399},[5797],{"type":46,"value":2334},{"type":40,"tag":376,"props":5799,"children":5800},{"style":2306},[5801],{"type":46,"value":2339},{"type":40,"tag":376,"props":5803,"children":5804},{"style":1417},[5805],{"type":46,"value":2344},{"type":40,"tag":376,"props":5807,"children":5808},{"style":1495},[5809],{"type":46,"value":2329},{"type":40,"tag":376,"props":5811,"children":5812},{"style":383},[5813],{"type":46,"value":5814},"\u002F* webpackChunkName: \"fleet\" *\u002F",{"type":40,"tag":376,"props":5816,"children":5817},{"style":399},[5818],{"type":46,"value":1288},{"type":40,"tag":376,"props":5820,"children":5821},{"style":405},[5822],{"type":46,"value":5823},"..\u002Fpages\u002FFleetList",{"type":40,"tag":376,"props":5825,"children":5826},{"style":399},[5827],{"type":46,"value":1298},{"type":40,"tag":376,"props":5829,"children":5830},{"style":1495},[5831],{"type":46,"value":2501},{"type":40,"tag":376,"props":5833,"children":5834},{"style":399},[5835],{"type":46,"value":2437},{"type":40,"tag":376,"props":5837,"children":5838},{"class":378,"line":389},[5839,5843,5848,5852,5856,5860,5864,5868,5872,5876,5880,5884,5889,5893,5897],{"type":40,"tag":376,"props":5840,"children":5841},{"style":2306},[5842],{"type":46,"value":2309},{"type":40,"tag":376,"props":5844,"children":5845},{"style":1495},[5846],{"type":46,"value":5847}," FleetDetail ",{"type":40,"tag":376,"props":5849,"children":5850},{"style":399},[5851],{"type":46,"value":2319},{"type":40,"tag":376,"props":5853,"children":5854},{"style":1417},[5855],{"type":46,"value":2324},{"type":40,"tag":376,"props":5857,"children":5858},{"style":1495},[5859],{"type":46,"value":2329},{"type":40,"tag":376,"props":5861,"children":5862},{"style":399},[5863],{"type":46,"value":2334},{"type":40,"tag":376,"props":5865,"children":5866},{"style":2306},[5867],{"type":46,"value":2339},{"type":40,"tag":376,"props":5869,"children":5870},{"style":1417},[5871],{"type":46,"value":2344},{"type":40,"tag":376,"props":5873,"children":5874},{"style":1495},[5875],{"type":46,"value":2329},{"type":40,"tag":376,"props":5877,"children":5878},{"style":383},[5879],{"type":46,"value":5814},{"type":40,"tag":376,"props":5881,"children":5882},{"style":399},[5883],{"type":46,"value":1288},{"type":40,"tag":376,"props":5885,"children":5886},{"style":405},[5887],{"type":46,"value":5888},"..\u002Fpages\u002FFleetDetail",{"type":40,"tag":376,"props":5890,"children":5891},{"style":399},[5892],{"type":46,"value":1298},{"type":40,"tag":376,"props":5894,"children":5895},{"style":1495},[5896],{"type":46,"value":2501},{"type":40,"tag":376,"props":5898,"children":5899},{"style":399},[5900],{"type":46,"value":2437},{"type":40,"tag":49,"props":5902,"children":5903},{},[5904,5906,5912],{"type":46,"value":5905},"One ",{"type":40,"tag":53,"props":5907,"children":5909},{"className":5908},[],[5910],{"type":46,"value":5911},"webpackChunkName",{"type":46,"value":5913}," per logical feature area. Don't group unrelated pages.",{"type":40,"tag":332,"props":5915,"children":5916},{},[],{"type":40,"tag":80,"props":5918,"children":5920},{"id":5919},"step-7-measure-and-verify",[5921],{"type":46,"value":5922},"Step 7: Measure and verify",{"type":40,"tag":365,"props":5924,"children":5926},{"className":1255,"code":5925,"language":1257,"meta":370,"style":370},"yarn build 2>\u002Fdev\u002Fnull || npm run build\necho \"=== module.js ===\" && ls -lah dist\u002Fmodule.js\necho \"=== all JS chunks (largest first) ===\" && ls -lah dist\u002F*.js | sort -k5 -rh | head -30\necho \"=== chunk count ===\" && ls dist\u002F*.js | wc -l\n",[5927],{"type":40,"tag":53,"props":5928,"children":5929},{"__ignoreMap":370},[5930,5965,6000,6073],{"type":40,"tag":376,"props":5931,"children":5932},{"class":378,"line":379},[5933,5937,5941,5945,5949,5953,5957,5961],{"type":40,"tag":376,"props":5934,"children":5935},{"style":1275},[5936],{"type":46,"value":1377},{"type":40,"tag":376,"props":5938,"children":5939},{"style":405},[5940],{"type":46,"value":1382},{"type":40,"tag":376,"props":5942,"children":5943},{"style":399},[5944],{"type":46,"value":1341},{"type":40,"tag":376,"props":5946,"children":5947},{"style":405},[5948],{"type":46,"value":1391},{"type":40,"tag":376,"props":5950,"children":5951},{"style":399},[5952],{"type":46,"value":1396},{"type":40,"tag":376,"props":5954,"children":5955},{"style":1275},[5956],{"type":46,"value":1401},{"type":40,"tag":376,"props":5958,"children":5959},{"style":405},[5960],{"type":46,"value":1406},{"type":40,"tag":376,"props":5962,"children":5963},{"style":405},[5964],{"type":46,"value":1411},{"type":40,"tag":376,"props":5966,"children":5967},{"class":378,"line":389},[5968,5972,5976,5980,5984,5988,5992,5996],{"type":40,"tag":376,"props":5969,"children":5970},{"style":1417},[5971],{"type":46,"value":1420},{"type":40,"tag":376,"props":5973,"children":5974},{"style":399},[5975],{"type":46,"value":1425},{"type":40,"tag":376,"props":5977,"children":5978},{"style":405},[5979],{"type":46,"value":1430},{"type":40,"tag":376,"props":5981,"children":5982},{"style":399},[5983],{"type":46,"value":1435},{"type":40,"tag":376,"props":5985,"children":5986},{"style":399},[5987],{"type":46,"value":1440},{"type":40,"tag":376,"props":5989,"children":5990},{"style":1275},[5991],{"type":46,"value":1445},{"type":40,"tag":376,"props":5993,"children":5994},{"style":405},[5995],{"type":46,"value":1450},{"type":40,"tag":376,"props":5997,"children":5998},{"style":405},[5999],{"type":46,"value":1455},{"type":40,"tag":376,"props":6001,"children":6002},{"class":378,"line":411},[6003,6007,6011,6016,6020,6024,6028,6032,6036,6040,6044,6048,6052,6056,6060,6064,6068],{"type":40,"tag":376,"props":6004,"children":6005},{"style":1417},[6006],{"type":46,"value":1420},{"type":40,"tag":376,"props":6008,"children":6009},{"style":399},[6010],{"type":46,"value":1425},{"type":40,"tag":376,"props":6012,"children":6013},{"style":405},[6014],{"type":46,"value":6015},"=== all JS chunks (largest first) ===",{"type":40,"tag":376,"props":6017,"children":6018},{"style":399},[6019],{"type":46,"value":1435},{"type":40,"tag":376,"props":6021,"children":6022},{"style":399},[6023],{"type":46,"value":1440},{"type":40,"tag":376,"props":6025,"children":6026},{"style":1275},[6027],{"type":46,"value":1445},{"type":40,"tag":376,"props":6029,"children":6030},{"style":405},[6031],{"type":46,"value":1450},{"type":40,"tag":376,"props":6033,"children":6034},{"style":405},[6035],{"type":46,"value":1492},{"type":40,"tag":376,"props":6037,"children":6038},{"style":1495},[6039],{"type":46,"value":1498},{"type":40,"tag":376,"props":6041,"children":6042},{"style":405},[6043],{"type":46,"value":1503},{"type":40,"tag":376,"props":6045,"children":6046},{"style":399},[6047],{"type":46,"value":1508},{"type":40,"tag":376,"props":6049,"children":6050},{"style":1275},[6051],{"type":46,"value":1513},{"type":40,"tag":376,"props":6053,"children":6054},{"style":405},[6055],{"type":46,"value":1518},{"type":40,"tag":376,"props":6057,"children":6058},{"style":405},[6059],{"type":46,"value":1523},{"type":40,"tag":376,"props":6061,"children":6062},{"style":399},[6063],{"type":46,"value":1508},{"type":40,"tag":376,"props":6065,"children":6066},{"style":1275},[6067],{"type":46,"value":1532},{"type":40,"tag":376,"props":6069,"children":6070},{"style":405},[6071],{"type":46,"value":6072}," -30\n",{"type":40,"tag":376,"props":6074,"children":6075},{"class":378,"line":426},[6076,6080,6084,6088,6092,6096,6100,6104,6108,6112,6116,6120],{"type":40,"tag":376,"props":6077,"children":6078},{"style":1417},[6079],{"type":46,"value":1420},{"type":40,"tag":376,"props":6081,"children":6082},{"style":399},[6083],{"type":46,"value":1425},{"type":40,"tag":376,"props":6085,"children":6086},{"style":405},[6087],{"type":46,"value":1553},{"type":40,"tag":376,"props":6089,"children":6090},{"style":399},[6091],{"type":46,"value":1435},{"type":40,"tag":376,"props":6093,"children":6094},{"style":399},[6095],{"type":46,"value":1440},{"type":40,"tag":376,"props":6097,"children":6098},{"style":1275},[6099],{"type":46,"value":1445},{"type":40,"tag":376,"props":6101,"children":6102},{"style":405},[6103],{"type":46,"value":1492},{"type":40,"tag":376,"props":6105,"children":6106},{"style":1495},[6107],{"type":46,"value":1498},{"type":40,"tag":376,"props":6109,"children":6110},{"style":405},[6111],{"type":46,"value":1503},{"type":40,"tag":376,"props":6113,"children":6114},{"style":399},[6115],{"type":46,"value":1508},{"type":40,"tag":376,"props":6117,"children":6118},{"style":1275},[6119],{"type":46,"value":1586},{"type":40,"tag":376,"props":6121,"children":6122},{"style":405},[6123],{"type":46,"value":1591},{"type":40,"tag":92,"props":6125,"children":6126},{},[6127,6143],{"type":40,"tag":96,"props":6128,"children":6129},{},[6130],{"type":40,"tag":100,"props":6131,"children":6132},{},[6133,6138],{"type":40,"tag":104,"props":6134,"children":6135},{},[6136],{"type":46,"value":6137},"Metric",{"type":40,"tag":104,"props":6139,"children":6140},{},[6141],{"type":46,"value":6142},"Target",{"type":40,"tag":125,"props":6144,"children":6145},{},[6146,6164,6177],{"type":40,"tag":100,"props":6147,"children":6148},{},[6149,6159],{"type":40,"tag":132,"props":6150,"children":6151},{},[6152,6157],{"type":40,"tag":53,"props":6153,"children":6155},{"className":6154},[],[6156],{"type":46,"value":58},{"type":46,"value":6158}," size",{"type":40,"tag":132,"props":6160,"children":6161},{},[6162],{"type":46,"value":6163},"\u003C 200 KB",{"type":40,"tag":100,"props":6165,"children":6166},{},[6167,6172],{"type":40,"tag":132,"props":6168,"children":6169},{},[6170],{"type":46,"value":6171},"Total JS chunk count",{"type":40,"tag":132,"props":6173,"children":6174},{},[6175],{"type":46,"value":6176},"15–25",{"type":40,"tag":100,"props":6178,"children":6179},{},[6180,6185],{"type":40,"tag":132,"props":6181,"children":6182},{},[6183],{"type":46,"value":6184},"Largest single chunk",{"type":40,"tag":132,"props":6186,"children":6187},{},[6188],{"type":46,"value":6189},"\u003C 1 MB",{"type":40,"tag":365,"props":6191,"children":6193},{"className":1255,"code":6192,"language":1257,"meta":370,"style":370},"# Analyse bundle composition if a chunk is unexpectedly large\nnpx webpack-bundle-analyzer dist\u002Fstats.json 2>\u002Fdev\u002Fnull\n",[6194],{"type":40,"tag":53,"props":6195,"children":6196},{"__ignoreMap":370},[6197,6205],{"type":40,"tag":376,"props":6198,"children":6199},{"class":378,"line":379},[6200],{"type":40,"tag":376,"props":6201,"children":6202},{"style":383},[6203],{"type":46,"value":6204},"# Analyse bundle composition if a chunk is unexpectedly large\n",{"type":40,"tag":376,"props":6206,"children":6207},{"class":378,"line":389},[6208,6212,6217,6222,6226],{"type":40,"tag":376,"props":6209,"children":6210},{"style":1275},[6211],{"type":46,"value":1726},{"type":40,"tag":376,"props":6213,"children":6214},{"style":405},[6215],{"type":46,"value":6216}," webpack-bundle-analyzer",{"type":40,"tag":376,"props":6218,"children":6219},{"style":405},[6220],{"type":46,"value":6221}," dist\u002Fstats.json",{"type":40,"tag":376,"props":6223,"children":6224},{"style":399},[6225],{"type":46,"value":1341},{"type":40,"tag":376,"props":6227,"children":6228},{"style":405},[6229],{"type":46,"value":1346},{"type":40,"tag":332,"props":6231,"children":6232},{},[],{"type":40,"tag":80,"props":6234,"children":6236},{"id":6235},"step-8-test-the-running-plugin",[6237],{"type":46,"value":6238},"Step 8: Test the running plugin",{"type":40,"tag":6240,"props":6241,"children":6242},"ol",{},[6243,6248,6260,6270,6282],{"type":40,"tag":3799,"props":6244,"children":6245},{},[6246],{"type":46,"value":6247},"Open the plugin in a Grafana instance",{"type":40,"tag":3799,"props":6249,"children":6250},{},[6251,6253,6258],{"type":46,"value":6252},"Navigate to ",{"type":40,"tag":72,"props":6254,"children":6255},{},[6256],{"type":46,"value":6257},"every route",{"type":46,"value":6259}," — each triggers a new chunk download",{"type":40,"tag":3799,"props":6261,"children":6262},{},[6263,6268],{"type":40,"tag":72,"props":6264,"children":6265},{},[6266],{"type":46,"value":6267},"DevTools → Network → JS",{"type":46,"value":6269},": confirm lazy chunks load on navigation, not all upfront",{"type":40,"tag":3799,"props":6271,"children":6272},{},[6273,6275,6280],{"type":46,"value":6274},"Check ",{"type":40,"tag":72,"props":6276,"children":6277},{},[6278],{"type":46,"value":6279},"Console",{"type":46,"value":6281}," for errors",{"type":40,"tag":3799,"props":6283,"children":6284},{},[6285,6287,6292],{"type":46,"value":6286},"Test any ",{"type":40,"tag":53,"props":6288,"children":6290},{"className":6289},[],[6291],{"type":46,"value":3699},{"type":46,"value":6293}," extensions from other Grafana apps",{"type":40,"tag":49,"props":6295,"children":6296},{},[6297,6299,6304],{"type":46,"value":6298},"For troubleshooting common issues, see ",{"type":40,"tag":1236,"props":6300,"children":6302},{"href":6301},"references\u002Ftroubleshooting.md",[6303],{"type":46,"value":6301},{"type":46,"value":2370},{"type":40,"tag":332,"props":6306,"children":6307},{},[],{"type":40,"tag":80,"props":6309,"children":6311},{"id":6310},"references",[6312],{"type":46,"value":6313},"References",{"type":40,"tag":3795,"props":6315,"children":6316},{},[6317,6329,6341,6351,6361],{"type":40,"tag":3799,"props":6318,"children":6319},{},[6320,6327],{"type":40,"tag":1236,"props":6321,"children":6324},{"href":6322,"rel":6323},"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgrafana-collector-app",[1240],[6325],{"type":46,"value":6326},"grafana-collector-app",{"type":46,"value":6328}," — app plugin reference implementation",{"type":40,"tag":3799,"props":6330,"children":6331},{},[6332,6339],{"type":40,"tag":1236,"props":6333,"children":6336},{"href":6334,"rel":6335},"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fplugin-actions",[1240],[6337],{"type":46,"value":6338},"grafana\u002Fplugin-actions",{"type":46,"value":6340}," — official Grafana plugin CI actions",{"type":40,"tag":3799,"props":6342,"children":6343},{},[6344],{"type":40,"tag":1236,"props":6345,"children":6348},{"href":6346,"rel":6347},"https:\u002F\u002Fweb.dev\u002Farticles\u002Fcode-splitting-suspense",[1240],[6349],{"type":46,"value":6350},"Web.dev — code splitting with lazy and Suspense",{"type":40,"tag":3799,"props":6352,"children":6353},{},[6354],{"type":40,"tag":1236,"props":6355,"children":6358},{"href":6356,"rel":6357},"https:\u002F\u002Fsurvivejs.com\u002Fbooks\u002Fwebpack\u002Fbuilding\u002Fcode-splitting\u002F",[1240],[6359],{"type":46,"value":6360},"SurviveJS — webpack code splitting",{"type":40,"tag":3799,"props":6362,"children":6363},{},[6364],{"type":40,"tag":1236,"props":6365,"children":6368},{"href":6366,"rel":6367},"https:\u002F\u002Fwebpack.js.org\u002Fapi\u002Fmodule-methods\u002F#magic-comments",[1240],[6369],{"type":46,"value":6370},"webpack magic comments",{"type":40,"tag":6372,"props":6373,"children":6374},"style",{},[6375],{"type":46,"value":6376},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":6378,"total":6568},[6379,6398,6417,6437,6452,6468,6481,6496,6513,6528,6541,6556],{"slug":6380,"name":6380,"fn":6381,"description":6382,"org":6383,"tags":6384,"stars":6395,"repoUrl":6396,"updatedAt":6397},"faro-setup-web","instrument web apps with Grafana Faro","Instruments a web app with Grafana Faro Web SDK for frontend observability. Use when setting up error tracking, Web Vitals, session monitoring, or distributed tracing in a browser app.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6385,6388,6389,6392],{"name":6386,"slug":6387,"type":15},"Distributed Tracing","distributed-tracing",{"name":21,"slug":22,"type":15},{"name":6390,"slug":6391,"type":15},"Monitoring","monitoring",{"name":6393,"slug":6394,"type":15},"Observability","observability",1103,"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Ffaro-web-sdk","2026-07-12T07:43:24.63314",{"slug":6399,"name":6399,"fn":6400,"description":6401,"org":6402,"tags":6403,"stars":6414,"repoUrl":6415,"updatedAt":6416},"configuring-yesoreyeram-infinity-datasource","configure Grafana Infinity data source","Configure the Infinity data source — base URL and allowed hosts, the authentication methods (basic, bearer token, API key, digest, OAuth passthrough, OAuth 2.0 client credentials\u002FJWT, Azure, Azure Blob, AWS), TLS, custom HTTP headers, network and security settings, the custom health check, and provisioning with a config file. Use when a user asks how to set up, configure, or change settings for the Infinity data source; how to authenticate to an API; how to allow hosts; how to provision it as YAML; or how to troubleshoot connection, authentication, or health-check issues.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6404,6407,6410,6413],{"name":6405,"slug":6406,"type":15},"API Development","api-development",{"name":6408,"slug":6409,"type":15},"Authentication","authentication",{"name":6411,"slug":6412,"type":15},"Configuration","configuration",{"name":9,"slug":8,"type":15},1056,"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgrafana-infinity-datasource","2026-07-12T07:43:25.939136",{"slug":6418,"name":6418,"fn":6419,"description":6420,"org":6421,"tags":6422,"stars":6414,"repoUrl":6415,"updatedAt":6436},"querying-yesoreyeram-infinity-datasource","query data with Infinity datasource","Build queries with the Infinity data source — the query types (JSON, CSV, TSV, XML, GraphQL, HTML, UQL, GROQ, Google Sheets, Series, Transformations), the parsers (Frontend\u002Fsimple, Backend JSONata, JQ, UQL, GROQ) and which support alerting, the sources (URL, Inline, Reference, Azure Blob, Random walk), output formats (table, timeseries, logs, trace, node graph, dataframe), root selector and columns, computed columns\u002Ffilters\u002Fsummarize, pagination, and template variables. Use when a user asks how to query Infinity; how to fetch JSON\u002FCSV\u002FXML\u002FGraphQL\u002FHTML from a URL or inline; how to select rows and columns; how to transform data with UQL\u002FGROQ\u002FJSONata\u002FJQ; how to make a query work with alerting; how to paginate; or how to use variables in a query.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6423,6426,6429,6430,6433],{"name":6424,"slug":6425,"type":15},"CSV","csv",{"name":6427,"slug":6428,"type":15},"Data Analysis","data-analysis",{"name":9,"slug":8,"type":15},{"name":6431,"slug":6432,"type":15},"GraphQL","graphql",{"name":6434,"slug":6435,"type":15},"JSON","json","2026-07-15T05:34:05.773947",{"slug":6438,"name":6438,"fn":6439,"description":6440,"org":6441,"tags":6442,"stars":6449,"repoUrl":6450,"updatedAt":6451},"agento11y","manage Grafana Agent Observability resources","Inspects and manages Grafana Agent Observability resources via gcx: conversations, generations, evaluators, rules, scores, and templates. Use when the user wants to list or search conversations, inspect generations, manage evaluators (upsert, test, delete), set up evaluation rules, check scores, or browse evaluator templates. Trigger on phrases like \"list conversations\", \"search generations\", \"what did the agent do\", \"debug LLM conversation\", \"create evaluator\", \"set up evaluation rule\", \"test evaluator\", \"check scores\", \"evaluate generation quality\", or \"set up online evaluation\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6443,6446,6447,6448],{"name":6444,"slug":6445,"type":15},"Agents","agents",{"name":9,"slug":8,"type":15},{"name":6390,"slug":6391,"type":15},{"name":6393,"slug":6394,"type":15},430,"https:\u002F\u002Fgithub.com\u002Fgrafana\u002Fgcx","2026-07-25T05:30:40.29622",{"slug":6453,"name":6453,"fn":6454,"description":6455,"org":6456,"tags":6457,"stars":6449,"repoUrl":6450,"updatedAt":6467},"agento11y-instrument","instrument LLM apps for agent observability","Sets up and instruments a developer's own LLM app or agent to send generations and agentic workflow to Grafana Agent Observability (the Agent Observability SDKs) — greenfield setup, fixing broken instrumentation, or filling gaps in existing instrumentation. Uses gcx for the parts a static prompt can't do: `gcx login` \u002F `gcx cloud stacks` to find the stack, and `gcx agento11y agents|conversations|generations` to VERIFY that data actually lands — so it iterates (instrument → run → verify → fix) until generations arrive, not blindly. Reads the app's code, detects language\u002Fframework, classifies instrumentation state (none \u002F partial \u002F broken), then runs a fixed gap checklist whose #1 item is the silent failure no other prompt catches: the SDK emits OTel spans\u002Fmetrics but never creates a TracerProvider\u002FMeterProvider, so without them all metrics go to a no-op and are lost. Also checks agent_version (required for per-version Performance charts), set_result completeness, SYNC vs STREAM, parent_generation_ids DAG links, and workflow-step coverage. Recommends changes citing file:line and, only with explicit confirmation, applies minimal diffs that don't change app behavior. Pulls SDK reference from agento11y's llms.txt rather than restating it, and hands off to `agento11y-test-starter` once data flows. It does NOT write test suites or set up tenant evaluations, rules, or guards — offline test suites are `agento11y-test-starter`, tenant eval rules + guards are `agento11y-prod-setup`; does NOT install coding-agent telemetry plugins (that is llms.txt \"Path A\"); does NOT mint or store credentials or invent endpoints. Trigger on phrases like \"instrument my app\", \"send my agent's traces to Grafana\", \"set up AI observability for my app\", \"my generations aren't showing up\", \"why is Performance empty\", \"add Agent Observability to my code\", \"fix my instrumentation\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6458,6459,6460,6463,6466],{"name":6444,"slug":6445,"type":15},{"name":9,"slug":8,"type":15},{"name":6461,"slug":6462,"type":15},"Instrumentation","instrumentation",{"name":6464,"slug":6465,"type":15},"LLM","llm",{"name":6393,"slug":6394,"type":15},"2026-07-31T05:53:52.580237",{"slug":6469,"name":6469,"fn":6470,"description":6471,"org":6472,"tags":6473,"stars":6449,"repoUrl":6450,"updatedAt":6480},"agento11y-prod-setup","setup production evaluation for AI agents","Sets up production evaluation and guardrails for a DEPLOYED AI agent in Grafana Agent Observability, grounded in the agent's own code and its real ingested traffic. The judgment layer on top of the `agento11y` skill: it reads the agent's source (system prompt, tools, entrypoint) AND samples its live traffic via gcx, checks what evaluators\u002Frules\u002Fguards already exist, then recommends only what's missing — online eval rules (score live conversations for regressions) and guards (warn-first request-path policies that redact \u002F tool-filter and may later be promoted to deny). It drafts reviewable YAML and, only with explicit confirmation, applies via `gcx agento11y`. New guards are drafted in warn mode (safe on live traffic — warn records but never blocks). It DOES create stack-level objects — that is the point — but every write is confirmed. It never rewrites or redeploys the agent. Trigger on phrases like \"set up production evaluation\", \"my agent is in prod what should I evaluate\", \"catch quality regressions\", \"add guardrails to my agent\", \"redact PII from my agent\", \"block dangerous tools\", \"set up online evals and guards\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6474,6475,6478,6479],{"name":6444,"slug":6445,"type":15},{"name":6476,"slug":6477,"type":15},"Evals","evals",{"name":9,"slug":8,"type":15},{"name":6393,"slug":6394,"type":15},"2026-07-31T05:53:53.576347",{"slug":6482,"name":6482,"fn":6483,"description":6484,"org":6485,"tags":6486,"stars":6449,"repoUrl":6450,"updatedAt":6495},"agento11y-test-starter","build and run agent test suites","Use early in an AI-agent project — before ship, before real traffic — to build a starter test suite for the agent and run it offline. Reads the agent's own code (system prompt, tools, task), writes a labeled draft suite of test cases (happy\u002Fedge\u002Fadversarial) grounded in real lines, and recommends how to score each case (the evaluators\u002Fjudges the offline runner uses). Assesses how runnable the agent is: for an easily-invoked agent it generates a runner stub (run_experiment.py) with two holes to fill and can optionally run it (only with permission, only against the endpoint the developer configured); for agents needing a harness or full runtime it points to the existing eval infra. It runs OFFLINE and never creates tenant-level evaluators, rules, or guards — that is `agento11y-prod-setup`, for a deployed agent with real traffic. Trigger on phrases like \"how do I test my agent before shipping\", \"write test cases for my agent\", \"set up tests for my agent\", \"check my agent before prod\", \"I have no traffic yet, how do I evaluate it\", \"test my agent offline\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6487,6488,6489,6492],{"name":6444,"slug":6445,"type":15},{"name":9,"slug":8,"type":15},{"name":6490,"slug":6491,"type":15},"QA","qa",{"name":6493,"slug":6494,"type":15},"Testing","testing","2026-07-31T05:53:51.62785",{"slug":6497,"name":6497,"fn":6498,"description":6499,"org":6500,"tags":6501,"stars":6449,"repoUrl":6450,"updatedAt":6512},"create-dashboard","create Grafana dashboards with gcx","Designs and creates Grafana dashboards with gcx, using `gcx dashboards snapshot` as a visual feedback loop. Use when the user wants to create a new Grafana dashboard, add panels, variables, or annotations to an existing dashboard, design dashboard panels, variables, queries, or layout, or make a material visual redesign. Triggers on \"create dashboard\", \"new dashboard\", \"build dashboard\", \"dashboard for \u003Cservice>\", \"add panels\", \"add variable\", \"add annotation\", \"improve this dashboard\", or \"iterate on a dashboard\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6502,6505,6508,6511],{"name":6503,"slug":6504,"type":15},"Dashboards","dashboards",{"name":6506,"slug":6507,"type":15},"Data Visualization","data-visualization",{"name":6509,"slug":6510,"type":15},"Design","design",{"name":9,"slug":8,"type":15},"2026-07-25T05:30:46.289717",{"slug":6514,"name":6514,"fn":6515,"description":6516,"org":6517,"tags":6518,"stars":6449,"repoUrl":6450,"updatedAt":6527},"debug-with-grafana","investigate application issues with Grafana","Structured workflow for investigating application problems with Grafana observability data (metrics, logs, traces) via gcx. Covers live firefighting AND retrospective incident analysis: incident triage, root-cause analysis, blast-radius checks (did an incident spill into other services), verifying whether a deployment or rollout triggered an incident, finding which service, endpoint, or path owns the most errors or slow requests, checking whether retries or queue backlogs piled up, and quantifying error or latency shares over a time window. Trigger on: \"my API is returning 500 errors\", \"latency is spiking\", \"investigate why requests are failing\", \"triage the incident\", \"blast radius\", \"root cause\", \"did the rollout cause it\", \"which endpoint owns the most 5xx\", \"did retries pile up\", or any request to analyse an earlier incident window using telemetry. For authoring dashboards use create-dashboard; for dashboard inventory use manage-dashboards.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6519,6522,6523,6526],{"name":6520,"slug":6521,"type":15},"Debugging","debugging",{"name":9,"slug":8,"type":15},{"name":6524,"slug":6525,"type":15},"Incident Response","incident-response",{"name":6393,"slug":6394,"type":15},"2026-07-18T05:11:10.445428",{"slug":6529,"name":6529,"fn":6530,"description":6531,"org":6532,"tags":6533,"stars":6449,"repoUrl":6450,"updatedAt":6540},"diagnose-entity-graph","diagnose Grafana Entity Graph issues","Diagnose Entity Graph problems: missing entities, missing edges, disconnected clusters, or filtering issues. Use when the user reports that Entity Graph doesn't look right, services are missing, edges aren't appearing, or environments can't be filtered. Triggers for: \"entity graph is empty\", \"services missing from entity graph\", \"no edges in entity graph\", \"disconnected services\", \"can't filter entity graph\", \"entity graph not working\", \"diagnose entity graph\", \"debug knowledge graph\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6534,6535,6536,6539],{"name":6520,"slug":6521,"type":15},{"name":9,"slug":8,"type":15},{"name":6537,"slug":6538,"type":15},"Graph Analysis","graph-analysis",{"name":6393,"slug":6394,"type":15},"2026-07-25T05:30:39.380934",{"slug":6542,"name":6542,"fn":6543,"description":6544,"org":6545,"tags":6546,"stars":6449,"repoUrl":6450,"updatedAt":6555},"gcx","manage Grafana Cloud resources via gcx","Manages Grafana Cloud resources via the gcx CLI. Trigger when the user wants to inspect, create, update, delete, query, or automate any Grafana resource - dashboards, datasources, alerts, SLOs, synthetic checks, oncall, incidents, fleet, k6, knowledge graph, or adaptive telemetry.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6547,6550,6551,6552],{"name":6548,"slug":6549,"type":15},"CLI","cli",{"name":9,"slug":8,"type":15},{"name":6390,"slug":6391,"type":15},{"name":6553,"slug":6554,"type":15},"Operations","operations","2026-07-31T05:53:50.587304",{"slug":6557,"name":6557,"fn":6558,"description":6559,"org":6560,"tags":6561,"stars":6449,"repoUrl":6450,"updatedAt":6567},"gcx-demo","present gcx demo tours","Run a narrated, read-only demo tour of gcx for customer or colleague presentations. Showcases the breadth of gcx across every Grafana Cloud product area — resources, datasources, metrics, logs, traces, SLOs, alerts, synthetic monitoring, IRM, k6, fleet, and more. All commands are strictly read-only. Trigger when the user says \"demo gcx\", \"show off gcx\", \"customer demo\", \"gcx tour\", or \"\u002Fgcx-demo\".\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6562,6563,6564],{"name":6548,"slug":6549,"type":15},{"name":9,"slug":8,"type":15},{"name":6565,"slug":6566,"type":15},"Presentations","presentations","2026-07-25T05:30:45.282458",80,{"items":6570,"total":6675},[6571,6586,6601,6617,6630,6646,6660],{"slug":6572,"name":6572,"fn":6573,"description":6574,"org":6575,"tags":6576,"stars":23,"repoUrl":24,"updatedAt":6585},"adaptive-metrics","optimize Grafana Cloud metrics costs","Cut Grafana Cloud Metrics cost by shrinking active-series count with Adaptive Metrics aggregation rules — auto-recommendations from query history, custom exact\u002Fregex rules, label-drop config, unused-metric detection, and Alloy remote_write fallback. Use when investigating a high Mimir\u002FGrafana Cloud bill, hunting high-cardinality labels (`pod_uid`, `service_instance_id`, `version`), pre-aggregating counters\u002Fgauges, dropping unused metrics, or measuring `grafanacloud_instance_active_series` before\u002Fafter — even when the user says \"reduce cardinality\", \"too many series\", \"metrics spend\", \"active series count is exploding\", or \"drop the version label\" without naming Adaptive Metrics.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6577,6580,6581,6584],{"name":6578,"slug":6579,"type":15},"Cost Optimization","cost-optimization",{"name":9,"slug":8,"type":15},{"name":6582,"slug":6583,"type":15},"Metrics","metrics",{"name":6393,"slug":6394,"type":15},"2026-07-12T07:44:27.451068",{"slug":6587,"name":6587,"fn":6588,"description":6589,"org":6590,"tags":6591,"stars":23,"repoUrl":24,"updatedAt":6600},"admin","manage Grafana Cloud accounts and RBAC","Manage Grafana Cloud accounts — organizations, stacks, RBAC roles and assignments, SSO\u002FSAML\u002FOAuth\u002FGitHub auth, service accounts for CI\u002FCD, user invites, team membership, and API-driven provisioning. Creates stacks via the Cloud API, mints service-account tokens, applies role assignments, configures SSO providers, and provisions teams\u002Ffolders\u002Fdashboards via Terraform. Use when managing Grafana Cloud access, configuring SSO\u002FSAML\u002FOAuth, setting up service accounts for Terraform\u002FCI\u002FCD, assigning RBAC roles, inviting users, managing multiple stacks or organizations, provisioning cloud resources via API or Terraform, or auditing admin actions — even when the user says \"set up SSO\", \"create a stack\", \"make a service account\", or \"onboard a team\" without explicitly saying \"admin\".",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6592,6595,6598,6599],{"name":6593,"slug":6594,"type":15},"Access Control","access-control",{"name":6596,"slug":6597,"type":15},"Auth","auth",{"name":9,"slug":8,"type":15},{"name":6553,"slug":6554,"type":15},"2026-07-12T07:44:12.078436",{"slug":6602,"name":6602,"fn":6603,"description":6604,"org":6605,"tags":6606,"stars":23,"repoUrl":24,"updatedAt":6616},"admission-control","implement admission control webhooks","Use when the user asks to \"write a validator\", \"add validation\", \"implement admission control\", \"write a mutating webhook\", \"add a mutation handler\", \"validate incoming resources\", \"implement admission logic\", \"add admission webhooks\", \"write ingress validation\", or asks how to validate or mutate resources before they are persisted in a grafana-app-sdk app. Provides guidance on implementing validation and mutation admission handlers for grafana-app-sdk apps.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6607,6610,6613],{"name":6608,"slug":6609,"type":15},"Architecture","architecture",{"name":6611,"slug":6612,"type":15},"Security","security",{"name":6614,"slug":6615,"type":15},"Validation","validation","2026-07-12T07:45:06.148973",{"slug":6618,"name":6618,"fn":6619,"description":6620,"org":6621,"tags":6622,"stars":23,"repoUrl":24,"updatedAt":6629},"alerting-irm","configure Grafana Alerting and Incident Management","Configure Grafana Alerting, Incident Response Management (IRM), and SLOs end-to-end — provisions Grafana-managed and data-source-managed alert rules, contact points (Slack\u002FPagerDuty\u002Femail\u002Fwebhook), notification policies with hierarchical matchers, silences, mute timings, on-call schedules and escalation chains, incident-management integrations, and SLOs with multi-window burn-rate alerts. Use when configuring alerts, debugging notification routing, setting up on-call rotations, declaring or managing incidents, defining SLOs, provisioning alerting via YAML or API, picking matchers for a notification policy, building a PagerDuty\u002FSlack webhook receiver, or troubleshooting why an alert isn't firing — even when the user says \"page me on errors\", \"alert me when X happens\", \"route this to the platform team\", or \"set up an SLO\" without naming Alerting or IRM.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6623,6626,6627,6628],{"name":6624,"slug":6625,"type":15},"Alerting","alerting",{"name":9,"slug":8,"type":15},{"name":6524,"slug":6525,"type":15},{"name":6390,"slug":6391,"type":15},"2026-07-12T07:44:02.393397",{"slug":6631,"name":6631,"fn":6632,"description":6633,"org":6634,"tags":6635,"stars":23,"repoUrl":24,"updatedAt":6645},"alloy","build unified telemetry pipelines with Grafana Alloy","Build a unified telemetry pipeline with Grafana Alloy — one OpenTelemetry-compatible binary that collects metrics, logs, traces, and profiles and ships to Grafana Cloud \u002F Prometheus \u002F Loki \u002F Tempo \u002F Pyroscope. Covers the Alloy config language (blocks, `sys.env`, component refs), `prometheus.scrape` → `remote_write`, `loki.source.file` + `loki.process` → `loki.write`, `otelcol.receiver.otlp` → `otelcol.exporter.otlp`, `pyroscope.scrape`, K8s \u002F Docker \u002F EC2 discovery, relabeling, modules (`import.file\u002Fgit\u002Fhttp`), clustering, Fleet Management `remotecfg`, the Alloy UI at `:12345`, and `alloy fmt` \u002F `alloy validate`. Use when writing a `config.alloy`, replacing Grafana Agent \u002F OTel Collector, scraping K8s pods, parsing logs, ingesting OTLP, or debugging \"Alloy isn't sending anything\" — even when the user says \"set up the agent\", \"write me a scrape config\", \"drop these logs before sending\", or \"OTel collector config\" without naming Alloy.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6636,6637,6640,6641,6642],{"name":9,"slug":8,"type":15},{"name":6638,"slug":6639,"type":15},"Logs","logs",{"name":6582,"slug":6583,"type":15},{"name":6393,"slug":6394,"type":15},{"name":6643,"slug":6644,"type":15},"OpenTelemetry","opentelemetry","2026-07-12T07:43:54.817139",{"slug":6647,"name":6647,"fn":6648,"description":6649,"org":6650,"tags":6651,"stars":23,"repoUrl":24,"updatedAt":6659},"app-observability","monitor application performance in Grafana Cloud","Get RED metrics + service maps + frontend RUM + AI\u002FLLM monitoring out of Grafana Cloud — Application Observability (`traces_spanmetrics_*` from OTel traces, p50\u002Fp95\u002Fp99 latency, exemplar-to-trace, traces-to-logs \u002F profiles), Frontend Observability with the Faro Web SDK (Core Web Vitals, session replay, `pushError`, React + router integration, `TracingInstrumentation` for browser → backend trace correlation), and AI Observability via OpenLIT (token \u002F cost \u002F latency, GPU, hallucination + toxicity evals). Use when standing up APM for a service, wiring an Alloy OTLP receiver + forwarding to Cloud, instrumenting a React frontend for RUM, debugging why service-map edges are missing, monitoring LLM cost drift, or correlating a frontend error to its backend trace — even when the user says \"set up APM\", \"show service map\", \"monitor browser perf\", \"session replay\", \"RUM SDK\", or \"watch our OpenAI bill\" without naming App \u002F Frontend \u002F AI Observability.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6652,6655,6656,6657,6658],{"name":6653,"slug":6654,"type":15},"APM","apm",{"name":6386,"slug":6387,"type":15},{"name":9,"slug":8,"type":15},{"name":6464,"slug":6465,"type":15},{"name":6393,"slug":6394,"type":15},"2026-07-12T07:44:34.500406",{"slug":6661,"name":6661,"fn":6662,"description":6663,"org":6664,"tags":6665,"stars":23,"repoUrl":24,"updatedAt":6674},"app-sdk-concepts","scaffold and configure Grafana apps","Use when starting any grafana-app-sdk work — scaffolding a Grafana app, initializing a Grafana App Platform app, picking a deployment mode (standalone operator \u002F grafana\u002Fapps \u002F frontend-only), wiring app-specific config, or onboarding to the SDK. Covers `grafana-app-sdk` CLI install, `project init` per deployment mode, project layout, the schema-centric workflow (CUE kinds → generated code → reconciler\u002Fadmission logic), and `SpecificConfig` for env-driven app configuration. Use even if the user just says \"make a new app\", \"Grafana app platform\", \"kinds and watchers\", \"operator scaffold\", or asks about `apps\u002F` inside the Grafana repo, without naming the SDK explicitly.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[6666,6667,6670,6673],{"name":6608,"slug":6609,"type":15},{"name":6668,"slug":6669,"type":15},"Deployment","deployment",{"name":6671,"slug":6672,"type":15},"Engineering","engineering",{"name":9,"slug":8,"type":15},"2026-07-12T07:45:08.595757",48]