인터페이스는 현지화되어 있으며, Skill 소개와 설명 문서는 선택한 언어로 AI가 자동 번역합니다. 코드·명령어·경로·전문 용어는 원문을 유지하며 원작자 문서가 우선합니다.
Skills 둘러보기
개발 및 엔지니어링 · SKILL.md

back-forward-cache

back-forward-cache

Use when reviewing navigation performance, browser lifecycle events, or resume-from-memory behavior. Check the actual browser lifecycle and restore path, not only static code patterns.

Independent GitHub snapshot · Automated classification · Original documentation governs

Skill 문서

GitHub

name: back-forward-cache description: "Use when reviewing navigation performance, browser lifecycle events, or resume-from-memory behavior. Check the actual browser lifecycle and restore path, not only static code patterns." metadata: category: performance priority: high difficulty: advanced estimatedTime: "25" source: frontendchecklist.io url: https://frontendchecklist.io/rules/performance/back-forward-cache

Optimize pages for back/forward cache

Back/forward cache turns many browser back and forward navigations into near-instant restores because the entire page is resumed from memory instead of being rebuilt from the network. Losing bfcache eligibility makes common navigations feel far slower than they need to.

Quick Reference

  • Never add an unload listener - it is the most common bfcache blocker
  • Use pagehide and pageshow instead of assuming every navigation reloads
  • Refresh time-sensitive state when pageshow.persisted is true
  • Keep beforeunload conditional and remove it when there are no unsaved changes
  • Verify eligibility in DevTools instead of assuming a page is cacheable

Check

Review this route for back/forward cache blockers. Search for unload or unconditional beforeunload listeners, state that assumes every navigation is a full reload, and resource lifecycles that break when the page is resumed from memory.

Fix

Replace unload logic with pagehide and pageshow handlers, remove unnecessary blockers, and refresh only the time-sensitive state that must change after a bfcache restore.

Explain

Explain how the back/forward cache differs from HTTP caching, why unload blocks it, and how pageshow/pagehide should be used instead.

Code Review

Review route code, global listeners, analytics hooks, and data-refresh logic related to Optimize pages for back/forward cache. Flag exact listeners, APIs, or lifecycle assumptions that prevent a restore or leave stale state after a restore.


For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/rules/performance/back-forward-cache

저장한 Skills