我认为这是 Safari/Webkit 中的一个错误，因为我在 Chrome/Firefox 中没有看到这个问题。
在此网站上出现错误：
https://fonts.google.com/noto/specimen/Noto+Color+Emoji
在 Safari 上，noto color 网站为我显示了 IOS 表情符号几秒钟，然后才实际渲染谷歌表情符号： https://fonts.google.com/noto/specimen/Noto+Color+Emoji。但在我的应用程序上，这不是行为。在我的应用程序中，应用程序在显示正确的表情符号之前冻结。但是当我进入字形选项卡时，该应用程序甚至在谷歌字体网站上冻结，以类似的方式： https://fonts.google.com/noto/specimen/Noto+Color+Emoji/glyphs
由于我也在 Firefox 上测试了这个，据我所知，它不使用 chromium，并且它在那里运行流畅，因此我认为这是 Safari 的错误/问题。
相关，但我提出了一个更具体的问题： CSS 动画在 iOS 上极其缓慢、滞后且糟糕，但在桌面上却很好
我刚刚确保我的应用程序中的每个表情符号都以 noto 颜色字体显示。但现在，当我导航到使用 noto 颜色表情符号的视图时，它总是冻结。
我尝试使用嵌入方法来包含表情符号，而不是链接本地文件。相同的结果。同时使用
<link>import我也在考虑这种方法，如 noto 颜色字体网站的 IOS 选项卡上的链接： https://developer.apple.com/documentation/uikit/text_display_and_fonts/adding_a_custom_font_to_your_app 也许这可以解决缓慢的问题，但我不确定它是否可以做到这一点。我知道这是否确实有帮助，然后 lmk。我的应用程序是 CapacitorJS 应用程序。所以我不知道如何用电容器来做到这一点。也许有人可以告诉我怎么做？
从此处下载的 NotoColorEmoji-Regular.ttf： https://fonts.google.com/noto/specimen/Noto+Color+Emoji 是24MB。我认为缓慢可能是由于尺寸太大造成的。也许它不会出现在 chrome 上，因为
也许有某种方法可以让应用程序在 Safari 上一劳永逸地实现这种“预加载”？不让我的屏幕每次都冻结吗？
我还尝试过使用 twemoji 字体，但在 Safari 上没有发生这种情况。但我更喜欢 Noto Color 字体。然而，将 twemoji 与生成的子集一起使用（如下所述）对我来说是最后的手段。如果真的没有人知道答案，那么也许有人可以提供如何为 twemoji 或 Noto 生成这个子集的答案。
这里的第八条评论列出了带有 twemoji 的 woff2 文件的 url： https://issues.chromium.org/issues/40766658 我下载了这个文件并链接到我的应用程序中，该应用程序在 Safari 上运行顺利。但文件大小也只有 78KB，因为它以某种方式被压缩，如下所述： https://github.com/talkjs/country-flag-emoji-polyfill
“这很重要，因为 Twemoji Mozilla 为 1.5MB，这对您的应用程序性能来说是一个相当大的影响。子集只有 78kb，这要好得多。”
也许有人可以提供有关如何创建子集字体文件的指南？我不需要 noto 字体中的所有表情符号。不比 78Kb twemoji 标志 woff2 中包含的内容多多少。我尝试按照上面 github 链接中的指南进行操作，但无法创建自己的自定义字体
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
⚡️🌍❌✅
</body>
<style>
@font-face {
font-family: 'Noto Color Emoji';
font-style: normal;
font-weight: 400;
src: url('./NotoColorEmoji-Regular.woff2') format('woff2');
}
body {
font-family: 'Noto Color Emoji', sans-serif;
}
</style>
</html>
我使用这个网址来生成文件：
https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&text=👇⌨️🔠⚡️❌✅🏆💡🌎📋🇺🇳⭐️🏙️🌳🌐📸❓🇦🇹🎡🇺🇸🇩🇪🌍🌎🇪🇺🇮🇳🇧🇷🇷🇺🌆🌏🇵🇱🇦🇺🇨🇦🇫🇷🇪🇸🇨🇳🇮🇹🇺🇦🏜️🏔️🏞🌋🇬🇧🌊🗺️🏛️👥🪲🧠🏅🥇🥈🥉🇦🇫🇦🇱🇩🇿🇦🇸🇦🇩🇦🇴🇦🇮🇦🇶🇦🇬🇦🇷🇦🇲🇦🇼🇦🇺🇦🇹🇦🇿🇧🇸🇧🇭🇧🇩🇧🇧🇧🇾🇧🇪🇧🇿🇧🇯🇧🇲🇧🇹🇧🇴🇧🇦🇧🇼🇧🇷🇮🇴🇻🇬🇧🇳🇧🇬🇧🇫🇧🇮🇰🇭🇨🇲🇨🇦🇮🇨🇨🇻🇧🇶🇰🇾🇨🇫🇹🇩🇨🇱🇨🇳🇨🇽🇨🇨🇨🇴🇰🇲🇨🇬🇨🇩🇨🇰🇨🇷🇨🇮🇭🇷🇨🇺🇨🇼🇨🇾🇨🇿🇩🇰🇩🇯🇩🇲🇩🇴🇪🇨🇪🇬🇸🇻🇬🇶🇪🇷🇪🇪🇸🇿🇪🇹🇫🇰🇫🇴🇫🇯🇫🇮🇫🇷🇬🇫🇵🇫🇹🇫🇬🇦🇬🇲🇬🇪🇩🇪🇬🇭🇬🇮🇬🇱🇬🇩🇬🇵🇬🇺🇬🇹🇬🇬🇬🇾🇭🇹🇭🇳🇭🇰🇭🇺🇮🇸🇮🇳🇮🇩🇮🇷🇮🇶🇮🇪🇮🇲🇮🇱🇮🇹🇯🇲🇯🇵🎌🇯🇪🇯🇴🇰🇿🇰🇪🇰🇮🇰🇵🇰🇷🇰🇼🇰🇬🇱🇦🇱🇻🇱🇧🇱🇸🇱🇷🇱🇾🇱🇮🇱🇹🇱🇺🇲🇴🇲🇰🇲🇬🇲🇼🇲🇾🇲🇻🇲🇱🇲🇹🇲🇭🇲🇶🇲🇷🇲🇺🇾🇹🇲🇽🇫🇲🇲🇩🇲🇨🇲🇳🇲🇪🇲🇸🇲🇦🇲🇿🇲🇲🇳🇦🇳🇷🇳🇵🇳🇱🇳🇨🇳🇿🇳🇮🇳🇪🇳🇬🇳🇺🇳🇫🇲🇵🇰🇵🇳🇴🇴🇲🇵🇰🇵🇼🇵🇸🇵🇦🇵🇬🇵🇾🇵🇪🇵🇭🇵🇳🇵🇱🇵🇹🇵🇷🇶🇦🇷🇪🇷🇴🇷🇺🇷🇼🇼🇸🇸🇲🇸🇹🇸🇦🇸🇳🇷🇸🇸🇨🇸🇱🇸🇬🇸🇽🇸🇰🇸🇮🇸🇧🇸🇴🇿🇦🇬🇸🇰🇷🇸🇸🇪🇨🇭🇸🇾🇹🇼🇹🇯🇹🇿🇹🇭🇹🇱🇹🇬🇹🇰🇹🇴🇹🇹🇹🇳🇹🇷🇹🇲🇹🇨🇹🇻🇺🇬🇺🇦🇦🇪🇬🇧🇺🇸🇻🇮🇺🇾🇺🇿🇻🇺🇻🇦🇻🇪🇻🇳🇼🇫🇪🇭🇾🇪🇿🇲🇿🇼
测试于：
来自文档（强调我的）：
NotoColorEmoji 使用 CBDT/CBLC 颜色字体格式，Android 和 Chrome/Chromium 操作系统均支持该格式。 Windows 从 Chrome 和 Edge 中的 Windows 10 周年更新开始支持它。 在 macOS 上，只有 Chrome 支持它，而在 Linux 上它将通过一些字体配置调整来支持它[...]
您可以在 caniuse 上查看 Safari 的支持跟踪（在撰写本文时，v17.5 不受支持）。
您可以检查 CBDT 支持，然后回退到 SVG 版本，Safari 和 Firefox 支持，但 Chrome 不支持：
@font-face {
font-family: 'Noto Color Emoji';
src:
url('./NotoColorEmoji-Regular.woff2') format('woff2') tech(color-cbdt)
url('https://github.com/adobe-fonts/noto-emoji-svg/releases/download/2.100/NotoColorEmoji-SVG.otf') format('opentype')
}