diff --git a/src/lib/Hydra/Controller/Job.pm b/src/lib/Hydra/Controller/Job.pm
index 7f5bbb56..ccbae4b6 100644
--- a/src/lib/Hydra/Controller/Job.pm
+++ b/src/lib/Hydra/Controller/Job.pm
@@ -77,7 +77,13 @@ sub overview : Chained('job') PathPart('') Args(0) {
         , jobset => $c->stash->{jobset}->name
         , job => $c->stash->{job}->name
         })->count == 1 if $c->user_exists;
+}
 
+
+sub metrics_tab : Chained('job') PathPart('metrics-tab') Args(0) {
+    my ($self, $c) = @_;
+    my $job = $c->stash->{job};
+    $c->stash->{template} = 'job-metrics-tab.tt';
     $c->stash->{metrics} = [ $job->buildmetrics->search(
         { }, { select => ["name"], distinct => 1, order_by => "name",  }) ];
 }
diff --git a/src/root/job-metrics-tab.tt b/src/root/job-metrics-tab.tt
new file mode 100644
index 00000000..2aaa652c
--- /dev/null
+++ b/src/root/job-metrics-tab.tt
@@ -0,0 +1,27 @@
+[% PROCESS common.tt %]
+
+<div id="tabs-charts" class="tab-pane">
+
+  <h3>Build time (in seconds)</h3>
+
+  [% INCLUDE createChart id="build-times" yaxis="sec" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'build-times') %]
+
+  <h3>Closure size (in MiB)</h3>
+
+  [% INCLUDE createChart id="closure-size" yaxis="mib" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'closure-sizes') %]
+
+  <h3>Output size (in MiB)</h3>
+
+  [% INCLUDE createChart id="output-size" yaxis="mib" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'output-sizes') %]
+
+  [% FOREACH metric IN metrics %]
+
+    <h3>Metric: <tt>[%HTML.escape(metric.name)%]</tt></h3>
+
+    [% id = "metric-" _ metric.name;
+       id = id.replace('\.', '_');
+       INCLUDE createChart dataUrl=c.uri_for('/job' project.name jobset.name job.name 'metric' metric.name); %]
+
+  [% END %]
+
+</div>
diff --git a/src/root/job.tt b/src/root/job.tt
index 0a621e44..1bf7c499 100644
--- a/src/root/job.tt
+++ b/src/root/job.tt
@@ -84,31 +84,7 @@ removed or had an evaluation error.</div>
 
   [% END %]
 
-  <div id="tabs-charts" class="tab-pane">
-
-    <h3>Build time (in seconds)</h3>
-
-    [% INCLUDE createChart id="build-times" yaxis="sec" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'build-times') %]
-
-    <h3>Closure size (in MiB)</h3>
-
-    [% INCLUDE createChart id="closure-size" yaxis="mib" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'closure-sizes') %]
-
-    <h3>Output size (in MiB)</h3>
-
-    [% INCLUDE createChart id="output-size" yaxis="mib" dataUrl=c.uri_for('/job' project.name jobset.name job.name 'output-sizes') %]
-
-    [% FOREACH metric IN metrics %]
-
-      <h3>Metric: <tt>[%HTML.escape(metric.name)%]</tt></h3>
-
-      [% id = "metric-" _ metric.name;
-         id = id.replace('\.', '_');
-         INCLUDE createChart dataUrl=c.uri_for('/job' project.name jobset.name job.name 'metric' metric.name); %]
-
-    [% END %]
-
-  </div>
+  [% INCLUDE makeLazyTab tabName="tabs-charts" uri=c.uri_for('/job' project.name jobset.name job.name 'metrics-tab') %]
 
   <div id="tabs-links" class="tab-pane">
     <ul>