diff --git a/public/app/features/dashboard/dashgrid/PanelChrome.tsx b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
index a0a385cf3f2..759618af56b 100644
--- a/public/app/features/dashboard/dashgrid/PanelChrome.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
@@ -25,6 +25,7 @@ import {
   PanelData,
   PanelPlugin,
   FieldConfigSource,
+  PanelPluginMeta,
 } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
 
@@ -238,23 +239,27 @@ export class PanelChrome extends PureComponent<Props, State> {
     });
   };
 
+  shouldSignalRenderingCompleted(loadingState: LoadingState, pluginMeta: PanelPluginMeta) {
+    return loadingState === LoadingState.Done || pluginMeta.skipDataQuery;
+  }
+
   renderPanel(width: number, height: number) {
     const { panel, plugin } = this.props;
     const { renderCounter, data, isFirstLoad } = this.state;
     const { theme } = config;
+    const { state: loadingState } = data;
+
+    // do not render component until we have first data
+    if (isFirstLoad && (loadingState === LoadingState.Loading || loadingState === LoadingState.NotStarted)) {
+      return null;
+    }
 
     // This is only done to increase a counter that is used by backend
     // image rendering to know when to capture image
-    const loading = data.state;
-    if (loading === LoadingState.Done) {
+    if (this.shouldSignalRenderingCompleted(loadingState, plugin.meta)) {
       profiler.renderingCompleted();
     }
 
-    // do not render component until we have first data
-    if (isFirstLoad && (loading === LoadingState.Loading || loading === LoadingState.NotStarted)) {
-      return null;
-    }
-
     const PanelComponent = plugin.panel!;
     const timeRange = data.timeRange || this.timeSrv.timeRange();
     const headerHeight = this.hasOverlayHeader() ? 0 : theme.panelHeaderHeight;