Cacheability Inspector

Cacheability Inspector is a lightweight developer tool designed to visually expose cacheability metadata across your site's rendered components in real time.

When dealing with complex page layouts, nested paragraphs, Views, and blocks, tracking down why a page is returning UNCACHEABLE or why the Dynamic Page Cache breaks can be frustrating. Cache Inspector solves this by surfacing the exact cache tags, cache contexts, and max-age values directly on the front-end layout as you browse.

Features

• Visual Component Overlay: Outlines rendered entities and blocks on the page, displaying their cache tags, contexts, max-age, and language code in clean inline badges.
• Deep Component Coverage: Intercepts and inspects:
  • Content Entities (Nodes, Media, Paragraphs, Custom Blocks, Users)
  • Block Plugins (System menus, custom blocks, Views blocks)
  • Views (Page displays, embedded Views fields, and view blocks)
• Uncacheable Alerting: Automatically highlights components with max-age = 0 or problematic cache contexts in bright red so you can spot "cache killer" elements instantly.
• Granular Access Control: Uses a dedicated permission (inspect cache metadata) so you can safely enable it for developers or site builders without leaking technical metadata to end users or normal roles.
• Multilingual Aware: Displays current language context alongside component identifiers.

How to Use

1. Install and enable the module as usual.
2. Go to People → Permissions (/admin/people/permissions) and grant Inspect cache metadata to your trusted administrative or developer roles.
3. View any node or entity page on your site. Hover over any component badge to expand a full breakdown of its cache tags, contexts, and max-age parameters.