Thedaviddias Front End Checklist

/**
 * 适用于打算在 X（Twitter）上分享的任何页面。适用于审查社交分享预览或为新站点添加社交 meta 标签时使用。
 */

/**
 * 在审查与“避免隐式类型强制转换”相关的脚本、客户端组件、打包产物或运行时行为时使用。同时检查源代码与浏览器执行路径，以便正确定位真实的瓶颈或 Bug。
 */

/**
 * 在审查 TypeScript 文件中的 import 语句、初始化一个新的 TypeScript 项目，或排查因仅类型依赖意外打入 bundle 时使用。
 */

/**
 * 在搭建新的 TypeScript 项目、审查现有 tsconfig.json，或检视存在空引用错误或隐式 any 类型的代码时使用。
 */

/**
 * 用于审查与“确保所有 ID 唯一”相关的模板、渲染后的 HTML 或共享组件。验证最终面向浏览器的标记，而不是仅验证源码中的框架抽象。
 */

/**
 * 在审查 CI 覆盖率、自动化检查或与“编写单元测试”相关的测试策略时使用。重点关注规则是否被持续验证，而不仅仅是停留在文档层面。
 */

/**
 * 用于审查与“移除未使用的 CSS 规则”相关的样式表、组件样式以及响应式行为。在提出修复方案前，先检查各断点和交互状态下渲染后的布局。
 */

/**
 * 适用于任何嵌入或托管视频内容（YouTube、Vimeo、自托管）的页面。适用于向站点添加视频内容或审计结构化数据覆盖情况。
 */

/**
 * 用于审查与“通过字幕让视频可访问”相关的模板、渲染后的 HTML 或共享组件。请验证最终面向浏览器的标记，而不仅仅是源框架的抽象层。
 */

/**
 * 适用于所有 `<video>` 元素以及页面所有者可以控制内容的第三方视频嵌入（YouTube、Vimeo）。预先录制的视频需要通过 `<track>` 提供 …
 */

/**
 * 当适用于 HTML 中的所有 `<video>` 元素时使用。`poster` 属性指定在视频加载或播放之前用作占位符的图片的 URL。这与字幕或音频描述不同，…
 */

/**
 * 在单页或多页应用中添加页面切换动画、图片展开/收起效果、共享元素过渡，或改进导航用户体验时使用。
 */

/**
 * 在审查模板、渲染后的 HTML 或与设置响应式 viewport meta 标签相关的共享组件时使用。需要校验最终面向浏览器的标记，而不是仅仅校验源码中的框架抽…
 */

/**
 * 当 HTML 文档中存在任何 `<meta name='viewport'>` 元素时使用。检查其 `content` 属性是否包含 `user-scalabl…
 */

/**
 * 在审查 CI 覆盖率、自动化检查或与“使用视觉回归测试”相关的测试策略时使用。重点关注规则是否被持续验证，而非仅仅被记录。
 */

/**
 * 在审查与“根据 W3C 标准校验 HTML”相关的模板、渲染后的 HTML 或共享组件时使用。请校验最终面向浏览器的标记，而不是仅校验源代码中的框架抽象层。
 */

/**
 * 适用于任何页面超过 20 个的站点。在审计站点架构、调查某些页面在搜索中表现不佳的原因时，或在站点迁移之后使用。
 */

/**
 * 在审查与“链接 Web App Manifest 以支持可安装性”相关的模板、渲染后的 HTML 或共享组件时使用。请校验最终面向浏览器的标记，而不仅仅是源代码…
 */

/**
 * 在审查与安全使用 Web Storage API 相关的脚本、客户端组件、打包产物或运行时行为时使用。需同时检查源码与浏览器执行路径，以便正确定位真正的瓶颈或缺…
 */

/**
 * 用于审查与优化 Web 字体格式相关的样式表、组件样式以及响应式行为。在提出修复方案前，应先核对在不同断点和交互状态下的渲染布局。
 */

/**
 * 用于审查与“使用 WebP 格式并提供回退方案”相关的图片资源、标记以及 CDN 或构建转换。同时检查编码后体积、渲染尺寸、加载策略以及首屏（above-the…
 */

/**
 * 在审查与“使用 WebPageTest 分析性能”相关的模板、渲染后的 HTML 或共享组件时使用。验证最终面向浏览器的标记，而不仅仅是源框架的抽象层。
 */

/**
 * 适用于具有内部站点搜索功能的网站。适用于优化品牌搜索结果展示或首次添加结构化数据的情况。
 */

/**
 * 适用于关键落地页、博客文章、产品页面以及任何针对竞争性关键词的页面。用于诊断排名不佳或在 Google 有用内容更新（Helpful Content updat…
 */