From 8272c348c7e2290046b7ae6812c24b0627d534ff Mon Sep 17 00:00:00 2001
From: Daniel Van Der Ploeg <daniel.vanderploeg@aligent.com.au>
Date: Tue, 9 Jul 2024 11:15:59 +0930
Subject: [PATCH 1/5] feat: add cloudwatch dashboard

---
 packages/prerender-fargate/lib/monitoring.ts  | 515 ++++++++++++++++++
 .../lib/prerender-fargate-options.ts          |  12 +
 .../lib/prerender-fargate.ts                  |  23 +-
 .../prerender-recache-api-construct.ts        |  11 +-
 4 files changed, 559 insertions(+), 2 deletions(-)
 create mode 100644 packages/prerender-fargate/lib/monitoring.ts

diff --git a/packages/prerender-fargate/lib/monitoring.ts b/packages/prerender-fargate/lib/monitoring.ts
new file mode 100644
index 00000000..b5d02cd2
--- /dev/null
+++ b/packages/prerender-fargate/lib/monitoring.ts
@@ -0,0 +1,515 @@
+import { Construct } from "constructs";
+import {
+  Metric,
+  TextWidget,
+  SingleValueWidget,
+  GraphWidget,
+  LegendPosition,
+  Dashboard,
+  Column,
+  LogQueryWidget,
+  Alarm,
+  ComparisonOperator,
+  LogQueryVisualizationType,
+  MathExpression,
+} from "aws-cdk-lib/aws-cloudwatch";
+import { FargateService } from "aws-cdk-lib/aws-ecs";
+import {
+  ApplicationLoadBalancer,
+  HttpCodeElb,
+  HttpCodeTarget,
+} from "aws-cdk-lib/aws-elasticloadbalancingv2";
+import { LogGroup } from "aws-cdk-lib/aws-logs";
+import { Topic } from "aws-cdk-lib/aws-sns";
+import { Bucket } from "aws-cdk-lib/aws-s3";
+import { Queue } from "aws-cdk-lib/aws-sqs";
+import * as lambda from "aws-cdk-lib/aws-lambda";
+
+export interface PerformanceMetricsProps {
+  dashboardName?: string;
+  service: FargateService;
+  loadBalancer: ApplicationLoadBalancer;
+  logGroup: LogGroup;
+  snsTopic?: Topic;
+  cacheBucket: Bucket;
+  recache?: {
+    queue: Queue;
+    consumer: lambda.Function;
+    producer: lambda.Function;
+  };
+  additionalAlarms?: Alarm[];
+}
+
+export class PerformanceMetrics extends Construct {
+  constructor(scope: Construct, id: string, props: PerformanceMetricsProps) {
+    super(scope, id);
+
+    const alarms: Alarm[] = props.additionalAlarms || [];
+
+    // Load balancer metrics and widgets
+    const requestCountMetrics: Metric[] = [
+      props.loadBalancer.metrics.requestCount({
+        label: "Total Request Count",
+      }),
+      props.loadBalancer.metrics.httpCodeTarget(
+        HttpCodeTarget.TARGET_2XX_COUNT,
+        {
+          label: "HTTP 2xx Count",
+          color: "#69ae34",
+        }
+      ),
+      props.loadBalancer.metrics.httpCodeElb(HttpCodeElb.ELB_4XX_COUNT, {
+        label: "ELB 4xx Count",
+        color: "#f89256",
+      }),
+      props.loadBalancer.metrics.httpCodeElb(HttpCodeElb.ELB_5XX_COUNT, {
+        label: "ELB 5xx Count",
+      }),
+    ];
+
+    const targetResponseTime: Metric =
+      props.loadBalancer.metrics.targetResponseTime({
+        label: "Target Response Time",
+      });
+
+    const loadBalancerLabel = new TextWidget({
+      markdown: "# Load Balancer",
+      width: 24,
+      height: 1,
+    });
+
+    const requestCountSingleWidget = new SingleValueWidget({
+      title: "Prerender Request Count",
+      width: 12,
+      height: 4,
+      sparkline: true,
+      metrics: requestCountMetrics,
+    });
+
+    const requestCountGraphWidget = new GraphWidget({
+      title: "Prerender Request Count",
+      width: 12,
+      height: 7,
+    });
+
+    const responseTimeGraphWidget = new GraphWidget({
+      title: "Target Response Time",
+      width: 12,
+      height: 6,
+      legendPosition: LegendPosition.HIDDEN,
+    });
+    responseTimeGraphWidget.addLeftMetric(targetResponseTime);
+
+    requestCountMetrics.forEach(metric => {
+      requestCountGraphWidget.addLeftMetric(metric);
+    });
+
+    const loadBalancerWidgets = [
+      loadBalancerLabel,
+      requestCountSingleWidget,
+      requestCountGraphWidget,
+      responseTimeGraphWidget,
+    ];
+
+    // Prerender Performance
+    const currentActiveTasksMetric: Metric[] = [
+      // Current no built in method to get these metrics
+      // Need to manually construct
+      new Metric({
+        namespace: "ECS/ContainerInsights",
+        metricName: "DesiredTaskCount",
+        dimensionsMap: {
+          ServiceName: props.service.serviceName,
+          ClusterName: props.service.cluster.clusterName,
+        },
+        statistic: "avg",
+      }),
+      new Metric({
+        namespace: "ECS/ContainerInsights",
+        metricName: "RunningTaskCount",
+        dimensionsMap: {
+          ServiceName: props.service.serviceName,
+          ClusterName: props.service.cluster.clusterName,
+        },
+        color: "#69ae34",
+        statistic: "avg",
+      }),
+      new Metric({
+        namespace: "ECS/ContainerInsights",
+        metricName: "PendingTaskCount",
+        dimensionsMap: {
+          ServiceName: props.service.serviceName,
+          ClusterName: props.service.cluster.clusterName,
+        },
+        color: "#f89256",
+        statistic: "avg",
+      }),
+    ];
+
+    // Alert when 0 tasks are running
+    alarms.push(
+      new Alarm(this, "currentActiveTasksAlarm", {
+        metric: currentActiveTasksMetric[0],
+        threshold: 0,
+        comparisonOperator: ComparisonOperator.LESS_THAN_OR_EQUAL_TO_THRESHOLD,
+        evaluationPeriods: 1,
+        datapointsToAlarm: 1,
+      })
+    );
+
+    const taskCPUMetrics: Metric[] = [
+      props.service.metricCpuUtilization({
+        statistic: "min",
+      }),
+      props.service.metricCpuUtilization({
+        statistic: "max",
+      }),
+      props.service.metricCpuUtilization({
+        statistic: "avg",
+      }),
+    ];
+
+    const taskMemoryMetrics: Metric[] = [
+      props.service.metricMemoryUtilization({
+        statistic: "min",
+      }),
+      props.service.metricMemoryUtilization({
+        statistic: "max",
+      }),
+      props.service.metricMemoryUtilization({
+        statistic: "avg",
+      }),
+    ];
+
+    /**
+     * PERFORMANCE STATS BLOCK
+     */
+    const prerenderPerformanceLabel = new TextWidget({
+      markdown: "# Prerender Performance",
+      width: 24,
+      height: 1,
+    });
+
+    const currentActiveTasksSingleWidget = new SingleValueWidget({
+      title: "Current Active Tasks",
+      width: 9,
+      height: 3,
+      sparkline: false,
+      metrics: currentActiveTasksMetric,
+    });
+
+    const currentActiveTasksGraphWidget = new GraphWidget({
+      title: "Current Active Tasks",
+      width: 9,
+      height: 5,
+    });
+    currentActiveTasksMetric.slice(1).forEach(metric => {
+      currentActiveTasksGraphWidget.addLeftMetric(metric);
+    });
+
+    const currentTaskWidgets = [
+      currentActiveTasksSingleWidget,
+      currentActiveTasksGraphWidget,
+    ];
+
+    const taskCPUGraphWidget = new GraphWidget({
+      title: "Prerender CPU",
+      width: 9,
+      height: 6,
+    });
+    taskCPUMetrics.forEach(metric => {
+      taskCPUGraphWidget.addLeftMetric(metric);
+    });
+
+    const taskMemoryGraphWidget = new GraphWidget({
+      title: "Prerender Memory",
+      width: 9,
+      height: 6,
+    });
+    taskMemoryMetrics.forEach(metric => {
+      taskMemoryGraphWidget.addLeftMetric(metric);
+    });
+
+    const prerenderPerformanceMetrics = [
+      taskCPUGraphWidget,
+      taskMemoryGraphWidget,
+    ];
+
+    const statusCodes = new LogQueryWidget({
+      title: "Response Codes",
+      width: 6,
+      height: 6,
+      queryString:
+        "fields @timestamp, status | filter ispresent(status) | stats count(status) as `Response Code` by status",
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.PIE,
+    });
+
+    // Top bot refers
+    const topBotRefers = new LogQueryWidget({
+      title: "Top Bot Refers",
+      width: 9,
+      height: 9,
+      queryString: `parse message /User-Agent: "(?<userAgent>.*)"/ | filter ispresent(userAgent) and userAgent not like "ELB-HealthChecker/2.0" | sort @timestamp desc | stats count(userAgent) as countUserAgent by userAgent | sort countUserAgent desc`,
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.TABLE,
+    });
+
+    // Top pages
+    const topPages = new LogQueryWidget({
+      title: "Top Pages",
+      width: 6,
+      height: 14,
+      queryString:
+        "parse message /(?<url>https:\\/\\/.*)/ | filter message like 'got ' and ispresent(url) | stats count(url) as countUrl by url | sort countUrl desc",
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.TABLE,
+    });
+
+    // Average render time
+    const avgRenderTimePerHour = new LogQueryWidget({
+      title: "Average Render Time (per hour)",
+      width: 9,
+      height: 6,
+      queryString: `parse message /got \\d{3} in (?<time>\\d*)ms/ | filter (ispresent(time) and message like 'https') | stats avg(time) by bin(1h)`,
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.LINE,
+    });
+
+    const avgRenderTimePerDay = new LogQueryWidget({
+      title: "Average Render Time (per day)",
+      width: 9,
+      height: 6,
+      queryString: `parse message /got \\d{3} in (?<time>\\d*)ms/ | filter (ispresent(time) and message like 'https') | stats avg(time) by bin(1d)`,
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.LINE,
+    });
+
+    const prerenderPerformanceLogBased = [
+      new Column(avgRenderTimePerHour, avgRenderTimePerDay, topBotRefers),
+      new Column(statusCodes, topPages),
+    ];
+
+    /**
+     * CACHE STATS BLOCK
+     */
+    const cacheLabel = new TextWidget({
+      markdown: "# Prerender Cache",
+      width: 24,
+      height: 1,
+    });
+
+    // Cache hits
+    const cacheHitRate = new LogQueryWidget({
+      title: "Cache Hit Rate",
+      width: 10,
+      height: 11,
+      queryString:
+        "fields @timestamp, message | parse message /(?<cacheHitTemp>.*?:)/ | filter message like 'cached object' | fields replace(cacheHitTemp, 'Found cached object:', 'HIT') as cacheHit1 | fields replace(cacheHit1, 'Fetching cached object from S3 bucket failed with error:', 'MISS') as cacheHit | stats count(cacheHit) as `Cache Hit Rate` by cacheHit",
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.PIE,
+    });
+
+    const cacheBucketStorageSize = new Metric({
+      namespace: "AWS/S3",
+      metricName: "BucketSizeBytes",
+      dimensionsMap: {
+        BucketName: props.cacheBucket.bucketName,
+        StorageType: "ReducedRedundancyStorage",
+      },
+      color: "#08aad2",
+      statistic: "avg",
+    });
+
+    const cacheBucketNumberOfObjects = new Metric({
+      namespace: "AWS/S3",
+      metricName: "NumberOfObjects",
+      dimensionsMap: {
+        BucketName: props.cacheBucket.bucketName,
+        StorageType: "AllStorageTypes",
+      },
+      color: "#69ae34",
+      statistic: "avg",
+    });
+
+    const cacheBucketWidgetProps = {
+      width: 14,
+      height: 3,
+      start: "-P30D",
+    };
+    const cacheBucketTextWidget = new SingleValueWidget({
+      ...cacheBucketWidgetProps,
+      title: "Cached Objects",
+      metrics: [cacheBucketNumberOfObjects, cacheBucketStorageSize],
+    });
+
+    const cacheBucketWidget = new GraphWidget({
+      ...cacheBucketWidgetProps,
+      title: "Cached Objects (Last 30 Days)",
+      height: 8,
+    });
+    cacheBucketWidget.addLeftMetric(cacheBucketNumberOfObjects);
+    cacheBucketWidget.addRightMetric(cacheBucketStorageSize);
+
+    const cachedBucketWidgets = [cacheBucketTextWidget, cacheBucketWidget];
+
+    /**
+     * RECACHE STATS BLOCK
+     */
+    const recacheWidgets = [];
+    if (props.recache) {
+      const recacheLabel = new TextWidget({
+        markdown: "# Prerender Re-cache",
+        width: 24,
+        height: 1,
+      });
+      recacheWidgets.push(recacheLabel);
+
+      // Items in sqs queue
+      const visibleMessages = new Metric({
+        namespace: "AWS/SQS",
+        metricName: "ApproximateNumberOfMessagesVisible",
+        dimensionsMap: {
+          QueueName: props.recache.queue.queueName,
+        },
+        color: "#08aad2",
+        statistic: "avg",
+      });
+
+      const messagesWidget = new GraphWidget({
+        title: "Message Queue Count",
+        width: 12,
+        height: 8,
+      });
+      messagesWidget.addLeftMetric(visibleMessages);
+
+      recacheWidgets.push(messagesWidget);
+
+      // Oldest age of item in queue
+      const oldestMessage = new Metric({
+        namespace: "AWS/SQS",
+        metricName: "ApproximateAgeOfOldestMessage",
+        dimensionsMap: {
+          QueueName: props.recache.queue.queueName,
+        },
+        color: "#08aad2",
+        statistic: "max",
+      });
+
+      const oldestMessageWidget = new GraphWidget({
+        title: "Oldest Message in Queue",
+        width: 12,
+        height: 8,
+      });
+      oldestMessageWidget.addLeftMetric(oldestMessage);
+
+      recacheWidgets.push(oldestMessageWidget);
+
+      // Producer executions
+      const producerExecutionFailures = new Metric({
+        namespace: "AWS/Lambda",
+        metricName: "Errors",
+        dimensionsMap: {
+          FunctionName: props.recache.producer.functionName,
+        },
+        color: "#d13212",
+        statistic: "sum",
+      });
+      const producerInvocations = new Metric({
+        namespace: "AWS/Lambda",
+        metricName: "Invocations",
+        dimensionsMap: {
+          FunctionName: props.recache.producer.functionName,
+        },
+        statistic: "sum",
+      });
+      const producerExecutionSuccesses = new MathExpression({
+        expression:
+          "100 - 100 * producerErrors / MAX([producerErrors, producerInvocations])",
+        usingMetrics: {
+          producerErrors: producerExecutionFailures,
+          producerInvocations: producerInvocations,
+        },
+        label: "Success rate",
+        color: "#69ae34",
+      });
+
+      const producerWidget = new GraphWidget({
+        title: "Producer - Error count and success rate",
+        width: 12,
+        height: 8,
+        rightYAxis: {
+          max: 100,
+        },
+      });
+      producerWidget.addLeftMetric(producerExecutionFailures);
+      producerWidget.addLeftMetric(producerExecutionSuccesses);
+
+      recacheWidgets.push(producerWidget);
+
+      // Consumer executions
+      const consumerExecutionFailures = new Metric({
+        namespace: "AWS/Lambda",
+        metricName: "Errors",
+        dimensionsMap: {
+          FunctionName: props.recache.consumer.functionName,
+        },
+        color: "#d13212",
+        statistic: "sum",
+      });
+      const consumerInvocations = new Metric({
+        namespace: "AWS/Lambda",
+        metricName: "Invocations",
+        dimensionsMap: {
+          FunctionName: props.recache.consumer.functionName,
+        },
+        statistic: "sum",
+      });
+      const consumerExecutionSuccesses = new MathExpression({
+        expression:
+          "100 - 100 * consumerErrors / MAX([consumerErrors, consumerInvocations])",
+        usingMetrics: {
+          consumerErrors: consumerExecutionFailures,
+          consumerInvocations: consumerInvocations,
+        },
+        label: "Success rate",
+        color: "#69ae34",
+      });
+
+      const consumerWidget = new GraphWidget({
+        title: "Consumer - Error count and success rate",
+        width: 12,
+        height: 8,
+        rightYAxis: {
+          max: 100,
+        },
+      });
+      consumerWidget.addLeftMetric(consumerExecutionFailures);
+      consumerWidget.addLeftMetric(consumerExecutionSuccesses);
+
+      recacheWidgets.push(consumerWidget);
+    }
+
+    // Create the dashboard
+    new Dashboard(this, "dashboard", {
+      dashboardName: props.dashboardName,
+      widgets: [
+        [prerenderPerformanceLabel],
+        [
+          new Column(...currentTaskWidgets, ...prerenderPerformanceMetrics),
+          ...prerenderPerformanceLogBased,
+        ],
+        [cacheLabel],
+        [new Column(...cachedBucketWidgets), new Column(cacheHitRate)],
+        [...recacheWidgets],
+        [new Column(...loadBalancerWidgets)],
+      ],
+    });
+
+    // TODO: add more default alerts
+    // Notify SNS topic on all alarm triggers (if SNS topic is provided)
+    if (props.snsTopic) {
+      alarms.forEach(alarm => alarm.addAlarmAction);
+    }
+  }
+}
diff --git a/packages/prerender-fargate/lib/prerender-fargate-options.ts b/packages/prerender-fargate/lib/prerender-fargate-options.ts
index 7e9fc393..9df28275 100644
--- a/packages/prerender-fargate/lib/prerender-fargate-options.ts
+++ b/packages/prerender-fargate/lib/prerender-fargate-options.ts
@@ -140,6 +140,18 @@ export interface PrerenderFargateOptions {
    * @default - ID of the RestApi construct.
    */
   restApiName?: string;
+
+  /**
+   * A name for the API Gateway RestApi resource.
+   *
+   * @default - ID of the RestApi construct.
+   */
+  logStreamPrefix?: string;
+
+  /**
+   * An optional dashboard name to override the default randomly generated one
+   */
+  dashboardName?: string
 }
 
 /**
diff --git a/packages/prerender-fargate/lib/prerender-fargate.ts b/packages/prerender-fargate/lib/prerender-fargate.ts
index 13a5cfdc..a2935b6b 100644
--- a/packages/prerender-fargate/lib/prerender-fargate.ts
+++ b/packages/prerender-fargate/lib/prerender-fargate.ts
@@ -11,6 +11,8 @@ import { Duration, RemovalPolicy, Stack } from "aws-cdk-lib";
 import * as path from "path";
 import { PrerenderRecacheApi } from "./recaching/prerender-recache-api-construct";
 import { PrerenderFargateOptions } from "./prerender-fargate-options";
+import { PerformanceMetrics } from "./monitoring";
+import { LogGroup } from "aws-cdk-lib/aws-logs";
 
 /**
  * `PrerenderFargate` construct sets up an AWS Fargate service to run a
@@ -123,6 +125,7 @@ export class PrerenderFargate extends Construct {
       vpc: vpc,
       clusterName:
         props.clusterName !== undefined ? props.clusterName : undefined,
+      containerInsights: true,
     });
 
     const directory = path.join(__dirname, "prerender");
@@ -148,6 +151,13 @@ export class PrerenderFargate extends Construct {
       ),
     };
 
+    // Configure a custom log driver and group
+    const logGroup = new LogGroup(this, "prerender-server-log", {});
+    const logDriver = ecs.LogDrivers.awsLogs({
+      streamPrefix: props.logStreamPrefix || "prerender-server",
+      logGroup: logGroup,
+    });
+
     // Create a load-balanced Fargate service
     const fargateService =
       new ecsPatterns.ApplicationLoadBalancedFargateService(
@@ -170,6 +180,7 @@ export class PrerenderFargate extends Construct {
               props.taskDefinitionFamilyName !== undefined
                 ? props.taskDefinitionFamilyName
                 : undefined,
+            logDriver: logDriver,
           },
           publicLoadBalancer: true,
           loadBalancerName:
@@ -245,12 +256,13 @@ export class PrerenderFargate extends Construct {
       });
     }
 
+    let recacheApi;
     /**
      * Recache API is enable by default
      * This would create the API that is used to trigger recaching of the URLs
      */
     if (enableRecache === undefined || enableRecache) {
-      new PrerenderRecacheApi(this, `${prerenderName}-recache-api`, {
+      recacheApi = new PrerenderRecacheApi(this, `${prerenderName}-recache-api`, {
         prerenderS3Bucket: this.bucket,
         maxConcurrentExecutions:
           prerenderFargateRecachingOptions?.maxConcurrentExecutions || 1,
@@ -259,5 +271,14 @@ export class PrerenderFargate extends Construct {
         restApiName,
       });
     }
+
+    new PerformanceMetrics(this, "cloudwatch", {
+      ...props,
+      service: fargateService.service,
+      loadBalancer: fargateService.loadBalancer,
+      logGroup: logGroup,
+      cacheBucket: this.bucket,
+      recache: recacheApi
+    });
   }
 }
diff --git a/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts b/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
index 3183cd54..c26a5e86 100644
--- a/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
+++ b/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
@@ -5,6 +5,8 @@ import { NodejsFunction } from "aws-cdk-lib/aws-lambda-nodejs";
 import * as iam from "aws-cdk-lib/aws-iam";
 import { Bucket } from "aws-cdk-lib/aws-s3";
 import { Stack, Duration } from "aws-cdk-lib";
+import { Queue } from "aws-cdk-lib/aws-sqs";
+import * as lambda from "aws-cdk-lib/aws-lambda";
 
 /**
  * Options for the Prerender Recache API.
@@ -45,6 +47,9 @@ export interface PrerenderRecacheApiOptions {
 
 export class PrerenderRecacheApi extends Construct {
   readonly api: LambdaRestApi;
+  readonly queue: Queue;
+  readonly consumer: lambda.Function
+  readonly producer: lambda.Function
 
   constructor(
     scope: Construct,
@@ -92,7 +97,7 @@ export class PrerenderRecacheApi extends Construct {
     const recache = this.api.root.addResource("recache");
     recache.addMethod("POST");
 
-    new LambdaToSqsToLambda(this, "prerenderRequestQueue", {
+    const sqsLambda = new LambdaToSqsToLambda(this, "prerenderRequestQueue", {
       existingProducerLambdaObj: apiHandler,
       existingConsumerLambdaObj: new NodejsFunction(this, "consumer", {
         reservedConcurrentExecutions: options.maxConcurrentExecutions,
@@ -105,6 +110,10 @@ export class PrerenderRecacheApi extends Construct {
           options.queueName !== undefined ? options.queueName : undefined,
       },
     });
+
+    this.queue = sqsLambda.sqsQueue;
+    this.consumer = sqsLambda.consumerLambdaFunction
+    this.producer = sqsLambda.producerLambdaFunction
   }
 }
 

From d9b3b27a46c274e217eadfcb36a66f09c0ecc416 Mon Sep 17 00:00:00 2001
From: Daniel Van Der Ploeg <daniel.vanderploeg@aligent.com.au>
Date: Tue, 9 Jul 2024 11:21:48 +0930
Subject: [PATCH 2/5] chore: fix formatting

---
 .../lib/prerender-fargate-options.ts          |  2 +-
 .../lib/prerender-fargate.ts                  | 22 +++++++++++--------
 .../prerender-recache-api-construct.ts        |  8 +++----
 3 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/packages/prerender-fargate/lib/prerender-fargate-options.ts b/packages/prerender-fargate/lib/prerender-fargate-options.ts
index 9df28275..5572ed0d 100644
--- a/packages/prerender-fargate/lib/prerender-fargate-options.ts
+++ b/packages/prerender-fargate/lib/prerender-fargate-options.ts
@@ -151,7 +151,7 @@ export interface PrerenderFargateOptions {
   /**
    * An optional dashboard name to override the default randomly generated one
    */
-  dashboardName?: string
+  dashboardName?: string;
 }
 
 /**
diff --git a/packages/prerender-fargate/lib/prerender-fargate.ts b/packages/prerender-fargate/lib/prerender-fargate.ts
index a2935b6b..2cd41e28 100644
--- a/packages/prerender-fargate/lib/prerender-fargate.ts
+++ b/packages/prerender-fargate/lib/prerender-fargate.ts
@@ -262,14 +262,18 @@ export class PrerenderFargate extends Construct {
      * This would create the API that is used to trigger recaching of the URLs
      */
     if (enableRecache === undefined || enableRecache) {
-      recacheApi = new PrerenderRecacheApi(this, `${prerenderName}-recache-api`, {
-        prerenderS3Bucket: this.bucket,
-        maxConcurrentExecutions:
-          prerenderFargateRecachingOptions?.maxConcurrentExecutions || 1,
-        tokenSecret,
-        queueName,
-        restApiName,
-      });
+      recacheApi = new PrerenderRecacheApi(
+        this,
+        `${prerenderName}-recache-api`,
+        {
+          prerenderS3Bucket: this.bucket,
+          maxConcurrentExecutions:
+            prerenderFargateRecachingOptions?.maxConcurrentExecutions || 1,
+          tokenSecret,
+          queueName,
+          restApiName,
+        }
+      );
     }
 
     new PerformanceMetrics(this, "cloudwatch", {
@@ -278,7 +282,7 @@ export class PrerenderFargate extends Construct {
       loadBalancer: fargateService.loadBalancer,
       logGroup: logGroup,
       cacheBucket: this.bucket,
-      recache: recacheApi
+      recache: recacheApi,
     });
   }
 }
diff --git a/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts b/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
index c26a5e86..1e6acfff 100644
--- a/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
+++ b/packages/prerender-fargate/lib/recaching/prerender-recache-api-construct.ts
@@ -48,8 +48,8 @@ export interface PrerenderRecacheApiOptions {
 export class PrerenderRecacheApi extends Construct {
   readonly api: LambdaRestApi;
   readonly queue: Queue;
-  readonly consumer: lambda.Function
-  readonly producer: lambda.Function
+  readonly consumer: lambda.Function;
+  readonly producer: lambda.Function;
 
   constructor(
     scope: Construct,
@@ -112,8 +112,8 @@ export class PrerenderRecacheApi extends Construct {
     });
 
     this.queue = sqsLambda.sqsQueue;
-    this.consumer = sqsLambda.consumerLambdaFunction
-    this.producer = sqsLambda.producerLambdaFunction
+    this.consumer = sqsLambda.consumerLambdaFunction;
+    this.producer = sqsLambda.producerLambdaFunction;
   }
 }
 

From 43fef97941c93482977f0eaa46ecab98632eff2c Mon Sep 17 00:00:00 2001
From: Daniel Van Der Ploeg <daniel.vanderploeg@aligent.com.au>
Date: Tue, 9 Jul 2024 13:27:09 +0930
Subject: [PATCH 3/5] feat: add render history

---
 packages/prerender-fargate/lib/monitoring.ts | 25 ++++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/packages/prerender-fargate/lib/monitoring.ts b/packages/prerender-fargate/lib/monitoring.ts
index b5d02cd2..c4f02189 100644
--- a/packages/prerender-fargate/lib/monitoring.ts
+++ b/packages/prerender-fargate/lib/monitoring.ts
@@ -74,7 +74,7 @@ export class PerformanceMetrics extends Construct {
 
     const loadBalancerLabel = new TextWidget({
       markdown: "# Load Balancer",
-      width: 24,
+      width: 12,
       height: 1,
     });
 
@@ -353,6 +353,27 @@ export class PerformanceMetrics extends Construct {
 
     const cachedBucketWidgets = [cacheBucketTextWidget, cacheBucketWidget];
 
+    /**
+     * Render History
+     */
+    const renderHistoryLabel = new TextWidget({
+      markdown: "# Render History",
+      width: 12,
+      height: 1,
+    });
+
+    const renderHistoryWidget = new LogQueryWidget({
+      title: "Cache Hit Rate",
+      width: 12,
+      height: 17,
+      queryString:
+        "fields @timestamp, status, time, path | filter level like 'render'",
+      logGroupNames: [props.logGroup.logGroupName],
+      view: LogQueryVisualizationType.TABLE,
+    });
+
+    const renderHistory = [renderHistoryLabel, renderHistoryWidget];
+
     /**
      * RECACHE STATS BLOCK
      */
@@ -502,7 +523,7 @@ export class PerformanceMetrics extends Construct {
         [cacheLabel],
         [new Column(...cachedBucketWidgets), new Column(cacheHitRate)],
         [...recacheWidgets],
-        [new Column(...loadBalancerWidgets)],
+        [new Column(...loadBalancerWidgets), new Column(...renderHistory)],
       ],
     });
 

From cc8018d3064296c2237a7fae7dfc8806211d3983 Mon Sep 17 00:00:00 2001
From: Daniel Van Der Ploeg <daniel.vanderploeg@aligent.com.au>
Date: Tue, 9 Jul 2024 14:08:23 +0930
Subject: [PATCH 4/5] feat: simplify queries to use fields

---
 packages/prerender-fargate/lib/monitoring.ts | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/prerender-fargate/lib/monitoring.ts b/packages/prerender-fargate/lib/monitoring.ts
index c4f02189..22c2d08b 100644
--- a/packages/prerender-fargate/lib/monitoring.ts
+++ b/packages/prerender-fargate/lib/monitoring.ts
@@ -240,7 +240,7 @@ export class PerformanceMetrics extends Construct {
       width: 6,
       height: 6,
       queryString:
-        "fields @timestamp, status | filter ispresent(status) | stats count(status) as `Response Code` by status",
+        "fields status | filter level like 'render' and status not like '401' | stats count(status) as `Count` by `status` | sort `Count` desc",
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.PIE,
     });
@@ -250,7 +250,8 @@ export class PerformanceMetrics extends Construct {
       title: "Top Bot Refers",
       width: 9,
       height: 9,
-      queryString: `parse message /User-Agent: "(?<userAgent>.*)"/ | filter ispresent(userAgent) and userAgent not like "ELB-HealthChecker/2.0" | sort @timestamp desc | stats count(userAgent) as countUserAgent by userAgent | sort countUserAgent desc`,
+      queryString:
+        "fields `origin.x-prerender-user-agent` as userAgent | filter level like 'render' and status not like '401' | stats count(userAgent) as countUserAgent by userAgent | sort countUserAgent desc",
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.TABLE,
     });
@@ -261,7 +262,7 @@ export class PerformanceMetrics extends Construct {
       width: 6,
       height: 14,
       queryString:
-        "parse message /(?<url>https:\\/\\/.*)/ | filter message like 'got ' and ispresent(url) | stats count(url) as countUrl by url | sort countUrl desc",
+        "fields path | filter level like 'render' and status not like '401' | stats count(path) as pathUrl by path | sort pathUrl desc",
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.TABLE,
     });
@@ -271,7 +272,7 @@ export class PerformanceMetrics extends Construct {
       title: "Average Render Time (per hour)",
       width: 9,
       height: 6,
-      queryString: `parse message /got \\d{3} in (?<time>\\d*)ms/ | filter (ispresent(time) and message like 'https') | stats avg(time) by bin(1h)`,
+      queryString: `fields time | filter level like 'render' and status not like '401' | stats avg(time) by bin(1h)`,
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.LINE,
     });
@@ -280,7 +281,7 @@ export class PerformanceMetrics extends Construct {
       title: "Average Render Time (per day)",
       width: 9,
       height: 6,
-      queryString: `parse message /got \\d{3} in (?<time>\\d*)ms/ | filter (ispresent(time) and message like 'https') | stats avg(time) by bin(1d)`,
+      queryString: `fields time | filter level like 'render' and status not like '401' | stats avg(time) by bin(1d)`,
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.LINE,
     });

From 347b6a96f5e47f384595e720202f6c8dc74c8ff7 Mon Sep 17 00:00:00 2001
From: Daniel Van Der Ploeg <daniel.vanderploeg@aligent.com.au>
Date: Tue, 9 Jul 2024 14:12:24 +0930
Subject: [PATCH 5/5] feat: resolve dashboard rendering issue

---
 packages/prerender-fargate/lib/monitoring.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/prerender-fargate/lib/monitoring.ts b/packages/prerender-fargate/lib/monitoring.ts
index 22c2d08b..a114ecd1 100644
--- a/packages/prerender-fargate/lib/monitoring.ts
+++ b/packages/prerender-fargate/lib/monitoring.ts
@@ -249,7 +249,7 @@ export class PerformanceMetrics extends Construct {
     const topBotRefers = new LogQueryWidget({
       title: "Top Bot Refers",
       width: 9,
-      height: 9,
+      height: 8,
       queryString:
         "fields `origin.x-prerender-user-agent` as userAgent | filter level like 'render' and status not like '401' | stats count(userAgent) as countUserAgent by userAgent | sort countUserAgent desc",
       logGroupNames: [props.logGroup.logGroupName],
@@ -364,11 +364,11 @@ export class PerformanceMetrics extends Construct {
     });
 
     const renderHistoryWidget = new LogQueryWidget({
-      title: "Cache Hit Rate",
+      title: "Render History",
       width: 12,
       height: 17,
       queryString:
-        "fields @timestamp, status, time, path | filter level like 'render'",
+        "fields @timestamp, status, time, path | filter level like 'render' and status not like '401",
       logGroupNames: [props.logGroup.logGroupName],
       view: LogQueryVisualizationType.TABLE,
     });