必须是第一个标签，因浏览器解析HTML前1024字节时若未识别该声明，将回退至系统默认编码（如GBK或ISO-8859-1），导致中文乱码、class截断、CSS失效；位置错误（如前有注释、空格或）会使旧版Android WebView等跳过识别。
把 放在 最开头，紧跟着是 ，再之后才是 和 —— 顺序错一位，首屏就可能白屏几百毫秒。
为什么
浏览器解析 HTML 是流式的， 若不在最前（比如前面有注释、空格或 开始，中间不能有任何字符（包括换行）。
常见错误现象：
- 本地双击打开 HTML 时中文显示为方块
- Webpack/Vite 构建后，
html-webpack-plugin模板意外插入了空行 - SSR 中 Node.js 流未先 flush charset 声明就写入其他内容
它必须紧跟在 后面。如果浏览器开始渲染后再遇到 viewport，会先按桌面宽度布局，等解析到该标签再强制缩放重排 —— 用户看到“闪一下变大/变小”，CLS 指标直接拉高。
使用场景和参数注意点：
- content 值只用
width=device-width, initial-scale=1.0，禁用maximum-scale=1.0和user-scalable=no（可访问性审查失败 + iOS 双击放大失效） - 不要写
width=375这类固定值，高 DPR 设备（如 Pixel 7）会误判分辨率，文字发虚 - 所有移动端页面都必须配，且位置不可妥协
不是“越早写越好”，而是“必须出现在浏览器解析到它时，关键资源请求还没发起”。一旦写在 后面，很可能样式请求已发出，预加载就成无效带宽竞争。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
实操建议：
- 字体、首屏 CSS、LCP 图片的
必须放在最前面，紧挨和 - preload 字体时
crossorigin属性必加，否则字体不会生效（2026 年仍有效） - 别对
main.js加 preload —— 它已被defer覆盖，重复预加载反而挤占 HTTP/2 流 - as 属性必须配对：
as="style"、as="image"、as="font"，否则浏览器不提升优先级
<script></script> 的相对位置是硬约束
CSS 是渲染阻塞资源，浏览器必须构建完 CSSOM 才能绘制第一帧。如果 出现在 <script></script> 后面，浏览器会先卡在 script 上等 JS 下载执行，再回头下载 CSS —— 双重阻塞。
关键规则：
- 所有
必须在任何<script></script>标签之前 - 禁止在 CSS 文件里用
@import引入其他样式表，它强制串行加载，实测拖慢 FCP 300ms+ - 非关键 CSS（如
.modal、暗色模式）用media="print" onload="this.media='all'"延迟加载 - 首屏关键 CSS 应内联进
，但只提取真实首屏用到的规则（如.hero、.nav），控制在 10–14KB 内
最容易被忽略的是：很多团队以为“把所有 CSS 内联 = 优化”，结果体积暴涨、无法缓存、后续更新不同步 —— 真正有效的内联，必须靠工具（如 critters 或 penthouse）提取并验证覆盖范围。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
