47+AI
ZH

Thedaviddias Front End Checklist

合集
@thedaviddias7.4万+开源协议: MIT

在审查与避免对表单字段使用 autofocus 相关的渲染 HTML、交互组件或设计系统模式时使用。先检查原生语义,再根据需要检查键盘行为、焦点流程、可访问名称…

GitHub

length

@thedaviddias

编程协作开源协议: MIT
/**
 * 在从文章标题生成 URL slug、审计 URL 结构是否存在不必要的层级或过长问题,或审查 CMS 或路由配置中的 URL 模式时使用。
 */

link-checker

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审查与“检查失效链接”相关的模板、渲染后的 HTML 或共享组件。验证最终面向浏览器的标记,而非仅仅验证源框架的抽象层。
 */

link-in-text-block

@thedaviddias

编程协作开源协议: MIT
/**
 * 适用于出现在段落或文本块内的内联超链接(`<a>` 元素)。不适用于导航菜单、按钮样式的链接,以及在视觉上独立于正文文本的独立链接。在审查移除了内联正文链接 t…
 */

link-text

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查与「使用描述性链接文本」相关的渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义,再视情况检查键盘行为、焦点流转、可访问名称以及屏幕阅读器输出…
 */

list-structure

@thedaviddias

编程协作开源协议: MIT
/**
 * Use when reviewing rendered HTML, interactive components, or design-system patte
 */

list-virtualization

@thedaviddias

编程协作开源协议: MIT
/**
 * 当审查仪表板、管理后台表格、搜索结果或包含大量重复项的信息流时使用。在引入虚拟化之前,应确认瓶颈确实出现在 DOM 或渲染成本上,因为小型列表通常不需要增加这种…
 */

listitem

@thedaviddias

编程协作开源协议: MIT
/**
 * Use when applies to HTML documents with `<li>` elements. Also applies to custom
 */

llm-parsability

@thedaviddias

编程协作开源协议: MIT
/**
 * Use when auditing content pages for AI discoverability. Applies to any informati
 */

llms-txt

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审计公开文档门户、API 参考、帮助中心、SDK 文档或大型知识库时使用。检查站点根路径 `/llms.txt` 实际服务的最终文件,并验证其链接的页面是否…
 */

loading-indicators

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审计与 Show loading indicators 相关的慢速页面加载、重量级资源或渲染延迟。在建议更改之前,请在 DevTools、Lighthous…
 */

local-business

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审核本地企业网站的结构化数据。适用于任何在实体地点或特定地理区域服务客户的企业。
 */

locale-images

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查图片资源、图标库或用于渲染插图的组件时使用,以识别可能需要区域设置覆盖或替换为中性替代方案的文化特定内容。
 */

logical-properties

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审阅与 i18n 和 RTL 支持相关的样式表、组件样式及响应式行为时使用。请先在断点和交互状态下检查渲染后的布局,再提出修复方案。
 */

lowercase

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查 URL 结构或为新站点配置路由时使用。适用于任何允许大小写不敏感文件系统的服务器或框架(Linux 服务器默认区分大小写)。
 */

memory-leaks

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查脚本、客户端组件、打包产物或与防止常见内存泄漏模式相关的运行时行为时使用。需要同时检查源代码和浏览器执行路径,以确保修复针对的是真正的瓶颈或缺陷。
 */

meta-description

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审查页面元数据或为新页面生成描述时使用。适用于所有应当获得自然搜索流量的页面。
 */

meta-in-body

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审计 HTML 文档结构。适用于任何可能由 CMS 插件、小组件或 JavaScript 渲染将 meta 标签(noindex、canonical-url…
 */

meta-refresh

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于在审查与“避免使用 meta 刷新重定向”相关的渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义,再视情况检查键盘行为、焦点流转、可访问名称以…
 */

meta-title

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审计页面元数据或生成 SEO 友好的标题。适用于所有应出现在搜索结果中的 HTML 页面。
 */

mime-type

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审计服务器配置或排查资源加载异常时使用。适用于任何提供 HTML、CSS、JS、图片、字体或其他静态资源的 Web 服务器。
 */

mixed-content

@thedaviddias

编程协作开源协议: MIT
/**
 * 用于审查 HTTPS 页面中通过明文 HTTP 加载的资源(脚本、图片、样式表、iframe)。
 */

mobile-testing

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查与在真实移动设备和视口上进行测试相关的 CI 覆盖、自动化检查或测试策略时使用。重点关注该规则是否被持续验证,而不仅仅是被记录在案。
 */

mock-best-practices

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查 CI 覆盖率、自动化检查或与遵循模拟最佳实践相关的测试策略时使用。关注规则是否被持续验证,而不仅仅是停留在文档层面。
 */

modal-accessibility

@thedaviddias

编程协作开源协议: MIT
/**
 * 在审查渲染后的 HTML、可交互组件或与 Make 弹窗对话框键盘可访问性相关的设计系统模式时使用。优先检查原生语义,然后根据需要检视键盘行为、焦点流转、可访问…
 */