Google Material Symbols 子集化咨询：仅用2个符号如何缩减加载体积

针对仅需2个符号的场景，有两种无需存储字体到自有服务器的简易方案：

1. 利用Google Fonts的text参数子集化 #

Google Fonts支持通过text参数指定仅加载你需要的符号，直接在现有链接后追加该参数即可：

• 可直接传入符号文本，或对应的Unicode编码（避免字符转义问题）
• 示例代码（假设需要「主页」和「搜索」符号，对应Unicode为U+E88A和U+E8B6）：

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&text=&#xE88A;&#xE8B6;" />

此方式只会加载指定的2个符号字形，体积可压缩至几KB级别。

2. 直接嵌入SVG图标 #

如果仅需少量符号，直接使用SVG是更轻量化的选择：

• 找到目标符号对应的SVG代码，直接嵌入HTML中，无需加载任何字体文件
• 示例（主页符号的SVG）：

<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24" fill="#000000">
  <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/>
</svg>

你可以通过CSS直接控制SVG的width、height、fill等样式，灵活性更高，且完全无字体加载开销。

内容的提问来源于stack exchange，提问作者lwchkg