如何提高店铺页面性能丨网页加载速度慢解决方法
您可以采取多种措施来提高网站的性能，这些步骤包括优化网页设计因素，例如图像大小、代码格式和外部脚本使用，以及适度适用店铺功能和应用。
当网页加载速度更快、更可靠时，它们不仅可以提供更好的用户体验，而且在自然搜索结果中往往排名更高，对潜在访问者更可见，并且通常会看到 更高的转化率 。
店铺功能与页面性能
店铺页面由一系列功能模块组成，例如：模版代码、应用、图片、视频、支付、分享、数据分析埋点等。这些功能可以改善整体访客体验，并扩展店铺页面的功能。
您添加到店铺页面的每一项功能都是需要网络和硬件资源才可以正常运行的，某些功能需要的资源比其它功能更多，添加新的功能可能会对您的店铺性能产生显著影响。
当您考虑向店铺页面添加某项功能时，应该权衡它带来的价值与它对店铺页面性能产生的影响。某些情况下，为了提供更好的访客体验去提高转化率，您可能需要选择牺牲一些性能。
| 备注：仅在店铺管理后台使用的应用不会影响店铺的速度。 |
页面性能排查工具
您可以使用以下工具来检测在线商店的网页速度：
您可以使用 Google PageSpeed Insights 运行自己的 Lighthouse 报告，以查看更详细的商店页面指标。若要了解这些指标的含义，请参阅 Google Lighthouse 性能评分文档。
Lighthouse 报告讲解
以 Google PageSpeed Insights 获取的 Lighthouse 报告为例，您需要重点关注 Largest Contentful Paint、Total Blocking Time 两项指标，当指标状态显示为红色时，可以参考以下操作进行优化：
当 Total Blocking Time 指标异常时：
当 Largest Contentful Paint 指标异常时：
| 备注：上述内容仅对SHOPLINE官方提供的主题适用，非官方或私有主题请与对应开发者联系。 |
页面性能影响因素
店铺页面速度受多方面因素影响，按您是否可以控制为条件，我们可以将它们划分为 可控因素 及 不可控因素。
以下内容除了讲解店铺页面性能涉及的因素外，还会在可控因素部分给出如何处理这些因素的方法。
可控因素
1. 应用
当您添加应用去扩展店铺功能或外观时，这些应用会在模版中添加代码，这样它们才能运行。应用插入的代码与主题模版代码在同一个环境运行，会对页面的性能造成损耗。
复杂功能应用对性能造成的影响会更加明显，因此，我们建议您：
- 减少安装应用的数量，删除不使用或不需要的应用，在店铺功能和性能之间做好平衡。
- 避免插入大量自定义代码，自定义代码容易对主题模版原有结构产生破坏，除非您能保证插入的自定义代码对页面不会产生太大影响。
- 功能相近的应用尽量选择性能卓越的安装。
| 备注：仅在店铺管理后台使用的应用不会影响店铺的速度。 |
2. 图片和视频
过大的图片和页面中隐藏的图片可能会对加载页面中的其它更重要的部分造成干扰。如果用户需要等待图片加载的时间过长，他们可能会认为这个店铺访问速度太慢。
Shopline 官方提供的主题对图片和视频都做了一系列优化处理。例如：
- 延迟加载当前屏幕上未显示的图片或视频。
- 根据屏幕尺寸加载特定规格尺寸的图片。
- 渐进式加载 gif 大图。
| 备注：上述内容仅对SHOPLINE官方提供的主题适用，非官方或私有主题请与对应开发者联系。 |
但是，这些优化措施并不能完全解决图片或视频对店铺性能的影响，您对店铺的配置也可能会对性能造成影响，因此我们建议：
- 参考 图片尺寸建议 配置图片。
- 避免使用大尺寸 GIF 图片，改用 PNG / JPG 格式图片（相同尺寸图片 GIF 格式的大小远大于其它图片格式）。
- 单个商品分类关联的商品、单个商品关联的 SKU 图片不要超过 50 个。
3. 分析库
Shopline 提供了 Facebook Pixel、Google Ads、Google Analytics、Google 代码管理工具、Google 再营销工具、Bing 关键词广告等多种平台的事件追踪分析能力支持，这些分析能力的开启需要占用一定页面资源，大量开启也会对店铺页面性能产生影响。因此，我们建议您：
- 根据您的实际情况选择合适的事件追踪分析，在店铺功能和性能之间做好平衡。
4. 主题模版
主题模版由 Handlebar、HTML、CSS 和 Javascript 代码组成。编辑或自定义模版时，文件大小可能会增大，并影响商店速度。
Shopline 官方提供多套免费主题模版，并不定时进行优化更新，对官方模版进行自定义代码编辑后将会导致模版变为私有模版，私有模版将无法及时同步到官方主题的最新优化。
如果您认为模版存在性能问题，可以尝试以下步骤：
- 如果您使用的是 Shopline 官方主题模版，那么您可以联系 Shopline 官方团队以获取指导。如果您使用的是第三方或私有模版，则可以联系模版开发者进行咨询。
- 考虑安装官方 OS 2.0 优化主题，例如：Arise主题。
不可控因素
1. 客户的设备、网络和地点
访问您店铺的客户遍布全球各地，并且其设备和网络连接各不相同。这也就意味着商店的加载速度可能因这些因素而加快或减慢。
例如：您开设的是美国店铺，Shopline 将为您店铺做针对于美国地区做资源访问加速，如果客户在中国进行访问，那么这个客户的页面加载速度会相较于美国地区访问慢。
2. 本地浏览器缓存
您的店铺静态资源将会在客户的本地存储中暂时缓存或保存。当客户下次访问您的店铺时，浏览器可以从缓存中加载资源，而不必向服务器发送其他请求。
Shopline 将店铺中可缓存资源的浏览器缓存时间设置为一年。可缓存的文件包括图片文件、PDF、JS 文件和 CSS 文件。
3. 服务器端页面缓存
除了本地浏览器缓存外，Shopline 还在服务器端缓存页面。第一次加载页面时，可能速度较慢，但以后页面加载速度会加快，因为客户将接收缓存的副本。