主要观点：在emoji-picker-element上出现性能问题，因 19k（接近 20k）自定义表情导致 40k 元素，未使用虚拟化，渲染极慢，Lighthouse 建议不超过 1400 个元素。起初使用<img loading="lazy">但效果不佳，后尝试CSS content-visibility，虽有改进但仍有问题，深入研究发现loading="lazy"并非免费午餐，最终将 40k DOM 元素减半为 20k，使用IntersectionObserver实现更高效的“loading='lazy'”，性能提升约 40%（Chrome）和 35%（Firefox），虽对content-visibility满意但深知渲染 20k DOM 节点不如虚拟化列表快，期待 Web 平台有内置虚拟列表。
关键信息：

• 19k 自定义表情致 40k 元素，未用虚拟化，渲染慢。
• 尝试content-visibility及 Tachometer 基准测试。
• 发现loading="lazy"并非免费，最终优化。
• 性能提升约 40% - 45%，但仍不如虚拟化列表。
  重要细节：
• 不同服务器可有自定义表情，如 Mastodon 等。
• 介绍content-visibility特点及不影响访问性树等。
• 利用 emoji 类别进行大小估计和布局。
• 通过chrome:tracing等工具查找性能问题。
• 最终实现更高效的“loading='lazy'”方案。