「Shopify」第 2 页 - 光算科技

Shopify 第三方脚本审计：应用脚本、像素与同意管理工具的取舍

脚本审计的产出应是一张归属表，而不是一份删除清单。本文给出从源码与网络请求拉清单、按应用授权核对归属的方法，以及必需、延迟、合并替换、移除的判断顺序，并说明同意管理与统计脚本的加载顺序问题。

INP 衡量的是交互到画面反馈的延迟，跟加载速度是两件事。本文讲清一次交互的三段延迟、Shopify 店里最常堵主线程的几类脚本与事件处理，并给出先定交互类型、再定位脚本、最后决定延迟或移除的排查顺序。

CLS 偏高通常来自四类来源：无尺寸的图片、应用注入的横幅弹窗、字体替换、异步插入的内容区。本文给出按来源定位的操作顺序，说明哪些主题层能修、哪些只能找应用方，并讲清 opacity 与 display 隐藏的差别。

首屏大图被加上 loading="lazy" 是 Shopify 主题里最常见的性能错误。本文按先确认 LCP 元素、再改加载方式、最后验证的顺序，给出 image_tag 的改法与 fetchpriority 的使用边界。

在 Shopify 上做性能优化，先分清平台默认处理的与主题里做错的两类问题。这篇文章讲清 LCP、INP、CLS 各自对应的体验与常见成因，并给出建立基线、同口径对比和排改动优先级的步骤。

可访问性检查从只用键盘走一遍购买路径开始。这篇文章给出键盘测试步骤、对比度的实测方法、表单错误提示的检查项和图片替代文本的判断表，并说明可访问性与 SEO 的重叠与边界。

大型菜单的第一要求不是好看，而是主要分类能从初始 HTML 的链接到达。这篇文章给出多级菜单的 Liquid 写法、悬停与点击的取舍、移动端折叠的处理，以及上线前的验收顺序和常见误区。

元字段适合存规格、使用场景、常见问题与资料下载，不适合当关键词仓库。这篇文章给出产品模板里渲染元字段的最小写法、缺失值的处理方式，以及上线前怎么确认内容真的出现在可抓取的 HTML 里。

自定义 section 的价值是商家不碰代码就能改内容。文章给出一个最小可用文件的结构，讲清设置类型怎么选、默认值为什么必须能直接上线、如何避免把某个品类写死，以及图片、字体、脚本计入性能预算的判断方法。

换主题掉排名，通常是旧主题输出的东西没被搬过去。文章给出改版前要冻结的五项快照、最容易丢的三类输出（模板级元信息、结构化数据、被主题覆盖的 URL 处理），以及改后按抓取、canonical、条目、内链、404 顺序验收的做法。