diff --git a/packages/core/tracing/package.json b/packages/core/tracing/package.json
index c3cd8c2c7c..23513d0bc9 100644
--- a/packages/core/tracing/package.json
+++ b/packages/core/tracing/package.json
@@ -60,7 +60,7 @@
     "extends": "../../../package.json"
   },
   "distSizeChecker": {
-    "errorLimit": "300KB"
+    "errorLimit": "400KB"
   },
   "peerDependencies": {
     "@kong/kongponents": "9.14.16",
diff --git a/packages/core/tracing/src/components/trace-viewer/SpanAttribute.vue b/packages/core/tracing/src/components/trace-viewer/SpanAttribute.vue
index 92ec14a5a2..81f88217dc 100644
--- a/packages/core/tracing/src/components/trace-viewer/SpanAttribute.vue
+++ b/packages/core/tracing/src/components/trace-viewer/SpanAttribute.vue
@@ -3,7 +3,7 @@
     :item="{
       type: itemType,
       key: keyValue.key,
-      label: keyValue.key,
+      label: label || keyValue.key,
       value: formattedValue,
     }"
   >
@@ -20,7 +20,7 @@
         new-window
       />
       <span v-else>
-        {{ t('trace_viewer.span_attributes.not_applicable') }}
+        {{ formattedValue || t('trace_viewer.span_attributes.not_applicable') }}
       </span>
     </template>
   </ConfigCardItem>
@@ -30,7 +30,7 @@
 import { ConfigCardItem, ConfigurationSchemaType, EntityLink, type EntityLinkData } from '@kong-ui-public/entities-shared'
 import { computed, inject, onWatcherCleanup, shallowRef, watch } from 'vue'
 import composables from '../../composables'
-import { SPAN_ATTRIBUTE_VALUE_UNKNOWN, SPAN_ATTRIBUTES, TRACE_VIEWER_CONFIG } from '../../constants'
+import { SPAN_ATTRIBUTE_VALUE_UNKNOWN, SpanAttributeKeys, TRACE_VIEWER_CONFIG } from '../../constants'
 import type { EntityRequest, IKeyValue, Span, TraceViewerConfig } from '../../types'
 import { getPhaseAndPlugin, unwrapAnyValue } from '../../utils'
 
@@ -41,6 +41,11 @@ const { i18n: { t } } = composables.useI18n()
 const props = defineProps<{
   span: Span
   keyValue: IKeyValue
+  /**
+   * Label to show for the attribute.
+   * If omitted, the key will be used as the default label.
+   */
+  label?: string
 }>()
 
 const config = inject<TraceViewerConfig>(TRACE_VIEWER_CONFIG)
@@ -69,13 +74,13 @@ const formattedValue = computed(() => {
 
 // A map of keys of attributes whose values are IDs of entities (services, routes, consumers, etc.)
 // to their corresponding entities
-const ATTRIBUTE_KEY_TO_ENTITY = {
-  [SPAN_ATTRIBUTES.KONG_SERVICE_ID.name]: 'services',
-  [SPAN_ATTRIBUTES.KONG_ROUTE_ID.name]: 'routes',
-  [SPAN_ATTRIBUTES.KONG_CONSUMER_ID.name]: 'consumers',
-  [SPAN_ATTRIBUTES.KONG_PLUGIN_ID.name]: 'plugins',
-  [SPAN_ATTRIBUTES.KONG_TARGET_ID.name]: 'targets',
-  [SPAN_ATTRIBUTES.KONG_UPSTREAM_ID.name]: 'upstreams',
+const ATTRIBUTE_KEY_TO_ENTITY: Record<string, string> = {
+  [SpanAttributeKeys.KONG_SERVICE_ID]: 'services',
+  [SpanAttributeKeys.KONG_ROUTE_ID]: 'routes',
+  [SpanAttributeKeys.KONG_CONSUMER_ID]: 'consumers',
+  [SpanAttributeKeys.KONG_PLUGIN_ID]: 'plugins',
+  [SpanAttributeKeys.KONG_TARGET_ID]: 'targets',
+  [SpanAttributeKeys.KONG_UPSTREAM_ID]: 'upstreams',
 }
 
 // Let's only make the attributes listed above copyable, for now.
@@ -105,7 +110,7 @@ const entityRequest = computed(() => {
   }
 
   switch (props.keyValue.key) {
-    case SPAN_ATTRIBUTES.KONG_PLUGIN_ID.name: {
+    case SpanAttributeKeys.KONG_PLUGIN_ID: {
       // We will need to parse the plugin name from the span name
       request.plugin = getPhaseAndPlugin(props.span.name)?.[1]
       if (!request.plugin) {
@@ -115,8 +120,8 @@ const entityRequest = computed(() => {
       }
       break
     }
-    case SPAN_ATTRIBUTES.KONG_TARGET_ID.name: {
-      const upstreamIdAttrValue = props.span.attributes?.find((attr) => attr.key === SPAN_ATTRIBUTES.KONG_UPSTREAM_ID.name)?.value
+    case SpanAttributeKeys.KONG_TARGET_ID: {
+      const upstreamIdAttrValue = props.span.attributes?.find((attr) => attr.key === SpanAttributeKeys.KONG_UPSTREAM_ID)?.value
       const upstreamId = upstreamIdAttrValue && unwrapAnyValue<string>(upstreamIdAttrValue)
       if (!upstreamId) {
         console.warn(`Failed to look up the upstream ID for the upstream target in the span "${props.span.name}"`)
diff --git a/packages/core/tracing/src/components/trace-viewer/SpanAttributeTable.vue b/packages/core/tracing/src/components/trace-viewer/SpanAttributeTable.vue
index a4e3edee8d..46345f2bd6 100644
--- a/packages/core/tracing/src/components/trace-viewer/SpanAttributeTable.vue
+++ b/packages/core/tracing/src/components/trace-viewer/SpanAttributeTable.vue
@@ -8,6 +8,14 @@
     </div>
 
     <div class="attributes">
+      <SpanAttribute
+        v-for="attributes in internalAttributes"
+        :key="attributes.key"
+        :key-value="attributes"
+        :label="attributes.label"
+        :span="span"
+      />
+
       <SpanAttribute
         v-for="keyValue in span.attributes"
         :key="keyValue.key"
@@ -19,14 +27,35 @@
 </template>
 
 <script setup lang="ts">
+import { computed } from 'vue'
 import composables from '../../composables'
-import { WATERFALL_ROW_PADDING_X } from '../../constants'
-import type { Span } from '../../types'
+import { SpanAttributeKeys, WATERFALL_ROW_PADDING_X } from '../../constants'
+import type { IKeyValue, Span } from '../../types'
+import { formatNanoDateTimeString } from '../../utils'
 import SpanAttribute from './SpanAttribute.vue'
 
 const { i18n: { t } } = composables.useI18n()
 
-defineProps<{ span: Span }>()
+const props = defineProps<{ span: Span }>()
+
+const internalAttributes = computed<(IKeyValue & { label?: string })[]>(() => {
+  return [
+    {
+      key: SpanAttributeKeys._INTERNAL_START_TIME,
+      value: {
+        stringValue: formatNanoDateTimeString(BigInt(props.span.startTimeUnixNano)),
+      },
+      label: t('span_attributes.labels.start_time'),
+    },
+    {
+      key: SpanAttributeKeys._INTERNAL_END_TIME,
+      value: {
+        stringValue: formatNanoDateTimeString(BigInt(props.span.endTimeUnixNano)),
+      },
+      label: t('span_attributes.labels.end_time'),
+    },
+  ]
+})
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/core/tracing/src/components/waterfall/WaterfallSpanBar.vue b/packages/core/tracing/src/components/waterfall/WaterfallSpanBar.vue
index 87e36e4923..9dd243b0f3 100644
--- a/packages/core/tracing/src/components/waterfall/WaterfallSpanBar.vue
+++ b/packages/core/tracing/src/components/waterfall/WaterfallSpanBar.vue
@@ -7,6 +7,8 @@ import { computed, inject } from 'vue'
 import { WATERFALL_CONFIG, WATERFALL_LEGENDS, WaterfallLegendItemKind } from '../../constants'
 import type { SpanNode, WaterfallConfig } from '../../types'
 
+const MIN_WIDTH = 1
+
 const config = inject<WaterfallConfig>(WATERFALL_CONFIG)
 if (!config) {
   throw new Error('WATERFALL_CONFIG is not provided')
@@ -38,13 +40,33 @@ const barColor = computed(() => {
 })
 
 // RESERVED: Only used when zooming is enabled
-const relativeStartTimeNano = computed(() => Number(BigInt(props.spanNode.span.startTimeUnixNano) - config.startTimeUnixNano))
+const relativeStartTimeNano = computed(() =>
+  Number(BigInt(props.spanNode.span.startTimeUnixNano) - (config.root?.subtreeValues.startTimeUnixNano ?? 0n)),
+)
 const barFixedLeft = computed(() => (relativeStartTimeNano.value / config.totalDurationNano) * config.zoom)
 const barShiftLeft = computed(() => -config.viewport.left * config.zoom)
-const barLeft = computed(() => `min(100% - 3px, ${(barFixedLeft.value + barShiftLeft.value) * 100}%)`)
-const barWidth = computed(() => {
-  return `max(3px, ${props.spanNode.durationNano / config.totalDurationNano * config.zoom * 100}%)`
+const barLeft = computed(() => `min(100% - ${MIN_WIDTH}px, calc((100% - ${MIN_WIDTH}px) * ${(barFixedLeft.value + barShiftLeft.value)})`)
+const barExtraWidthFactor = computed(() => {
+  if (!config.root) {
+    return 0
+  }
+  /**
+   * We will make minDuration as `MIN_WIDTH`. Therefore, we will calculate the "extra" width besides the
+   * `MIN_WIDTH`. We will present this extra width as a factor.
+   *
+   * e.g.
+   * - The total duration should take `MIN_WIDTH + (100% - MIN_WIDTH) * 1` which is `100%` (factor = 1)
+   * - The minimal duration should take `MIN_WIDTH + (100% - MIN_WIDTH) * 0` which is `MIN_WIDTH` (factor = 0)
+   *
+   * Therefore, the formula to calculate the factor for a span is:
+   * (span duration - minimal duration) / (total duration - minimal duration)`
+   */
+  return (props.spanNode.durationNano - config.root.subtreeValues.minDurationNano)
+    / (config.totalDurationNano - config.root.subtreeValues.minDurationNano)
 })
+const barWidth = computed(() =>
+  `calc((${MIN_WIDTH}px + (100% - ${MIN_WIDTH}px) * ${barExtraWidthFactor.value}) * ${config.zoom})`,
+)
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/core/tracing/src/components/waterfall/WaterfallSpanRow.vue b/packages/core/tracing/src/components/waterfall/WaterfallSpanRow.vue
index 8733640b5b..9946f0caa9 100644
--- a/packages/core/tracing/src/components/waterfall/WaterfallSpanRow.vue
+++ b/packages/core/tracing/src/components/waterfall/WaterfallSpanRow.vue
@@ -187,7 +187,7 @@ const handleSelect = () => {
   position: relative;
   width: 100%;
 
-  &.selected {
+  &:hover, &.selected {
     $row-background-color: $kui-color-background-primary-weakest;
     background-color: $row-background-color;
 
diff --git a/packages/core/tracing/src/components/waterfall/WaterfallView.vue b/packages/core/tracing/src/components/waterfall/WaterfallView.vue
index a21ec76404..78c36722a6 100644
--- a/packages/core/tracing/src/components/waterfall/WaterfallView.vue
+++ b/packages/core/tracing/src/components/waterfall/WaterfallView.vue
@@ -124,10 +124,14 @@ const spanBarMeasurementRef = useTemplateRef<HTMLElement>('spanBarMeasurement')
 const interaction = ref<'scroll' | 'zoom'>('scroll')
 const rowsAreaGuideX = ref<number | undefined>(undefined)
 
-const config = reactive<MarkReactiveInputRefs<WaterfallConfig, 'ticks' | 'totalDurationNano' | 'startTimeUnixNano'>>({
-  ticks: toRef(props, 'ticks'), // This will be unwrapped
-  totalDurationNano: computed(() => props.rootSpan?.durationNano ?? 0), // This will be unwrapped
-  startTimeUnixNano: computed(() => props.rootSpan ? BigInt(props.rootSpan.span.startTimeUnixNano) : 0n), // This will be unwrapped
+const config = reactive<MarkReactiveInputRefs<WaterfallConfig, 'ticks' | 'root' | 'totalDurationNano'>>({
+  ticks: toRef(props, 'ticks'),
+  root: toRef(props, 'rootSpan'),
+  totalDurationNano: computed(() =>
+    props.rootSpan
+      ? Number(props.rootSpan.subtreeValues.endTimeUnixNano - props.rootSpan.subtreeValues.startTimeUnixNano)
+      : 0,
+  ),
   zoom: 1,
   viewportShift: 0,
   viewport: { left: 0, right: 0 },
diff --git a/packages/core/tracing/src/constants/spans.ts b/packages/core/tracing/src/constants/spans.ts
index aa1e35c659..35ca20c378 100644
--- a/packages/core/tracing/src/constants/spans.ts
+++ b/packages/core/tracing/src/constants/spans.ts
@@ -7,214 +7,237 @@ export const SPAN_ATTRIBUTE_VALUE_UNKNOWN = 'unknown'
 // Internally used here only
 const SPAN_ATTR_KEY_KONG_PREFIX = 'proxy.kong'
 
+export enum SpanAttributeKeys {
+  _INTERNAL_END_TIME = '$$ui_internal.end_time',
+  _INTERNAL_START_TIME = '$$ui_internal.start_time',
+  CLIENT_ADDRESS = 'client.address',
+  CLIENT_PORT = 'client.port',
+  DB_STATEMENT = 'db.statement',
+  DB_SYSTEM = 'db.system',
+  DESTINATION_ADDRESS = 'destination.address',
+  HTTP_REQUEST_METHOD = 'http.request.method',
+  HTTP_RESPONSE_STATUS_CODE = 'http.response.status_code',
+  HTTP_ROUTE = 'http.route',
+  KONG_CONSUMER_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.consumer.id`,
+  KONG_LATENCY_TOTAL_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.latency_total_ms`,
+  KONG_PLUGIN_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.plugin.id`,
+  KONG_REDIS_TOTAL_IO_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.redis.total_io_ms`,
+  KONG_REQUEST_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.request.id`,
+  KONG_ROUTE_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.route.id`,
+  KONG_SAMPLING_RULE = `${SPAN_ATTR_KEY_KONG_PREFIX}.sampling_rule`,
+  KONG_SERVICE_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.service.id`,
+  KONG_TARGET_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.target.id`,
+  KONG_TCPSOCK_TOTAL_IO_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.tcpsock.total_io_ms`,
+  KONG_UPSTREAM_ADDR = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.addr`,
+  KONG_UPSTREAM_CONNECT_DURATION_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.connect_duration_ms`,
+  KONG_UPSTREAM_HOST = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.host`,
+  KONG_UPSTREAM_ID = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.id`,
+  KONG_UPSTREAM_LB_ALGORITHM = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.lb_algorithm`,
+  KONG_UPSTREAM_READ_RESPONSE_DURATION_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.read_response_duration_ms`,
+  KONG_UPSTREAM_RESPONSE_DURATION_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.response_duration_ms`,
+  KONG_UPSTREAM_STATUS_CODE = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.status_code`,
+  KONG_UPSTREAM_TTFB_MS = `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.ttfb_ms`,
+  NETWORK_PEER_ADDRESS = 'network.peer.address',
+  NETWORK_PEER_NAME = 'network.peer.name',
+  NETWORK_PEER_PORT = 'network.peer.port',
+  NETWORK_PROTOCOL_NAME = 'network.protocol.name',
+  NETWORK_PROTOCOL_VERSION = 'network.protocol.version',
+  NETWORK_TRANSPORT = 'network.transport',
+  SERVER_ADDRESS = 'server.address',
+  SERVER_PORT = 'server.port',
+  URL_FULL = 'url.full',
+  URL_QUERY = 'url.query',
+  URL_SCHEME = 'url.scheme',
+}
+
 /**
  * These definitions are exported from Gateway's codebase.
  * They are subject to change in the future.
  */
-export const SPAN_ATTRIBUTES = {
-  CLIENT_ADDRESS: {
-    name: 'client.address',
-    alias: 'net.src.ip',
+const unnamedSpanAttributes = {
+  [SpanAttributeKeys.CLIENT_ADDRESS]: {
     type: 'IpAddr',
-    useForSampling: true,
+    sampling: {
+      aliases: ['net.src.ip'],
+    },
   },
-  CLIENT_PORT: {
-    name: 'client.port',
-    alias: 'net.src.port',
+  [SpanAttributeKeys.CLIENT_PORT]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: {
+      aliases: ['net.src.port'],
+    },
   },
-  DESTINATION_ADDRESS: {
-    name: 'destination.address',
+  [SpanAttributeKeys.DESTINATION_ADDRESS]: {
     type: 'IpAddr',
-    useForSampling: true,
+    sampling: true,
   },
-  SERVER_ADDRESS: {
-    name: 'server.address',
-    alias: 'net.dst.ip',
-    type: 'IpAddr',
-    useForSampling: true,
+  [SpanAttributeKeys.SERVER_ADDRESS]: {
+    type: 'String',
+    sampling: {
+      aliases: [
+        'tls.sni',
+        { name: 'net.dst.ip', type: 'IpAddr' },
+      ],
+    },
   },
-  SERVER_PORT: {
-    name: 'server.port',
-    alias: 'net.dst.port',
+  [SpanAttributeKeys.SERVER_PORT]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: {
+      aliases: ['net.dst.port'],
+    },
   },
-  NETWORK_PROTOCOL: {
-    name: 'network.protocol.name',
-    alias: 'net.protocol',
+  [SpanAttributeKeys.NETWORK_PROTOCOL_NAME]: {
     type: 'String',
-    useForSampling: true,
+    sampling: {
+      aliases: ['net.protocol'],
+    },
   },
-  NETWORK_PROTOCOL_VERSION: {
-    name: 'network.protocol.version',
+  [SpanAttributeKeys.NETWORK_PROTOCOL_VERSION]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  NETWORK_TRANSPORT: {
-    name: 'network.transport',
+  [SpanAttributeKeys.NETWORK_TRANSPORT]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  URL_SCHEME: {
-    name: 'url.scheme',
-    alias: 'net.protocol',
+  [SpanAttributeKeys.URL_SCHEME]: {
     type: 'String',
-    useForSampling: true,
+    sampling: {
+      aliases: ['net.protocol'],
+    },
   },
-  REQUEST_METHOD: {
-    name: 'http.request.method',
-    alias: 'http.method',
+  [SpanAttributeKeys.HTTP_REQUEST_METHOD]: {
     type: 'String',
-    useForSampling: true,
+    sampling: {
+      aliases: ['http.method'],
+    },
   },
-  URL_PATH: {
-    name: 'http.route',
-    alias: 'http.path',
+  [SpanAttributeKeys.HTTP_ROUTE]: {
     type: 'String',
-    useForSampling: true,
+    sampling: {
+      aliases: ['http.path'],
+    },
   },
-  URL_FULL: {
-    name: 'url.full',
+  [SpanAttributeKeys.URL_FULL]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  URL_QUERY: {
-    name: 'url.query',
+  [SpanAttributeKeys.URL_QUERY]: {
     type: 'String',
+    sampling: true,
   },
-  HTTP_RESPONSE_STATUS_CODE: {
-    name: 'http.response.status_code',
+  [SpanAttributeKeys.HTTP_RESPONSE_STATUS_CODE]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  NETWORK_PEER_ADDRESS: {
-    name: 'network.peer.address',
+  [SpanAttributeKeys.NETWORK_PEER_ADDRESS]: {
     type: 'IpAddr',
-    useForSampling: true,
+    sampling: true,
   },
   /**
    * This is non-standard but it's available to us via the balancer
    */
-  NETWORK_PEER_NAME: {
-    name: 'network.peer.name',
+  [SpanAttributeKeys.NETWORK_PEER_NAME]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  NETWORK_PEER_PORT: {
-    name: 'network.peer.port',
+  [SpanAttributeKeys.NETWORK_PEER_PORT]: {
     type: 'Int',
-    useForSampling: true,
-  },
-  /**
-   * Deprecated in OTEL, replaced by "server.address"
-   * https://opentelemetry.io/docs/specs/semconv/attributes-registry/tls/#tls-deprecated-attributes
-   */
-  TLS_SERVER_NAME_INDICATION: {
-    name: 'server.address',
-    alias: 'tls.sni',
-    type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_SERVICE_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.service.id`,
+  [SpanAttributeKeys.KONG_SERVICE_ID]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_ROUTE_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.route.id`,
+  [SpanAttributeKeys.KONG_ROUTE_ID]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_CONSUMER_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.consumer.id`,
+  [SpanAttributeKeys.KONG_CONSUMER_ID]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.id`,
+  [SpanAttributeKeys.KONG_UPSTREAM_ID]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_STATUS_CODE: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.status_code`,
+  [SpanAttributeKeys.KONG_UPSTREAM_STATUS_CODE]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_ADDR: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.addr`,
+  [SpanAttributeKeys.KONG_UPSTREAM_ADDR]: {
     type: 'IpAddr',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_HOST: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.host`,
+  [SpanAttributeKeys.KONG_UPSTREAM_HOST]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_LB_ALGORITHM: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.lb_algorithm`,
+  [SpanAttributeKeys.KONG_UPSTREAM_LB_ALGORITHM]: {
     type: 'String',
   },
-  KONG_TARGET_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.target.id`,
+  [SpanAttributeKeys.KONG_TARGET_ID]: {
     type: 'String',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_PLUGIN_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.plugin.id`,
+  [SpanAttributeKeys.KONG_PLUGIN_ID]: {
     type: 'String',
   },
-  KONG_SAMPLING_RULE: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.sampling_rule`,
+  [SpanAttributeKeys.KONG_SAMPLING_RULE]: {
     type: 'String',
   },
-  KONG_REQUEST_ID: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.request.id`,
+  [SpanAttributeKeys.KONG_REQUEST_ID]: {
     type: 'String',
   },
-  KONG_UPSTREAM_TTFB_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.ttfb_ms`,
+  [SpanAttributeKeys.KONG_UPSTREAM_TTFB_MS]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_READ_RESPONSE_DURATION_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.read_response_duration_ms`,
+  [SpanAttributeKeys.KONG_UPSTREAM_READ_RESPONSE_DURATION_MS]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_UPSTREAM_CONNECT_DURATION_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.connect_duration_ms`,
+  [SpanAttributeKeys.KONG_UPSTREAM_CONNECT_DURATION_MS]: {
     type: 'Int',
   },
-  KONG_UPSTREAM_RESPONSE_DURATION_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.upstream.response_duration_ms`,
+  [SpanAttributeKeys.KONG_UPSTREAM_RESPONSE_DURATION_MS]: {
     type: 'Int',
   },
-  KONG_LATENCY_TOTAL_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.latency_total_ms`,
+  [SpanAttributeKeys.KONG_LATENCY_TOTAL_MS]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_TOTAL_IO_REDIS_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.redis.total_io_ms`,
+  [SpanAttributeKeys.KONG_REDIS_TOTAL_IO_MS]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  KONG_TOTAL_IO_TCPSOCKET_MS: {
-    name: `${SPAN_ATTR_KEY_KONG_PREFIX}.tcpsock.total_io_ms`,
+  [SpanAttributeKeys.KONG_TCPSOCK_TOTAL_IO_MS]: {
     type: 'Int',
-    useForSampling: true,
+    sampling: true,
   },
-  DB_SYSTEM: {
-    name: 'db.system',
+  [SpanAttributeKeys.DB_SYSTEM]: {
     type: 'String',
   },
-  DB_STATEMENT: {
-    name: 'db.statement',
+  [SpanAttributeKeys.DB_STATEMENT]: {
     type: 'String',
   },
-} satisfies Record<string, SpanAttributeSchema>
+  [SpanAttributeKeys._INTERNAL_START_TIME]: {
+    type: 'String',
+    internal: true,
+  },
+  [SpanAttributeKeys._INTERNAL_END_TIME]: {
+    type: 'String',
+    internal: true,
+  },
+} satisfies Record<SpanAttributeKeys, Omit<SpanAttributeSchema, 'name'>>
+
+type NamedSpanAttributes = {
+  [K in keyof typeof unnamedSpanAttributes]: typeof unnamedSpanAttributes[K] & Pick<SpanAttributeSchema, 'name'>
+}
+
+export const SPAN_ATTRIBUTES =
+  Object.fromEntries(Object.entries(unnamedSpanAttributes)
+    .map(([key, value]) => ([key, { name: key, ...value }]))) as NamedSpanAttributes
 
 export const SPAN_EVENT_ATTRIBUTES = {
   MESSAGE: {
diff --git a/packages/core/tracing/src/locales/en.json b/packages/core/tracing/src/locales/en.json
index 4100a0e77b..25a6118b30 100644
--- a/packages/core/tracing/src/locales/en.json
+++ b/packages/core/tracing/src/locales/en.json
@@ -3,6 +3,12 @@
     "content": "Content of the header",
     "title": "Title of the header"
   },
+  "span_attributes": {
+    "labels": {
+      "start_time": "Start time",
+      "end_time": "End time"
+    }
+  },
   "trace_viewer": {
     "empty_state": {
       "nothing_to_display": "There's nothing to display for the selected span",
diff --git a/packages/core/tracing/src/types/spans.ts b/packages/core/tracing/src/types/spans.ts
index 61a4124cb6..d6d9a6d3f8 100644
--- a/packages/core/tracing/src/types/spans.ts
+++ b/packages/core/tracing/src/types/spans.ts
@@ -27,6 +27,25 @@ export interface SpanNode {
   durationNano: number // Number.MAX_SAFE_INTEGER / 1e9 / 60 / 60 / 24 = 104.24999137431702 days (enough for most cases)
   parent?: SpanNode
   children: SpanNode[]
+  /**
+   * Aggregated values from all nodes (including the current one) in the subtree.
+   * This stores values bottom-up and allows us to avoid extra tree traversal while building the trace trees.
+   */
+  subtreeValues: {
+    /**
+     * The earliest start time among all nodes in the subtree.
+     */
+    startTimeUnixNano: bigint
+    /**
+     * The latest end time among all nodes in the subtree
+     */
+    endTimeUnixNano: bigint
+    /**
+     * The minimum duration among all nodes in the subtree.
+     * Default to the duration of the span itself.
+     */
+    minDurationNano: number
+  }
 }
 
 interface AttributeSchema {
@@ -34,9 +53,35 @@ interface AttributeSchema {
   type: string
 }
 
+export interface SpanAttributeExprAlias {
+  name: string
+  type: string
+}
+
+/**
+ * Definition of the sampling rule configuration for a span attribute.
+ * This is mainly used under the context of the Expressions (ATC) language.
+ */
+export interface SpanAttributeSampling {
+  /**
+   * Type of the value in Expressions (ATC). This field is currently preserved.
+   * When omitted, the type is inferred from the span attribute.
+   */
+  type?: string
+  /**
+   * Aliases for the usage in Expressions (ATC). This field is currently preserved.
+   * If a string is used as an alias, the type is inferred from the sampling rules configuration.
+   */
+  aliases?: (SpanAttributeExprAlias | string)[]
+}
+
 export interface SpanAttributeSchema extends AttributeSchema {
-  alias?: string
-  useForSampling?: boolean
+  /**
+   * Configuration for sampling rules associated with this attribute.
+   * When omitted, the attribute is not used for sampling.
+   */
+  sampling?: boolean | SpanAttributeSampling
+  internal?: boolean
 }
 
 export type SpanEventAttributeSchema = AttributeSchema
diff --git a/packages/core/tracing/src/types/waterfall.ts b/packages/core/tracing/src/types/waterfall.ts
index 1b6daf7f32..974eb81d30 100644
--- a/packages/core/tracing/src/types/waterfall.ts
+++ b/packages/core/tracing/src/types/waterfall.ts
@@ -2,8 +2,12 @@ import type { SpanNode } from './spans'
 
 export interface WaterfallConfig {
   ticks: number
+  root?: SpanNode
+  /**
+   * The duration calculated by subtracting the earliest start time from the latest end time from the
+   * spans. It should be the longest duration that wraps all the spans.
+   */
   totalDurationNano: number
-  startTimeUnixNano: bigint
   /** Zoom level */
   zoom: number
   /**
diff --git a/packages/core/tracing/src/utils/spans.ts b/packages/core/tracing/src/utils/spans.ts
index 8c16e166cd..d9a5a86ebf 100644
--- a/packages/core/tracing/src/utils/spans.ts
+++ b/packages/core/tracing/src/utils/spans.ts
@@ -1,6 +1,6 @@
+import { cloneDeep } from 'lodash-es'
 import { SPAN_ZERO_ID } from '../constants'
 import { type IAnyValue, type Span, type SpanNode } from '../types'
-import { cloneDeep } from 'lodash-es'
 
 /**
  * Iterate over the spans and build span trees, where each tree stores a trace.
@@ -23,7 +23,8 @@ export const buildSpanTrees = (spans: Span[]): SpanNode[] => {
       attributes,
       events,
     } = span
-    const node = {
+    const durationNano = Number(BigInt(span.endTimeUnixNano) - BigInt(span.startTimeUnixNano))
+    const node: SpanNode = {
       span: {
         traceId,
         spanId,
@@ -35,8 +36,13 @@ export const buildSpanTrees = (spans: Span[]): SpanNode[] => {
         events: cloneDeep(events), // Avoid mutating the original events
       },
       root: !span.parentSpanId || span.parentSpanId === SPAN_ZERO_ID,
-      durationNano: Number(BigInt(span.endTimeUnixNano) - BigInt(span.startTimeUnixNano)),
+      durationNano,
       children: [],
+      subtreeValues: {
+        startTimeUnixNano: BigInt(span.startTimeUnixNano),
+        endTimeUnixNano: BigInt(span.endTimeUnixNano),
+        minDurationNano: durationNano,
+      },
     }
     node.span.attributes?.sort((a, b) => a.key.localeCompare(b.key))
     nodes.set(span.spanId, node)
@@ -48,6 +54,16 @@ export const buildSpanTrees = (spans: Span[]): SpanNode[] => {
     if (!node.root) {
       const parent = nodes.get(node.span.parentSpanId!)!
       parent.children.push(node)
+      // Update subtree values when necessary
+      if (node.subtreeValues.minDurationNano < parent.subtreeValues.minDurationNano) {
+        parent.subtreeValues.minDurationNano = node.subtreeValues.minDurationNano
+      }
+      if (node.subtreeValues.startTimeUnixNano < parent.subtreeValues.startTimeUnixNano) {
+        parent.subtreeValues.startTimeUnixNano = node.subtreeValues.startTimeUnixNano
+      }
+      if (node.subtreeValues.endTimeUnixNano > parent.subtreeValues.endTimeUnixNano) {
+        parent.subtreeValues.endTimeUnixNano = node.subtreeValues.endTimeUnixNano
+      }
     } else {
       roots.push(node)
     }
@@ -67,7 +83,7 @@ export const buildSpanTrees = (spans: Span[]): SpanNode[] => {
  * @returns the parsed phase and plugin or undefined if the span is not a plugin span
  */
 export const getPhaseAndPlugin = (spanName: string): [phase: string, plugin: string] | undefined => {
-  const matches = /^kong\.(rewrite|access|response|header_filter|body_filter)\.plugin\.(.+?)(?:$|\..*)/gi.exec(spanName)
+  const matches = /^kong\.([^.]+)\.plugin\.(.+?)(?:$|\..*)/gi.exec(spanName)
   if (!matches) {
     return undefined
   }
diff --git a/packages/core/tracing/src/utils/time.ts b/packages/core/tracing/src/utils/time.ts
index fa393da1e1..7d39787c10 100644
--- a/packages/core/tracing/src/utils/time.ts
+++ b/packages/core/tracing/src/utils/time.ts
@@ -30,3 +30,17 @@ export const getDurationFormatter = (locales: Intl.LocalesArgument = 'en') => {
     return `${fmt.format(t / 60)}h`
   }
 }
+
+/**
+ * This function formats a nanosecond duration into a human-readable string.
+ *
+ * Example output: `2024-12-09T13:31:47.476672512Z`
+ *
+ * @param nanoseconds
+ * @returns an ISO 8601 formatted string with nanoseconds precision
+ */
+export const formatNanoDateTimeString = (nanoseconds: bigint) => {
+  const ms = nanoseconds / BigInt(1e6)
+  const nsRemainder = nanoseconds - ms * BigInt(1e6)
+  return new Date(Number(ms)).toISOString().replace(/Z$/g, `${nsRemainder.toString().padStart(6, '0')}Z`)
+}