老板会员

提高Shopify在线商店速度的字体、故障排除工具因素

跨境小能手

我这个人很懒还没有签名哦!!

2022-03-28

字体对于在线商店中的文本，您可以从多种字体中进行选择。但是，如果您使用的是客户的计算机上尚未存在的字体，则必须先下载该字体，然后才能显示文本。这会影响加载您的商店所需的时间。为了避免在客户的计算机上下载新字体，您可以使用系统字体。

字体

对于在线商店中的文本，您可以从多种字体中进行选择。但是，如果您使用的是客户的计算机上尚未存在的字体，则必须先下载该字体，然后才能显示文本。这会影响加载您的商店所需的时间。

为了避免在客户的计算机上下载新字体，您可以使用系统字体。系统字体是一种在大多数计算机上已安装的字体。

您可以选择等宽、衬线或无衬线字体系列。当您使用这些字体系列中的任何一种时，您仍可以使用字体样式，例如粗体或斜体。

客户的计算机上显示的字体取决于其操作系统。以下是选择系统字体系列时可能用于呈现文本的一些字体示例：

等宽：Menlo、Consolas、Monaco、Liberation Mono 或 Lucida Console
无衬线：BlinkMacSystemFont、Segoe UI、Roboto、Ubuntu 或 Helvetica Neue
衬线：Iowan Old Style、Apple Garamond、Baskerville、Times New Roman、Droid Serif、Times 或 Source Serif Pro

故障排除工具

您可以使用以下工具来调查在线商店的速度。

如果您是开发人员，您可以使用 Shopify 工具和最佳做法来进一步优化您的模板的性能。在 Shopify.dev 了解更多信息。

Lighthouse

Shopify 的在线商店速度报告使用 Lighthouse 来测量商店的速度。您可以使用 Google PageSpeed Insights 运行自己的 Lighthouse 报告，以查看更详细的商店页面指标。若要了解这些指标的含义，请参阅 Google Lighthouse 性能评分文档。您还可以聘请 Shopify 专家来帮助您了解这些指标和提出改进建议。

注意

由于使用 Google PageSpeed Insights 运行报告时的测试条件不同，因此您得到的评分可能与在线商店速度报告中列出的评分不同。了解 Shopify 测试环境。

适用于 Chrome 的 Shopify 模板检查器

适用于 Chrome 的 Shopify 模板检查器是一个使用火焰图来显示 Liquid 渲染性能的分析工具。此工具可帮助您识别哪些代码行减慢了在线商店页面的速度。了解如何使用 Shopify 模板检查器。

注意

此扩展适用于熟悉怎样查阅和编辑代码的商家和合作伙伴。如果您不熟悉怎样查阅或编辑代码，则可以聘请 Shopify 专家来指导您。Shopify 专家还可以帮助您使用此工具的结果来提高商店性能。

获取在线商店速度方面的支持

如果您使用 Shopify 提供的免费模板，Shopify 支持团队也许能够帮助您进行基本的性能改进。

如果您使用第三方模板并需要帮助，则必须联系模板开发者或聘请 Shopify 专家。

如果您有开发团队或代理合作伙伴，您还可以联系他们获取更多帮助。

Shopify商户官网原文详情：

Fonts

You can choose from several fonts for the text in your online store. However, if you use a font that does not yet exist on your customer's computer, then the font has to be downloaded before your text can be displayed. This impacts the time that your store takes to load.

To avoid downloading a new font to your customer's computer, you can use a system font. A system font is a font that is already installed on most computers.

You can select a mono, serif, or sans-serif font family. You can still use font styles, such as bold or italic, when you use any of these font families.

The font that displays on your customer's computer depends on their operating system. Below are some examples of the fonts that might be used to render text when you select a system font family:

Mono: Menlo, Consolas, Monaco, Liberation Mono, or Lucida Console
Sans-serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, or Helvetica Neue
Serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, or Source Serif Pro

Troubleshooting tools

You can use the following tools to investigate your online store's speed.

If you're a developer, then you can further optimize your theme for performance using Shopify tools and best practices. Learn more on Shopify.dev.

Lighthouse

Shopify's Online store speed report uses Lighthouse to measure the speed of your store. You can run your own Lighthouse report using Google PageSpeed Insights to view more detailed metrics for pages in your store. To learn about what these metrics mean, refer to the Google Lighthouse performance scoring documentation. You can also hire a Shopify expert to help you understand the metrics and suggest improvements.

Caution

Because the test conditions are different when run from Google PageSpeed Insights, your score might be different from the score listed in the Online store speed report. Learn about the Shopify test environment.

Shopify Theme Inspector for Chrome

The Shopify Theme Inspector for Chrome is a profiling tool that uses a flame graph to display Liquid render performance. This tool helps you to identify the lines of code that slow down pages in your online store. Learn how to use the Shopify Theme Inspector.

Caution

This extension is intended for merchants and Partners who are comfortable with reading and editing code. If you're not comfortable with reading or editing code, then you can hire a Shopify expert to guide you. A Shopify expert can also help you to improve your store performance using the results of this tool.