Skip to content

Back/Forward Cache Optimizer

Reviews pages for back/forward cache blockers and fixes lifecycle listeners so navigation restores instantly

Stars
74,632
Licence
MIT
Files
2 files

What it does

This skill teaches an AI agent to review a web page's code for things that stop the browser's back/forward cache from working. That cache lets the browser restore a whole page from memory when a user presses Back or Forward, instead of reloading it. The agent is guided to find blocking listeners such as unload and unconditional beforeunload, to switch to pagehide and pageshow handlers, and to refresh only time-sensitive state after a restore.

Great for

  • Front-end developers who want faster back and forward navigation in a website or web app
  • Teams auditing a route's global listeners, analytics hooks, or data-refresh logic for performance issues

Skip it if

  • Projects that do not use a browser front end, since the skill only applies to page navigation in browsers
  • Pages where a fresh reload is required on every visit, because the skill's fixes may not suit those cases and changes should be tested first

Try asking

  • “Review my checkout page for anything that blocks the back/forward cache”
  • “Replace the unload listener in this app with pagehide and pageshow handlers”
  • “Check whether my analytics script breaks bfcache eligibility after a restore”
Step-by-step guide: how to use Back/Forward Cache OptimizerInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the MIT licence and an attribution note.

    back-forward-cache.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip back-forward-cache.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip back-forward-cache.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Point the agent at a specific route or component so it can flag exact listeners rather than general patterns.
  • Verify the results in browser DevTools, since the skill itself recommends checking eligibility there rather than trusting code patterns alone.
  • Ask the agent to explain each proposed change so you can confirm that stale state is refreshed correctly after a restore.

What's inside

  • references/rule.md
  • SKILL.md

Redistributed unmodified from thedaviddias/Front-End-Checklist under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.