找出拖慢页面首次加载的地图、编辑器等可选功能，改为在点击或获得焦点等操作后加载所需代码，并补充加载状态提示，检查初始页面和操作后的功能。
Use when reviewing slow initial loads caused by optional features. Prioritize code that is expensive to download or execute and not required for the first viewport, first input, or core task completion.
检查页面首次显示时加载的较重功能，将其改为在用户操作后再获取所需代码。对象包括初始画面、首次输入或主要任务不需要的地图、编辑器、聊天、筛选和导出功能。使用按需加载代码的import()，减少首次发送的JavaScript以及首次加载时的执行工作。
适合页面因提前加载只有部分用户会使用的功能而显示缓慢的情况。查找可以延后到点击、获得焦点、悬停或打开面板时再加载的依赖代码。补充能让用户了解等待状态的提示，并检查不使用延迟加载的功能时，初始页面仍能正常工作。
import()加载地图，并添加等待期间的状态提示。”延迟加载的对象应当是初始画面、首次输入和主要任务不需要的功能。修改后，既要确认首次加载的负担有所减少，也要检查用户操作后，相应功能是否仍能正常使用。
本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。
AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。
总分按每项 A=25 分、B=15 分、C=5 分相加。 由 AI（OpenAI Codex）于 2026年10月23日 评估。仅供参考，安装前请同时查看原文。
安装前可以查看交给 AI 代理的指令内容。
Users should not pay the download, parse, and execution cost for features they may never use. Import-on-interaction shrinks initial JavaScript, reduces main-thread work during page load, and keeps the first view focused on content that matters immediately.
Inspect this route or component for heavy modules, widgets, or third-party scripts that load on first render but are only needed after a user clicks, focuses, hovers, or opens a panel.
Move the non-critical dependency behind a user-triggered dynamic import(), add immediate loading feedback, and ensure the initial render still works without the deferred feature.
Explain import-on-interaction, why it improves initial performance, and which features are safe to defer until the user shows intent.
Inspect event handlers, modal triggers, drawers, editors, maps, export actions, and third-party widgets. Flag code that is included in the initial bundle even though it is only needed after a user interaction, and verify the fix keeps the initial path lighter without degrading the triggered flow.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/rules/performance/import-on-interaction
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Create and review custom 404 pages that help visitors recover from broken or moved links through search and navigation. Check the rendered page and HTTP response so missing content returns a proper 404 status.
中文简介正在准备中。当前显示英语简介。
Audit or create a dedicated About page that explains a website’s purpose and identifies its people or organization. Review the rendered output and supporting information, including expertise and contact details, to find gaps.
中文简介正在准备中。当前显示英语简介。
为页面和共用组件添加自动无障碍测试，检查现有测试的覆盖缺口，并将检查接入持续集成流程，以发现结构、属性问题及修改引入的新问题。
检查从登录、多因素认证到账户恢复的完整流程，找出禁止粘贴、验证码必须手动输入等使用障碍，并协助改进认证方式。
Review form errors, success messages, and live updates so screen reader users receive important notifications. Check the HTML delivered to the browser, announcement settings, display duration, and dismissal controls, then identify specific elements that need changes.
中文简介正在准备中。当前显示英语简介。
Review HTML tables so screen reader users can understand how headers and data relate. Check header markup, table descriptions, and merged cells, then identify specific fixes and ways to verify them.
中文简介正在准备中。当前显示英语简介。