Thedaviddias Front End Checklist
合集@thedaviddias7.4万+开源协议: MIT
在审查与避免对表单字段使用 autofocus 相关的渲染 HTML、交互组件或设计系统模式时使用。先检查原生语义，再根据需要检查键盘行为、焦点流程、可访问名称…
integration-testing
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查 CI 覆盖、自动化检查或与「为关键工作流编写集成测试」相关的测试策略时使用。重点关注该规则是否被持续验证，而非仅仅被记录。
*/interaction-to-next-paint
@thedaviddias
编程协作开源协议: MIT
/**
* 在审计与 Optimize interaction to next paint 相关的慢速页面加载、沉重资源或渲染延迟时使用。在给出优化建议之前，请先在 Dev…
*/internal-links
@thedaviddias
设计多媒体开源协议: MIT
/**
* 在审计网站的内部链接结构、识别需要更多入站链接的页面、在相关内容之间生成上下文链接机会，或审查 CMS 模板的内部链接模式时使用。
*/interstitials
@thedaviddias
编程协作开源协议: MIT
/**
* 适用于模态框、遮罩层、弹窗、Cookie 横幅、订阅对话框以及促销遮罩层等元素的 CSS 与 JavaScript 实现。需检查 `position: fixe…
*/invalid-links
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审计页面的链接元素是否可被爬取、检查以 JavaScript 为主的单页应用（SPA）中导航是否未使用 `<a href>` 标签，或检查动态生成的链接是否…
*/javascript-inline
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审查脚本、客户端组件、打包产物或与"避免内联 JavaScript"相关的运行时行为时使用。需要同时检查源代码与浏览器执行路径，以便修复能真正命中瓶颈或缺陷…
*/javascript-linter
@thedaviddias
流程自动化开源协议: MIT
/**
* 在审查脚本、客户端组件、构建产物，或与 Lint JavaScript code 相关的运行时行为时使用。同时检查源码与浏览器执行路径，以便修复能够针对真正的瓶…
*/javascript-minification
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与“压缩所有 JavaScript 文件”相关的脚本、客户端组件、打包产物或运行时行为时使用。需要同时检查源代码与浏览器执行路径，以便定位真正的瓶颈或缺陷…
*/js-file-size
@thedaviddias
编程协作开源协议: MIT
/**
* 在排查与优化 JavaScript 包体积相关的页面加载缓慢、资源过重或渲染延迟时使用。应在推荐变更之前，先在 DevTools、Lighthouse 或线上数…
*/js-libraries
@thedaviddias
编程协作开源协议: MIT
/**
* 在审计与使用安全且最新的 JavaScript 库相关的页面加载缓慢、资源过重或渲染延迟时使用。在建议更改之前，请通过 DevTools、Lighthouse …
*/js-redirects
@thedaviddias
编程协作开源协议: MIT
/**
* 用于排查与“避免使用基于 JavaScript 的重定向”相关的页面加载缓慢、资源过大或渲染延迟问题。在给出改进建议之前，请先在 DevTools、Lighth…
*/json-ld-valid
@thedaviddias
编程协作开源协议: MIT
/**
* 用于生成或审计任何 `<script type='application/ld+json'>` 代码块、为文章、产品、FAQ、面包屑导航或本地商家实现结构化数据…
*/json-safety
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与「安全地解析 JSON 并进行错误处理」相关的脚本、客户端组件、打包产物或运行时行为时使用。需要同时检查源代码和浏览器执行路径，以确保修复能针对真正的瓶…
*/keyboard-navigation
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审查与“为所有元素启用键盘导航”相关的已渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义，然后审视键盘行为、焦点流转、可访问名称以及相关的屏幕…
*/keyword-stuffing
@thedaviddias
编程协作开源协议: MIT
/**
* 在审计内容页面是否存在过度优化、审查可能过度重复目标关键词的 AI 生成内容，或检查元标签和 alt 文本中是否存在不自然的关键词堆砌时使用。
*/label-content-name-mismatch
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查渲染后的 HTML、交互组件或与“使可见标签与可访问名称保持一致”相关的设计系统模式时使用。首先检查原生语义，然后根据需要审查键盘行为、焦点流转、可访问名…
*/landmark-one-main
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与"每个页面仅使用一个 main 标志性区域"相关的渲染 HTML、交互组件或设计系统模式时使用。首先检查原生语义，然后根据需要检查键盘行为、焦点流转、可…
*/landmark-regions
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与“正确使用地标区域”相关的已渲染 HTML、交互组件或设计系统模式时使用。首先检查原生语义，然后在相关场景下检查键盘行为、焦点流转、可访问名称以及屏幕阅…
*/lang-attribute
@thedaviddias
编程协作开源协议: MIT
/**
* 适用于所有 HTML 文档。检查 `<html>` 开始标签是否带有非空、合法的 BCP 47 语言代码的 `lang` 属性。当文档包含多种语言的内容（内联引…
*/largest-contentful-paint
@thedaviddias
编程协作开源协议: MIT
/**
* 用于排查页面加载缓慢、资源过重或与优化最大内容绘制（LCP）相关的渲染延迟问题。在给出优化建议之前，请先在 DevTools、Lighthouse 或线上数据中…
*/lazy-above-fold
@thedaviddias
编程协作开源协议: MIT
/**
* 在排查页面加载缓慢、静态资源过重，或与“对首屏内容禁用懒加载”相关的渲染延迟时使用。在给出改动建议前，应先在 DevTools、Lighthouse 或线上数据…
*/lazy-loading
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审计与“针对离屏内容实现懒加载”相关的缓慢页面加载、沉重资源或渲染延迟。在推荐更改之前，请先在 DevTools、Lighthouse 或线上数据中确认实际…
*/leaked-secrets
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查客户端 JavaScript、HTML 源码或 git 历史时使用，以发现暴露的凭证、API 密钥或令牌。
*/legacy-js
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审计与“向现代浏览器提供旧版 JavaScript”相关的慢速页面加载、庞大资源或渲染延迟。在建议更改之前，请在 DevTools、Lighthouse 或…
*/